• Speedtest Internet
  • Test Code
  • Nén CSS
  • Chuyển đổi định dạng Webp
  • Mã Hóa URL
  • Shorturl
Blog thủ thuật máy tính f4vnn
No Result
View All Result
18 Tháng Tám , 2022
  • Login
  • Trang chủ
  • TIPS COMPUTER
    • WINDOWS
    • SERVER
    • OFFICE
    • SOFTWARE
    • GAME
    • INTERNET
    • SECURITY
  • TIPS MAC – IOS
  • TIPS MOBILE
  • TIPS SOURCE
    • TIPS WORDPRESS
    • TIPS BLOGSPOT
    • OTHER SOURCE
  • TIPS OTHER
  • REVIEWS
  • LYRICS
  • Trang chủ
  • TIPS COMPUTER
    • WINDOWS
    • SERVER
    • OFFICE
    • SOFTWARE
    • GAME
    • INTERNET
    • SECURITY
  • TIPS MAC – IOS
  • TIPS MOBILE
  • TIPS SOURCE
    • TIPS WORDPRESS
    • TIPS BLOGSPOT
    • OTHER SOURCE
  • TIPS OTHER
  • REVIEWS
  • LYRICS
No Result
View All Result
Blog thủ thuật máy tính f4vnn
No Result
View All Result
Home Tips Source Tips Wordpress

Chia sẻ code làm bảng thông báo đẹp cho WordPress

Blog Tips f4vnn by Blog Tips f4vnn
22/04/2021
Reading Time: 4 mins read

Nội dung chính

  • Code làm bảng thông báo đẹp cho WordPress
    • # Code html bảng thông báo
    • # Css bảng thông báo
  • Kết luận

Code làm bảng thông báo đẹp cho WordPress: Bạn muốn tạo một bẳng thông báo và muốn đặt nó ở dưới hoặc ở đâu đó trong nội dung bài viết của mình trên WordPress để người dùng có thể chú ý đến cái mà bạn muốn mọi người biết đến. Hôm nay rảnh ngồi nghịch, những bạn chuyên code thì mình không nói nhé, cái này chỉ dành cho anh em nào gà code như mình thôi nhé.

Chia sẻ code làm bảng thông báo đẹp cho WordPress

Code làm bảng thông báo đẹp cho WordPress

Vì mình không phải chuyên code nên mọi thứ có thể chưa hợp lý và code có thể rườm rà, nhưng đối với anh em vọc thì có cái để vọc sẽ dễ dàng hơn.

CÓ THỂ BẠN QUAN TÂM:
– Tạo thanh thông báo bằng HTML và CSS cho WordPress
– Tùy biến trang đăng nhập không cần Plugin cho WordPress
– Tạo trang chuyển hướng download cho WordPress

# Code html bảng thông báo

Dưới đây là code của thông báo, các bạn nhớ chỉnh sửa lại nội dung cho phù hợp với bạn nhé.

<div class="wpbcap wpbcap-16762 wpbcap-">
<div class="su-box su-box-style-noise" id="" style="border-color:#f70d28;border-radius:6px">
<div class="su-box-title" style="background-color:#f70d28;color:#FFFFFF;border-top-left-radius:4px;border-top-right-radius:4px">Welcome to f4vnn.com</div>
<div class="su-box-content su-u-clearfix su-u-trim" style="border-bottom-left-radius:4px;border-bottom-right-radius:4px">
<p>Là một web/blog cá nhân, chủ yếu chia sẻ kiến thức về máy tính, internet, công nghệ và thủ thuật WordPress, Blogger...Thủ thuật được tổng hợp từ kinh nghiệm và trên Internet. Mình hi vọng một điều là: Tại đây, các bạn có thể học thêm được rất nhiều kinh nghiệm và thủ thuật khi sử dụng máy tính ^_^</p>
<p><strong>ĐỪNG QUÊN ĐĂNG KÝ <strong><a href="https://www.facebook.com/blogshare24/?modal=admin_todo_tour">FANPAGE</a></strong> ĐỂ NHẬN THỦ THUẬT MỚI NHẤT NHÉ!</strong></p>
</div>
</div>
</div>

# Css bảng thông báo

Dưới đây là Css để làm đẹp cho bảng.

.su-box {
    margin: 0 0 1.5em;
    border-width: 2px;
    border-style: solid;
}
.su-box-title {
    display: block;
    padding: .5em 1em;
    font-weight: 700;
    font-size: 1.2em;
}
.su-box-content {
    background-color: #fff;
    color: #444;
    padding: 1em;
}

Kết luận

Đây là một bảng thông báo đơn giản để bạn đặt vào nội dung bài viết, bạn có thể đặt bất cứ chỗ nào mà bạn muốn đặt nó trong nội dung bài viết nhé. Hy vọng với bài chia sẻ code làm bảng thông báo đẹp cho WordPress mà Blog thủ thuật máy tính f4vnn đã chia sẻ sẽ có ích với bạn, chúc bạn thành công.

Bài Viết Cùng Chuyên Mục
Game & Apk Mod Acapella Việt Template BLogspot Liên Kết URL
Tags: bảng thông báo đẹp cho WordpressChia sẻ code làm bảng thông báo đẹp cho Wordpresscode làm bảng thông báo đẹp cho Wordpresscode to make a beautiful bulletin board for WordpressShare code to make a beautiful bulletin board for Wordpress
ShareTweetPin1ShareShareShare

Related Posts

Chia sẻ giao diện làm trang web download dành cho wordpress

Chia sẻ giao diện làm trang web download dành cho wordpress

15/06/2022
Hướng dẫn cách cài đặt WordPress trên Windows 10

Hướng dẫn cách cài đặt WordPress trên Windows 10

06/12/2021

Chia sẻ danh sách Ping list tăng tốc độ index tốt nhất cho WordPress

04/12/2021

Hướng dẫn cách tạo Popup thông báo bằng html css cho WordPress

15/11/2021

Hướng dẫn cách tùy biến Menu trên Mobile cho WordPress

11/11/2021

Giới thiệu 4 giao diện wordpress chia sẻ video miễn phí cực đẹp

08/10/2021
Next Post
Cân bằng độ ồn Loudness Equalization bị thiếu trên Windows 10

Cân bằng độ ồn Loudness Equalization bị thiếu trên Windows 10

Hướng dẫn 5 cách tăng tốc độ download trên Google Chrome

Hướng dẫn 5 cách tăng tốc độ download trên Google Chrome

☊ BLOG NGHE NHẠC DJ

slide-dj24h

Receive updates of our latest tutorials.

By signing up, you agree to our Privacy Policy.

Facebook logoTwitter logoLinked-in logo

✪ TÌM KIẾM NHANH TRÊN GOOGLE

Mẹo để tìm kiếm nhanh cách sửa lỗi bạn vào Google gõ tên lỗi + từ khóa f4vnn!

☷ BÀI VIẾT MỚI NHẤT

Hướng dẫn sửa lỗi Windows Cannot Connect to the Printer Error 0x0000011b

Hướng dẫn sửa lỗi Windows Cannot Connect to the Printer Error 0x0000011b

13/08/2022
Hướng dẫn cách kiểm tra điện thoại có hỗ trợ 5G

Hướng dẫn cách kiểm tra điện thoại có hỗ trợ 5G

13/08/2022
Hướng dẫn cách kiểm tra phiên bản và cập nhật BIOS

Hướng dẫn cách kiểm tra phiên bản và cập nhật BIOS

08/08/2022
Lời Bài Hát Kèm Acapella Vocal Tự Cắt Duyên Tình – Tú Na

Lời Bài Hát Kèm Acapella Vocal Tự Cắt Duyên Tình – Tú Na

04/08/2022
Hướng dẫn cách cài đặt phần mềm HomePod Public Beta 16

Hướng dẫn cách cài đặt phần mềm HomePod Public Beta 16

02/08/2022

☷ BÀI VIẾT XEM NHIỀU

  • Chuyển từ Google Slides sang PowerPoint và ngược lại 27.6k views
  • Làm thế nào để dừng Fixing Stage 1 trong Windows 10 27k views
  • Sửa lỗi A JavaScript error occurred in the main process trên Windows 10 15.9k views
  • Sửa lỗi Run-time error 1004 không thể chạy Macro trong Excel 15.2k views
  • Cách sửa lỗi Runtime Error 1004 trong Microsoft Excel 11.7k views
  • Cách sửa lỗi Bad Image 0xc000012f trong Windows 10 10.7k views
Blog thủ thuật máy tính f4vnn

© 2021 Blog Tips F4vnn - Chia sẻ thủ thuật công nghệ.

Giới thiệu & Bạn bè

  • Chính sách
  • Quy định
  • About Us
  • DMCA
  • Nhạc DJ24h
  • Truyện Ma
  • Vocal

Follow Us

No Result
View All Result
  • Trang chủ
  • TIPS COMPUTER
    • WINDOWS
    • SERVER
    • OFFICE
    • SOFTWARE
    • GAME
    • INTERNET
    • SECURITY
  • TIPS MAC – IOS
  • TIPS MOBILE
  • TIPS SOURCE
    • TIPS WORDPRESS
    • TIPS BLOGSPOT
    • OTHER SOURCE
  • TIPS OTHER
  • REVIEWS
  • LYRICS

© 2021 Blog Tips F4vnn - Chia sẻ thủ thuật công nghệ.

Welcome Back!

Login to your account below

Forgotten Password?

Retrieve your password

Please enter your username or email address to reset your password.

Log In