🔤 WooCommerce Alphabetical Search – Settings Explained #
✅ Automatic Placement #
-
Description: When enabled, the alphabet filter will be automatically placed at the top of your shop page.
-
Alternative Option: Use
[woo_alphabetical_search]shortcode to manually insert the alphabet filter on any page or widget.
✅ Enable Numbers #
-
Description: Adds a “#” symbol in the filter to allow users to search products starting with numbers (0-9).
✅ Display Product Count #
-
Description: Shows a tooltip with the number of products for each alphabet when hovering over a letter.
⬜ Display Alphabets Which Has Some Products #
-
Description: If enabled, only letters with at least one product will be displayed in the filter.
-
Benefit: Hides unused letters to reduce clutter.
⬜ Opaque Letters Having No Products #
-
Description: Displays alphabets without any products in a faded or non-clickable form.
-
Useful For: Giving a visual cue of inactive letters while keeping the full A–Z range visible.
✅ Enable Reset #
-
Description: Adds a clickable reset link that clears the current alphabet filter selection.
📝 Reset Text #
-
Description: Custom text shown for the reset link (e.g., “Reset Text.”)
📝 Text Above the Alphabets #
-
Description: This is the heading or instruction shown above the alphabetical filter bar.
-
Default: “Filter products by alphabets”
🎨 Styling Options #
🎨 Background Color #
-
Sets the background color of alphabet boxes.
🎨 Hover/Active Background Color #
-
Sets the background color of a hovered or currently selected alphabet.
🎨 Text Color #
-
Text color of the alphabets (A–Z).
🎨 Text Hover/Active Color #
-
Text color when an alphabet is hovered or selected.
🎨 Counter Background Color #
-
Background color for the small circle showing product count.
🎨 Counter Text Color #
-
Font color for the number inside the count circle.
📐 Size & Spacing Options #
📏 Alphabet Height (in px) #
-
Height of each alphabet button (default: 32px).
📏 Alphabet Width (in px) #
-
Width of each alphabet button (default: 30px).
🔠 Alphabet Font Size (in px) #
-
Font size for alphabet letters (default: 20px).
📏 Counter Height (in px) #
-
Height of the product count circle (default: 14px).
📏 Counter Width (in px) #
-
Width of the product count circle (default: 18px).
🔠 Counter Font Size (in px) #
-
Font size for numbers in the product count (default: 11px).
↔️ Spacing Between Letters #
➡️ Horizontal Space Between Alphabets (in px) #
-
Space between letters from left to right (default: 5px).
⬇️ Vertical Space Between Alphabets (in px) #
-
Space between letters from top to bottom if wrapped to next line (default: 5px).
💾 Save Changes #
-
After adjusting settings, click this button to apply all the updates.
