Theme layout editor
The color editor allows you to customize the theme colors. Preview changes are immediately displayed in your browser.
Remember to frequently save your changes. If you refresh the page or go to another page, and you do not save your settings, they will be lost. Once saved, you need to refresh the page several times to make changes to your browser.
Important!
To enable the layout and color configurator, go to Modules->Modules and Services->Installed modules, and then find the "AT - Layout and colors live configurator" module and set "Show theme configurator in
After doing so, the layout editor and colors will be displayed on the left in the store.
If you are not satisfied with your changes, uninstall and then reinstall the "AT - Layout and colors live configurator" module to restore the default settings.
Live configurator options:
Pattern background - this is a semi-transparent image so you can customize its color using the "Pattern background color" field.
If you want to add your own background pattern, create a pattern called custom_pattern.png.
Add it on ftp to the themes/AngarTheme/assets/img/patterns folder.
Then refresh the page several times and click on the "custom pattern" icon.
Texture background - this is a background where you can not change its color.
If you want to add your own background texture, create a pattern called custom_texture.jpg.
Add it on ftp to the themes/AngarTheme/assets/img/textures folder.
Then refresh the page several times and click on the "custom texture" icon.
Pattern background color - choose the color of the background pattern.
Background attachment - you can lock your background.
Top separators - allows you to select the type of separators in the top.
Logo margin-top - add a margin over the shop logo if needed.
You can select one of two submenu layouts:
Submenu layout 1:
Submenu layout 2:
Slider position
Slider under menu:
Slider in
Slider controls color - select white or black color.
Select how many banners in a row to be placed under the slider.
You can select different amounts on your computer, tablet
Below is an example configuration of 3 banners per row and 2 banners per row.
Select how many banners in a row are to be placed above the footer.
You can select different amounts on your computer, tablet
Featured categories styles:
Style 1:
Style 2:
Style 3:
Style 4:
You can select different amounts on your computer, tablet
Tabs:
Boxes:
Select products quantity per row.
You can choose different values for a 1, 2 or 3 column layout, eg on the home page, you can use a 1-column layout with 5 products in a row, and in the category of
Select products quantity per row on tablets and phones.
Product-list border style:
Style 1:
Style 2:
Hide reference code in
Product info in boxes or tabs:
Tabs:
Boxes:
