This documentation is not intended as an introduction to HTML and CSS for beginners, it is rather a starting point for developers who are familiar with these concepts and need to customize certain aspects around the features provided by the WooCommerce Product Search extension.
This section of the documentation is aimed at developers who are familiar with WordPress theme customizations and who know their way around HTML and CSS. To a certain extent, you might also want to be familiar with child themes for WooCommerce, the section Set up and use a child theme in the documentation can help you get started with that.
We will present several examples and explain underlying structures to help you customize your WooCommerce Product Search by adding custom styles.
The examples given provide you with an overview of how to modify the appearance, work with the layouts, adjust colors, fonts, icons etc.
The following subsections provide details on how to customize the related elements:
- Product Search Field
- Product Filter – Search
- Product Filter – Categories
- Product Filter – Attributes
- Widgets – Provides an overview of the widgets provided by the extension.
- Shortcodes – Shortcodes provided by the extension.
- API Functions – Equivalent API functions which can be used in template files.