If a website is using white text, it becomes difficult to work with it in the default TinyMCE editor since the background is white as well.Visual Composer has a dark mode option which enables dark-colored background for TinyMCE.You can enable it using a toggle below the TinyMCE editor as depicted in the screenshot:
To create a sticky menu, edit the row element in which the menu is located. Scroll down to the Sticky section in row settings and enable the stickiness.If you are using a transparent header and want to display a header with a background when the user scrolls down, then you can use the show on sticky option. This will display the row having the background only when it becomes sticky and will hide it otherwise.
If you are using the basic menu element, maybe some of you feel that the space between menu items is too big for your design. Right now, we do not have that option yet, but you can achieve it by using some custom CSS. You can apply this custom CSS to the local or global CSS options in Visual Composer:,.vce-basic-menu-container .vce-basic-menu ul .menu-item a {
padding: 16px 10px !important;
},The first pixel is controlling the vertical, and the second pixel is controlling the horizontal. You can experiment with it in your page.
Visual Composer Website Builder has a feature called Design Options where you will be able to control your margins, padding, border, and radius.By making use of this feature you will be able to add specific margin/ padding on the specific device only.For example, you want to give your button a top margin of 50px but for mobile-only, you just need to select the device type to custom, then select mobile. When you give a top margin of 50px on mobile, it will not be affecting your desktop or tablet design. This feature is so powerful that you can have your preferred design on your specific devices. You can watch this video to understand more about margins, paddings, borders, and radius.
A custom HTML code can be added on a Page using Raw HTML element.A custom JavaScript code can be added using Raw JS element.If you want to add the code sitewide in its header or footer then it can be added under: Visual Composer - CSS & JavaScript - Custom HTML and JavaScript.
While editing, sometimes you need the same element over and over again. In Visual Composer editor, you can copy and paste elements so you can have the identical element with the same content, same color.There are several ways to copy and paste elements in Visual Composer.From element controlSelect the element that you want to copyHover over the element controlClick CopyHover over the column that you want to paste element Click PasteFrom right clickThe process is pretty similar to copy and paste from element control. The only difference is, you can directly right click on the element and on the column:From tree viewSelect the element that you want to copyHover over the sandwich iconClick copyAfter that, select the column where you want the element to show upHover over the sandwich iconClick pasteClone instead of copy and pasteIf you just want to have the identical element directly below it, you can use clone instead. You can find it on top of the copy:Copy element from different pageYou can use these methods to also copy an element from a page and paste it on a different page within the same site. You just need to have two pages opened on separate tabs, and copy element between them.And if you want to copy all elements from a page, instead of copying, you can use the Global Templates feature.
Add Facebook Pixel and Google Analytics code to WordPress with Visual Composer Custom JavaScript.You can add Facebook Pixel and Google Analytics code to your WordPress site with Visual Composer.To add the snippet, you will need to use Global Custom JavaScript.To add Facebook Pixel or Google Analytics code:In the Frontend editor open Settings - Custom JavaScriptSwitch to the "Global JavaScript" tabCopy your Facebook Pixel or Google Analytics code in the head sectionSave the pageImportant: It is recommended to insert Facebook Pixel and Google Analytics codes in the head part.
Yes, you can!To help us translate the Visual Composer editor in your language, please join the translation project at wordpress.org.Once translation will reach 90%, it will become available for use within the plugin.Thank you for your contribution!
If you are running a WooCommerce store, you may want to use these buttons as an "Add to Cart", but don』t know how?You can download any button from the Visual Composer Hub and make it act like an "Add to Cart" button.To add "Add to Cart" link to the button:Add the button to your page and open element edit window;Click on 『Select URL』;In the popup, select Custom in the URL drop-down menu;Enter 『Add to Cart』 URL with appropriate product id (ex. /?add-to-cart=1404).
