Untitled-27 Back to Project

KHÁI NIỆM CƠ BẢN Untitled-27

HEADER Untitled-27

SIDEBAR Untitled-27

FOOTER Untitled-27

THỦ THUẬT Untitled-27

Hướng dẫn tạo nút “Button” trên Menu

Nếu bạn muốn tạo nút Button trên thanh điều hướng để tăng tính chuyển đổi thì có 2 cách cơ bản sau:

Chèn nút Button
Nút Button trên trang chủ Astra

Cách 1: Astra Customize (chức năng của theme Astra)

Astra theme button
Chọn Lats Item in Menu là “Button”
Tuy chinh button
Tuỳ chỉnh button trên Menu của Astra với “Custom Button”

Lưu ý: Bạn chọn Custom Button vì bạn sẽ tuỳ chỉnh riêng button đó khác biệt với toàn bộ button của theme

Header button
Tuỳ chỉnh Header Button
Tuy chinh primary button
Tuy chỉnh Primary Button
Tuy chinh button in menu
Bảng tuỳ chỉnh Button của Astra

Điểm hạn chế của phương pháp này là bạn chỉ có thể chèn link redirect đến URL của bạn mà thôi, bạn không thể tích hợp Javascript code vào button để kích hoạt ứng dụng bên thứ 3.

Cách 2: Tạo Button bằng Widget

Tạo button bằng Widget
Tạo button bằng widget HTML với <a> tag
Tạo button bằng button ta
Tạo “Button” bằng <*button> tag

Cách 3: Tạo Button bằng Menu Module của WordPress

Cách này rất nhanh và áp dụng được cho tất cả theme WordPress

Dùng Menu để tạo button
Vào Menu Module của WordPress
Chèn mã vào Menu
Chèn mã html trực tiếp trên Menu

Lưu ý quan trọng:

  • URL: địa chỉ bạn muốn redirect tới
  • Dùng <span> tag, bạn không được sử dụng <a> tag
  • Class hay ID phải là “button”hoặc “ast-button”
  • Nếu theme bạn không có class Button, bạn có thể dễ dàng tạo bằng tuỳ chỉnh CSS

Tham khảo code:
<span class="button">Demo Button</span>

LinkedIn