Tạo banner trượt cho web wordpress theme flatsome (phần 1)

Có 1 đoạn code html và css sẽ giúp bạn Tạo banner trượt cho web wordpress theme flatsome rất đẹp , nhẹ và rất có ích nhé !

Tạo banner trượt cho web wordpress theme flatsome

Cùng bạn cùng xem demo sau khi đặt nhé.

Cách tạo banner trượt cho web wordpress theme flatsome

Sau đây bạn vào Global Settings / FOOTER SCRIPTS và chèn đoạn code này vào:

<div class=”banner_fix banner_fix_left” style=”top: 60px;”>

<a href=”http://tinvanphong.net/”><img alt=”tinvaphong.net”

src=”https://binance24h.online/wp-content/uploads/2022/05/exel.jpg”></a>

</div>

<div class=”banner_fix banner_fix_right” style=”top: 60px;”>

<a href=”http://tinvanphong.net/”><img alt=”tinvaphong.net” src=”https://binance24h.online/wp-content/uploads/2022/05/exel.jpg”></a>

</div>

bạn có thể chèn trực tiếp vào theme ( file head hoặc file tương tự trong themes )

Sau khi đặt xong nhớ coppy code css sau dán vào nhé:

<style>

.banner_fix_left

right: calc((1240px) + (100% – 1240px)/2);

transition: all .3s;

.banner_fix

display: block;

position: fixed;

margin-top: 100px;

.banner_fix_right

left: calc((1240px) + (100% – 1240px)/2);

transition: all .3s;

</style>

Chú ý : ví như bỏ vào text box css thì đừng để thẻ <style></style> nhé có chiếc css trên right: calc((1240px) + (100% – 1240px)/2); ( đang định nghĩa layout của bạn là 1240px ) nếu layout của bạn là số khác bạn có thể thay lại cho phù hợp nhé.

Code CSS này khi Zoom web banner sẽ ko trồng lên content rất hợp lý và đẹp mắt nhé.

Cảm ơn các bạn đã đọc bài viết này của An Nhiên

Chúc các bạn thành công!

5/5 - (3 votes)

Tạo banner trượt cho web wordpress theme flatsome (phần 1)

Tạo banner trượt cho web wordpress theme flatsome

Cách tạo banner trượt cho web wordpress theme flatsome

Bài Viết Mới

Có Thể Bạn Quan Tâm

Bài Viết Xem Nhiều Nhất

Chuyên Mục

AN NHIEN TECHNOLOGY COMMUNICATION COMPANY LIMITED Ad : 75A ngõ 94 Hồng Mai, Phường Bạch Mai, Quận Hai Bà Trưng, Tp. Hà Nội, Việt Nam Điện thoại: 03.464.99999 Email : [email protected] AGENCY MARKETTING - FULL SERVICES

Link Mạng Xã Hội

AN NHIEN TECHNOLOGY COMMUNICATION COMPANY LIMITED
Ad : 75A ngõ 94 Hồng Mai, Phường Bạch Mai, Quận Hai Bà Trưng, Tp. Hà Nội, Việt Nam
Điện thoại: 03.464.99999
Email : [email protected]
AGENCY MARKETTING - FULL SERVICES