Set the style and layout of the WooCommerce Archive Products
Content
Content
Allow Order: Select Yes to give users the option to sort the products by Default, Popularity, Rating, Latest, Price: Low to High, or Price: High to LowShow Result Count: Select Yes to show number of results for this archive, or No to hide it
Advanced
Nothing Found Message: Enter the message to be shown to users when there are no results to display
Style
Products
Columns Gap: Set the exact gap between the columnsRows Gap: Set the exact gap between the rowsAlignment: Align the products data to the left, right, or center
Image
Border Type: Select the type of border, choosing from none, solid, double, dotted, dashed, or groovedBorder Radius: Set the radius to control corner roundness of the borderSpacing: Adjust the amount of space between the images and their data
Title
Color: Choose the product Title colorTypography: Set the typography options for the Title textSpacing: Adjust the amount of space after the Title
Rating
Star Color: Choose the color of a filled starEmpty Star Color: Choose the color of an empty starStar Size: Set the size of starsSpacing: Adjust the amount of space after the Rating Stars
Price
Color: Choose the color of the product PriceTypography: Set the typography options for the product Price
Regular price
Color: Choose the color of the product』s Regular PriceTypography: Set the typography options for the product』s Regular Price
Button
Normal | Hover
The following options can be set independently for both the normal and hover states.
Text Color: Choose the color of the product』s Button TextBackground Color: Choose the background color of the product』s ButtonBorder Color: Choose the border color of the product』s Button
Typography: Set the typography options for the product』s Button TextBorder Type: Select the type of border, choosing from none, solid, double, dotted, dashed, or groovedWidth: Control the thickness of the border around the product』s ButtonBorder Radius: Control corner roundness of the button』s borderText Padding: Set the padding within the buttonSpacing: Adjust the amount of space above the buttons
View Cart
Color: Choose the color of the View Cart text under the buttonsTypography: Set the typography options for the View Cart text
Box
Border Width: Control the thickness of the border around the product』s boxBorder Radius: Control corner roundness of the products boxPadding: Change the padding within the products box
Normal | Hover
The following options can be set independently for both the normal and hover states.
Box Shadow: Adjust box shadow optionsBackground Color: Choose the background color of the products boxBorder Color: Choose the border color of the products box
Pagination
Spacing: Set the amount of space above the paginationBorder: Show or Hide border around paginationBorder Color: Choose the color of the pagination borderPadding: Set the padding within the pagination
Normal | Hover | Active
The following options can be set independently for the normal, hover, and active states.
Typography: Set the typography options for the pagination textColor: Choose the color of the pagination textBackground Color: Choose the background color for the pagination
Sale Flash
Sale Flash: Show or HideText Color: Choose the color of the Sale Flash textBackground Color: Choose the background color of the Sale FlashTypography: Set the typography options for the Sale Flash textBorder Radius: Control the corner roundness of the Sale FlashWidth: Control the thickness of the border for the Sale FlashHeight: Set the height of the Sale FlashPosition: Set the position of the Sale Flash, Left or Right, of the products boxDistance: Set the distance of the Sale Flash from the top of the products box
Nothing Found Message
Color: Choose the color of the Nothing Found Message textTypography: Set the typography options for the message text
Note: The style of this widget is often affected by your theme and plugins. If you experience any such issue, try to switch to a basic theme and deactivate related plugins, or adjust the styling within your theme』s settings.