If you want to import the demo contents and setup, you will be able to do that in just a few clicks.
After installing and activating Proteo, go to Appearance > Proteo theme and from the skin you prefer, click on the Import button.
This will start the wizard, where you can choose whether to create a child theme, install the recommended plugins, select the skin you prefer to import
Now, you site looks exactly as the one on our demo. You can start editing and customizing it!
Choose how to display categories, subcategories, products, and how to sort them.
Shop page display:
Category display:
Default product sorting:
Select here the default sorting for products displayed on your archive pages. Users will however be able to select a different sorting manually from the dropdown menu in the top right corner.
Products per row: you can select from 2 to 6 products per row.
Rows per page: you can select from 2 up to 8 rows per page.
In the following screenshot, for example, there are 5 products per row and a maximum of 2 rows per page.
Space between products (px): you can select the space (in px) between products horizontally and vertically.
Enable border: yes/no
Border width (px): select borders width (top, bottom, left, right) in px
Border radius (px): select border radius in px
Border color: choose the color of the border
Product hover effect:
Product TITLE font size: default value set to 14px
Product TITLE font color
Product PRICE font size: default 14px
Product PRICE font color
Add to cart style:
To customize the two available button styles of the theme, please, refer to Theme options > Miscellaneous > Buttons. You can find out more on this page.
Add to cart font size: default 14px
Add to cart position on archive pages (Shop, category, and tag pages)
Show “View details” link: this is the button that opens the product detail page. If set to NO, the full image will be clickable, if set to YES, you will be able to choose the style of this link.
“View details” style:
From this menu you can choose whether the Shop page will have a sidebar or not and where to show it, on the right or left.
If you enable the sidebar, you will be able to pick one of your sidebars.
To configure the sidebars of your theme, please, go to Theme > Appearance > Widgets.
From this panel, you can choose a specific sidebar layout and pick one of your available sidebars to show on all product taxonomy pages, like attributes, brands etc.
You can override these settings, and for example show a custom sidebar or no sidebar at all, from the product page. Please, refer to this page for more details.
Main image width: this is the width of the main image on the product page. The theme will automatically regenerate images of the right size without cropping the images. You can resize them at any time.
Thumbnail width: this is the width of the product image on archive pages like Shop page, category pages etc.
Thumbnail cropping:
From this page, you can customize some of the standard checkout fields:
And choose whether to make them:
Additionally, you can Highlight required fields with an asterisk
And set custom pages of your website as links for the:
In the Miscellaneous menu you will be able to choose the Site background image.
Here you can add an image that will be displayed as background for your entire site.
In the Preset, you can choose how to display it:
Based on the preset chosen, you will also be able to choose:
Replace the default color swatches of the Gutenberg block editor with your custom colors. In this way when you create a new page using Gutenberg you will find these colors and you can easily apply them to the page elements.
Here you can enable the breadcrumbs, i.e. the navigational links that will show on products, posts and pages.
In this menu you will find two sections.
Configure here:
