Thêm danh mục con vào Element Title trong UX Builder của theme Flatsome

Theo thanhtrungit.com, tác giả các đoạn code hữu ích dưới đây có lẽ là anh Hung Bun. Xin được cám ơn tác giả và xin phép chia sẻ lại kiến thức hữu ích này cho cộng đồng nha!

Phần việc chúng ta đang tìm hiểu các bạn có thể xem hình dưới đây:

Giuseart.com---Thêm-sub-menu-vào-title-trong-ux-builder
Giuseart.com—Thêm-sub-menu-vào-title-trong-ux-builder

Tạo element mới 

Vì lý do một Element của Ux Builder không thể custom lại bằng cách viết vào child theme, bắt buộc chúng ta phải tạo 1 Element trong file functions.php của child theme.

Trong giao diện trang quản trị, bạn vào Giao diện – sửa – child-theme – functions.php và dán đoạn code sau vào cho mình:

Sau khi thêm vào function.php thành công, các bạn lưu lại file nha!

Hiển thị Title with Category vào UX builder

Đoạn code dưới đây sẽ giúp thêm một Element với tên “Title with Category” vào trong UX builder, khi các bạn chỉnh sửa trang bằng UX builder có thể dùng được Element này.

Trong trang quản trị, các bạn ấn Giao diện – sửa – child-theme – functions.php và paste đoạn code sau vào:

Hướng dẫn sử dụng

Các bạn muốn thêm Tiêu đề kèm các link danh mục thì vào phần sửa trang with Ux Builder, các bạn phải gõ chữ “title…” vào khung search thì nó mới hiện ra nhé, chứ kéo tìm các element bên dưới tìm mãi không thấy đâu.

Thêm hiệu ứng CSS trang trí

Đã hoàn thành việc thêm Element và có thể sử dụng, tuy nhiên, Tiêu đề có danh mục con hiển thị ra bên ngoài lúc này chưa được đẹp, việc còn lại của chúng ta là CSS lại cho nó đẹp hơn nhé!

Giuseart.com---Thêm-sub-category-vào-title-element-trong-ux-builder
Thêm danh mục vào Title Element trong Ux builder

Mình sẽ hướng dẫn các bạn CSS như mẫu ở trang demo này nha, còn lại thì các bạn tùy chỉnh cho phù hợp thế nào là việc riêng của các bạn tự làm nha!

http://webbanhoa.ninhbinhweb.info/

Các bạn vào Giao diện – Tùy biến – Style – Custom CSS và paste toàn bộ đoạn code CSS này vào nha!

Tiếp theo, các bạn vào tiếp mục Custom CSS Mobile và paste đoạn này vào (để ẩn các danh mục phụ trên mobile cho đỡ vướng):

Lời kết

Thế là kết thúc tốt đẹp, các bạn hãy thử làm xem Ok không nha. Cám ơn tác giả của những đoạn code tùy biến trên, nó giúp ích khá tốt cho công việc của mình. Còn các bạn, chúc các bạn có những trải nghiệm thú vị khi ghé thăm website nhé!

Các dịch vụ đi kèm nếu khách hàng có nhu cầu sử dụng

- Đăng ký tên miền quốc tế .com: 300k/năm
- Hosting 1Gb / Băng thông 50Gb: 500k/năm
- Hosting 2Gb / Băng thông 100Gb: 1000k/năm
- Hosting 5Gb / Băng thông không giới hạn: 2000k/năm
- Hosting nước ngoài tốt nhất hiện này: hawkhost
- Dịch vụ đăng ký khai báo website với bộ công thương: 500k/lần
- Dịch vụ cài đặt website trên hosting khách hàng: 200k/lần (Chưa bao gồm hướng dẫn sử dụng và bảo trì nếu có)
- Dịch vụ quảng cáo Google ads, Facebook Ads, cập nhật sản phẩm vui lòng liên hệ trực tiếp
- Dịch vụ sửa chữa, nâng cấp, thiết kế website theo yêu cầu vui lòng liên hệ trực tiếp
----------------------
CÔNG TY CP CÔNG NGHỆ VÀ TRUYỀN THÔNG WEB89 VIỆT NAM
- Địa chỉ: 164 Khuất Duy Tiến, Thanh Xuân, Hà Nội
- Điện thoại/ Hotline / Zalo: 0981.185.620
- Email: info@web89.vn
- Hệ thống website - dịch vụ và đối tác của chúng tôi:
1. https://web89.vn - Cung cấp các dịch vụ website, quảng cáo online
2. https://muahanggiatot.com - Website TMĐT đa dạng sản phẩm
3. https://timgiatot.vn - Sàn TMĐT so sánh giá số 1 việt nam
4. https//cameravn247.com - Website cung cấp các thiết bị an ninh - camera quan sát tại Hà Nội và toàn quốc
5. https://dichvuhot.vn - Sàn rao vặt ngành dịch vụ

Trả lời

Email của bạn sẽ không được hiển thị công khai. Các trường bắt buộc được đánh dấu *