Author 诗语

How to create equal-sized columns in the same row?

Visual Composer row settings allow to set all columns within a row to have the same height. The height of the columns will be similar to the column with the longest content.To set an equal height for all columns:Open row edit windowEnable "Column equal height" toggleAll columns in a row are now equal in heightIn addition to equal columns height, you can also manipulate with content vertical position. By default, the content is placed on the top, but you can align content vertically in the middle or stick to the bottom of the columns.

How to set a column to be a specific size?

In Visual Composer, you can specify column size in pixels which means it will be fixed across devices.To set column size in pixels:Open row edit windowIn the Row Layout section, set the column size in pixels.

How to migrate from WPBakery to Visual Composer?

At the moment there is no mechanism to migrate your layout from the WPBakery Page Builder plugin to the Visual Composer Website Builder.To migrate the site, you can temporary install both plugins on your WordPress site to redesign WPBakery pages in Visual Composer. Once all the pages are redesigned, you can remove WPBakery plugin.

How to create two buttons side-by-side?

There are cases when you want to place two buttons side-by-side and avoid stacking of those buttons on mobile devices.You can use Button Group element that allows adding multiple buttons next to each other. Button Group element can be downloaded from the Visual Composer Hub.Once you add Button Group element, you can select the number of buttons and button styles from the available buttons. For every button, you can adjust button attributes per your needs.

How to set custom excerpt lengths for grid items?

Every post grid element allows to overwrite WordPress default excerpt length.To set custom excerpt:Add post grid element to the pageOpen post grid element edit windowClick "Custom excerpt length" toggleSet custom excerpt length for the post grid

How to create a sandwich menu for the mobile and a normal menu for the desktop?

Once a menu is created in the WordPress dashboard: Appearance - Menu. It can be displayed using menu elements such as the basic menu element of Visual Composer.In the basic menu element settings, the 「Enable sandwich menu」 option allows displaying a sandwich menu when the screen size is not sufficient to display a normal horizontal menu which otherwise will force the menu items onto the next line. Due to this, a user accessing the page from mobile sees a sandwich menu.

How to move a website from temporary (dev) to final (live) URL?

To migrate your website from a development environment or another hosting we recommend using Duplicator plugin. This plugin will take care of your database data and update URLs. Links pointing to development (or old domain name) will be replaced with a new domain name.After that initiate Reset (Dashboard -> Setting -> General) to re-download all installed bundles and auto-configure paths after migration.

How to duplicate headers, footers, and sidebars?

There are two ways to duplicate the Headers, Footers and Sidebars:The first method is by using the export/import addon available in the Visual Composer Hub. Once the addon is downloaded, navigate to: Visual Composer - Theme Builder - Headers and hover onto a header name for the export option to appear.Click on Export to export it as a .zip file. The exported template can then be imported via: Visual Composer - Import. The same process can be applied to the Footers and Sidebars.The second method to duplicate is by using a plugin called Yoast Duplicate Post. Once the plugin is installed, navigate to: Settings - Duplicate Post - Permissions and select Header, Footer, and Sidebars under the "Enable for these post types" setting.Now when you navigate to Visual Composer - Theme Builder - Header, you will now have an option to clone it.

How to create a sitewide sidebar in Visual Composer?

With Visual Composer Website Builder, you can have a sitewide sidebar that will show across your website.It's very easy to create a sitewide sidebar, you just need to follow these steps:Create a new layout in Layout Builder.In the content area row, make sure you add another column for the sidebar columnYou can divide it by 80% content area, 20% sidebar or vice versa depending on you want the right sidebar or left sidebar.After that, you can fill in anything on the sidebar column, such as an image, your ads, or something else. If you have done editing the layout, you can publish, and make sure to apply it on post/ page/ custom post type. That's it.Another method that you can use is by using the sidebar menu. You can create a sidebar on it, and if you want to display it, make sure you choose the layout that has a sidebar on it, then you can select the sidebar that you wanted.

How to place a text to overlap with an image?

You can place elements of Visual Composer on top of one another (including text over image) by applying negative margin value in the element Design Options.To overlap elements:Add any two elements on the page (ex. image and text)Open the edit window of the second elementIn the Design Options add negative top margin valueNote: You can use responsive Design Options settings to control the overlap across different devices.