HƯỚNG DẪN SỬ DỤNG PLUGIN VISUAL COMPOSER

Sau khi bạn download plugin Visual Composer về bạn tiến hành cài đặt và kích hoạt Plugin. Dashboard > Plugins > Add New > Upload > Browse > chọn file zip bạn vừa download về > Install Now > Active plugin sau khi cài đặt.

Sau khi Active plugin thì menu bên trái sẽ xuất hiện các mục như hình:

Grid Elements: đây là một khái niệm mới hoàn toàn trên phiên bản mới nhất của VC (Visual Composer) cho phép khởi tạo các mẫu bố cục cho bài viết, Media theo dạng lưới. Khi bạn khởi tạo Grid Elements, bạn có thể sử dụng các mẫu có sẵn của VC để chỉnh sửa lại theo ý của mình.

Concept đơn giản nhất:

https://www.youtube.com/watch?v=dtAAx_r9oLM

Cấu hình chung

• Cấu hình nội dung

• Kiểm soát tài khoản người dùng và nhóm người dùng

• Reponsive

Tùy biến CSS

• Bước 1: BackEnd > Settings > Visual Composer > chọn Design Options

• Bước 2: Settings > Visual Composer > Custom CSS > gắn css tùy biến vào

• Bước 3: Thêm CSS Rule cho Page hoặc Post.

• Bước 4: Hiệu chỉnh tên class CSS nếu bị trùng lặp

• Bước 5: Ghi đè tên class CSS vào VC bạn sử dụng dòng code “add_filter(“vc_shortcodes_css_class”)”

Cấu hình các đối tượng trên VC

Cấu hình Responsive

Làm việc với mẫu bố cục

Bố trí cho layout: Bạn có thể lựa chọn bất kỳ mẫu đối tượng có sẵn và có thể hiệu chỉnh nó một cách tùy biến. Các mẫu đối tượng đặc trưng của VC luôn hỗ trợ tốt cho Page trong WordPress chỉ với thao tác click chuột giúp bạn có thể tùy biến một cách thoải mái nhất.

Shortcode Mapper: được phát triển từ phiên bản 4.1.0 sở hữu 3 bộ shortcode mạnh mẽ và cho phép tự định nghĩa bộ shortcode riêng cho mình. Bạn có thể tùy chỉnh tại Settings > Visual Composer > My ShortCode

• Các bước triển khai

• Parsing Shortcodes

Đầu tiên bạn cần phải ghi mã shortcode trước. Bên dưới “My Shortcode” tab bạn chọn tiếp Map Shortcodes để mở cửa sổ parse sau đó tiến hành nhập mã shortcode như mẫu sau đó nhấn “Parse Shortcode”: [my_shortcode value=”100″ bgcolor=”#8e8e8e” desc=”Default values” cssanim=”yes” size=”50″]

• Thay đổi giá trị cho Shortcode

Grid Builder

Một vài kỹ thuật trong VC mà bạn cần biết

• Cách thêm hoặc chỉnh sửa một hình ảnh

• Cách khởi tạo một thư viện ảnh

• Cách thêm một cách hiển thị của bài viết cũ với Grid Builder

• Cách tạo ra một Text Block trên Visual Composer

• Cách kiểm tra giao diện Responsive trên Visual Composer

• Cách nhân đôi đối tượng khởi tạo

• àm cách nào để kiểm soát một đối tượng hiển thị trên các thiết bị khác nhau

• Cách tạo ra vùng trống ngăn cách 2 đối tượng hiển thị trên giao diện

• Cách kéo thả các đối tượng trên Visual Composer

• Cách tùy biến tiêu đề bài viết trên Visual Composer

• Cách khởi tạo 1 hàng chứa các đối tượng trên giao diện

• Cách hiệu chỉnh nhỏ hàng

• Bật tắt cơ chế chỉnh sửa giao diện trên trang chủ

• Cách thức sử dụng các đối tượng Heading tùy biến

• Cách thức triển khai tab, tours và accordions

Chúc mọi người có được những khoảng khắc tuyệt vời khi trải nghiệm plugin đỉnh này.