Customization styles & templates

The customization of the plugin requires some experience in HTML, CSS and even PHP to change the templates around to an arbitrary theme look. Plugin’s styles and templates are designed to work relatively well with most themes, but if you do have the need to modify any template and add or remove styles – try to follow these conditions:

  • Create new folder in your child theme “wcsearch-plugin/”. You will place custom files in this folder.
  • If you want to change the layout or styles of search form on your site do not modify existing CSS files, instead create new file and give it exactly the same name, just add -custom postfix to the end of name before file’s extension. For example, resources/css/frontend.css file from the plugin folder must have following name and placed into wcsearch-plugin/resources/css/frontend-custom.css folder of your child theme. Using this method will save your modifications and custom code during further updates.
  • The same convention for any templates – .tpl files in templates/ folder. For example, custom templates/templates/search_form.tpl.php template must have following name and placed into wcsearch-plugin/templates/search_form-custom.tpl.php folder of your child theme.
    Relative path of custom file in your child theme “wcsearch-plugin/” folder must be exactly the same as the path of original file. resources/css/ will be wcsearch-plugin/resources/css/, templates/search_fields/ will be wcsearch-plugin/templates/search_fields/.
  • Inside resources/sass/ folder the plugin contains SASS files for the frontend and backend parts including RTL styles.

The plugin has special customization settings to change some elements on frontend pages like background and elements colors, use layout, use border.