FAQ Toggle

This Template has already been optimized for Mobile. Should you need to add to or modify the template, here are some considerations for how to best ensure the mobile experience. For the most part, WPBakery sections, rows and elements are responsive. However, there are times when you may want to adjust the layout to simplify or change behavior on mobile.

• Use text blocks not heading elements for paragraph text without headings included. Use of the heading element for paragraphs adds code causing the application to do more work and makes front end editing more difficult as how to edit the text is not immediately apparent.
• Use the capability to set different font sizes for different breakpoints in the Ultimate Heading element if you need to change the size of a heading or subheading on tablet or mobile.
• Use the built in ultimate spacer element or percentage padding to set different spacing at desktop, tablet and mobile rather than hard coding pixels into a row or column.
• Use the built in capabilities to hide/show elements at different breakpoints to position part of a section in a different location on mobile vs. desktop rather than duplicating the whole section.
• Use the capabilities to change the size of columns between desktop and mobile rather than duplicating.
• Use custom css when there is a very minor difference in spacing. For example, to turn on/off or change borders or hide a background image between desktop and mobile.
• Be careful of using different techniques to load the same image on a page - this can cause very low page speed scores.
• Always test your pages on laptop and mobile screens. Most users don't work on large design monitors.