Tạo button slider flatsome đẹp

flatsome

18/01/23

CSS, Blog Wordpress, Thủ thuật

0

Theo dõi tôi qua Google News

một số anh em nghi vấn về cái button slider tạo điểm đặc sắc xíu cho slider trong theme flatsome nhàm chán trước giờ , ok bữa nay tớ chia sẽ phương pháp làm nhé

Tạo button slider flatsome đẹp

Con số bài viết

• Tạo button slider flatsome đẹp
  • có THỂ BẠN để ý
  • cách thức khiến button slider flatsome đẹp

Để dễ hình dung bạn xem qua hình mình đã làm cho Công trình

Tạo button slider flatsome đẹp

một điểm nhấn khác thường so có Slider của Flatsome đúng ko nào , ví như bạn muốn xem thực tiễn bạn có thể xem qua demo tại đây https://farm.chowebs.com

với THỂ BẠN quan tâm

• cách tạo Full Aff trong khoảng Tiki , Aff trong khoảng Lazada , Aff từ Shopee
• Hostvn Black Friday 2022 – giảm giá lên đến 79%
• cách thức đăng ký Google Drive 200GB – 3 Năm giá 385K bằng account Gmail Mình
• chỉ dẫn show Attributes trang chi tiết sản phẩm – tính chất sản phẩm
• Hiện thị trình bày acf cho danh mục categories blog
• Thêm Category vào Title trong UX Builder theme Flatsome

bí quyết làm cho button slider flatsome đẹp

bạn chỉ cần đặt css nào vào css custom là xong nhé

1 hai 3 4 5 6 7 8 9 10 11 12 13 14 15 16

.flickity-prev-next-button.previous left: 90%; .flickity-prev-next-button opacity: 1; .slider-nav-push:not(.slider-nav-reveal) .flickity-prev-next-button margin-top: -43%; .slider-nav-circle .flickity-prev-next-button svg border: 0; border-radius: 100%; background-color: #9a1b1f; border-radius: 0; color: white;

Bạn có thể chỉnh các thông số left: 90% và margin-top: -43% cho thích hợp với width của slider của bạn

Bạn cũng mang thể đặt slider của bạn trong 1 table nhớ đặt class cho table nhé ( ví dụ tớ đặt class cho table là .sanpham là ta có thể code css dạng sau )

1 hai 3 4 5 6 7 8 9 10 11 12 13 14 15 16

.sanpham .flickity-prev-next-button.previous left: 90%; .sanpham .flickity-prev-next-button opacity: một; .sanpham .slider-nav-push:not(.slider-nav-reveal) .flickity-prev-next-button margin-top: -43%; .sanpham .slider-nav-circle .flickity-prev-next-button svg border: 0; border-radius: 100%; background-color: #9a1b1f; border-radius: 0; color: white;

Bạn chỉ cần lưu lại là xong

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

Cấm dùng các template được chia sẻ trên blog với mục đích thương mại !

THÔNG TIN TÁC GIẢ & DỊCH VỤ:

• Biên tập nội dung: Trần Nhật Sinh
• Địa chỉ: Ân Đức, Hoài Ân, Bình Định
• Nếu bạn muốn đóng ghóp giao diện hoặc yêu cầu gỡ hãy liên hệ với tôi
  + Email : transinh085@gmail.com
  + Zalo: +84 387 913 347 (SMS)
• Dịch vụ:
  + Sửa lỗi, nâng cấp template
  + Tối ưu giao diện
  + Cài đặt giao diện