Skip to content

WooCommerce (Customizer) – JurnalPress Theme

The WooCommerce panel in the Customizer lets you configure various aspects of your store’s appearance and behavior—from product column counts, integrating WooCommerce elements into the header, to colors for key elements such as prices, badges, and buttons.

All settings in this panel are designed to be easily customized without writing code. The panel appears in the Customizer as WooCommerce and centralizes settings directly related to store features.

Info

This option is enabled if you activate the WooCommerce plugin in WordPress.

Settings Location

Appearance → Customize → WooCommerce

This panel includes the following main sections:

  • Product Catalog
  • Theme Settings
  • WooCommerce Color

Product Catalog

This section is directly connected to WooCommerce’s product catalog settings.

Label: Related Columns
Description: How many products should be shown per row?
Type: Select
Default: 3 Columns

Function:
Set the number of columns for Related Products displayed per row on the product detail page.

Available options:

  • 2 Columns
  • 3 Columns
  • 4 Columns
  • 5 Columns
  • 6 Columns

Notes:

  • The more columns, the smaller the product cards.
  • Adjust based on content width and target devices (desktop vs mobile).

Theme Settings

The Theme Settings section contains options for integrating WooCommerce elements with the theme layout, especially in the header and menu areas.

Cart Button from Header

Label: Cart button from header
Type: Toggle
Default: On

Function:
Show or hide the WooCommerce Cart button in the theme header.

Common uses:

  • Enable for online stores focused on transactions.
  • Disable for a more minimal header appearance.

Login Button from Menu

Label: Login button from menu
Type: Toggle
Default: On

Function:
Display the WooCommerce Login / My Account button in the navigation menu.

Notes:

  • Useful for stores with customer accounts.
  • The button typically changes based on user status (login / logout).

WooCommerce Color

This section lets you adjust the colors of key WooCommerce elements to match your theme’s branding.

Price Color

Label: Price Color
Type: Color Picker

Function:
Set the text color for product prices across WooCommerce pages.

Badge Text Color

Label: Badge Text Color
Type: Color Picker

Function:
Set the text color for product badges such as:

  • Sale
  • Featured
  • Out of Stock

Badge Background Color

Label: Badge Background Color
Type: Color Picker

Function:
Set the background color for product badges.

Tips:
Use contrasting colors to ensure badges remain readable.

Second Button Color

Label: Second Button Color
Type: Color Picker

Function:
Set the text color for WooCommerce secondary buttons, for example:

  • View Cart
  • Wishlist
  • Secondary Action Button

Second Button Background Color

Label: Second Button Background Color
Type: Color Picker

Function:
Set the background color for WooCommerce secondary buttons.

Recommendation:
Use colors that are within the same palette as your primary theme colors for visual consistency.

Summary

The WooCommerce panel in the Customizer gives you full control over:

  • Product layout
  • Store feature integration in the header and menu
  • Consistent colors for WooCommerce elements

With these settings, you can tailor your store’s appearance without additional code customization.

Powerfull Plugin and theme wordpress indonesia.