Blog iTeam OS
Trang chủ
Blogspot Tips

Thêm Hiệu ứng cho Tiêu đề của Blogger

Với những bài viết không sử dụng hình ảnh làm tiêu đề, thì một thanh tiêu đề đẹp bắt mắt sẽ giúp cho Website của bạn tăng thêm tính chuyên nghiệp

Xin chào Mọi người, nhân dịp này mình sẽ chia sẻ một bài hướng dẫn cách thêm hiệu ứng động tiêu đề trong Blogspot, giống trang blog của mình. Bạn có thể dễ dàng áp dụng hình ảnh động tiêu đề này trên trang Web Blogspot của mình.

Cách này được tạo ra với sự trợ giúp của HTML và CSS, không sử dụng JavaScript. Nếu bạn muốn áp dụng hoạt ảnh tiêu đề này trên blog của mình thì hãy đọc toàn bộ nội dung và làm theo các bước đã cho.

Đừng quên sao lưu mẫu của bạn trước khi thay đổi hoặc thêm hiệu ứng này hoặc thêm bất kỳ thứ gì vào Blogger của bạn. Nếu có bất kỳ vấn đề gì xảy ra với mẫu của bạn, bạn có thể quay về phiên bản trước khi thêm hiệu ứng.

Làm thế nào để thêm hiệu ứng

Bước 1: Đầu tiên bạn cần truy cập vào Blogspot của bạn.

Bước 2: Sau đó nhấp vào Menu Chủ đề.

Bước 3: Nhấp vào Chỉnh sửa HTML.

Bước 4: Sau đó, dán mã CSS ở dưới lên trên thẻ <head>.

<style type='text/css'>
/* Title Animation Css Code */
#iteamos{position:relative}#iteamos:before,#iteamos:after{content:"";position:absolute;top:50%;width:3%;height:100%;transform:translateY(-50%);background:#6200ee;z-index:1}#iteamos:before{left:155%;animation:light-left 1.8s infinite alternate linear}#iteamos:after{right:-55%;animation:light-right 3.0s infinite alternate linear}@keyframes light-left{0%{left:85%;opacity:0}50%{left:40%;opacity:1}100%{left:50%;opacity:0}}@keyframes light-right{0%{right:80%;opacity:0}50%{right:100%;opacity:1}100%{right:0%;opacity:0}}
</style>

Lưu ý: Thay đổi mã màu đã đánh dấu theo ý bạn muốn.

Bước 5: Sau đó tìm hàm HTML ở bên dưới.

<div class='headerInner'>

Bước 6: Sau đó, thay thế nó bằng hàm HTML mới được đưa ra bên dưới.

<div class='headerInner' id='iteamos'>

Bước 7: Đừng quên nhấp vào Lưu chủ đề.

Lời kết

Trong bài viết này, tôi đã Hướng dẫn Thêm Hiệu ứng cho Tiêu đề của Blogspot bằng HTML và CSS. Hy vọng hướng dẫn này có thể hữu ích cho tất cả các bạn và cảm ơn bạn đã ghé thăm trang web của chúng tôi.

Truy cập Bypass Google Account APK để tải file APK nhé