3. Use small z-index.
z-index is used to adjust the stack order of elements, it's recommended to use small values, like 1, 2, 3.
4. Use absolute position only when you know what you are doing.
Using absolute position can create some nice effects, but use it properly is not easy. Not recommended for beginners.
5. Use global colors and fonts.
Setting some global colors and fonts is a very nice way to keep colors and fonts well organized on your site.
6. Copy/remove all content.
Right click on the add-new-section to see buttons of copying/removing all content
7. Set background opacity to 0.
If you can't find a button to remove a background, then setting its opacity to 0 can remove the background. The same as setting the border to 0 or transparent to remove a border.
8. Use "Menu thumbnail" in the category slider widget.
A category can have 3 images "Category cover", "Category thumbnail", "Menu thumbnail". Till 1.7.7.1, the category thumbnail is buggy, don't use it. A category cover in most cases is a rectangle image that used to be displayed on the top of the category page. So if you want to have a square category image on the homepage by using the category slider widget, then it's recommended to upload a menu thumbnail for every category.
9. Use VW for large text.
VW: A percentage of the full viewport width. 10vw will resolve to 10% of the current viewport width. It's recommended to use VW for large texts, they will automatically become small on small screen devices. If a text is too small on mobile, then specifically set a large value for mobile devices.
10. Use % for large spacings
If you set a 200px spacing, it's okay on desktop, but on mobile, it's nearly half of view width. So it's recommended to use values like 10%, which works fine on all devices.
11. Use upper-level settings.
If you want to set the text color to be white for all widgets in a row, you can set the text color in every widget. Another better solution is to set the text color in the row's setting panel, the setting will be applied to all widgets in the row.
12. Text editor widget
Use it only when you want to add multiple paragraphs to your site, the text editor widget wraps content in p tags by default, a p tag has a default bottom margin which makes trouble in some cases. For short text, use the Heading widget instead.
13. Disable or uninstall some modules
You can find a list of modules of the Transformer theme and Panda theme on the "BO > Improve > Easy builder > Easy builder settings" page, the easybuilder has all features of those modules.
NOTE 1 Disabling modules first is recommended. You will lose content created by those modules if you uninstall them. Uninstall them when you are sure content created by them will not be used anymore.
NOTE 2 Those modules can be disabled or uninstalled but don't remove their files.
14. The pen editing button can be used as a drag handler
If you have difficulty dragging a widget up, then you can use the hover-show-out pen editing button as a drag handler.
15. Use "Content box" widget often
If you are going to create a block that contains two or more of these items: Image, Heading, Subheading, Text and Button, then it's recommended to use the "Content box" widget to create it instead of using an image widget + 2 heading widgets + a text editor widget + a button widget.
16. Enable CCC for css and js
Enable CCC is recommended when in development and production. The easybuider page loads a lot CSS and JS files, enable CCC to merge them into one file can improve the performance.
