Add style to the search engine created with FacetWP in Listable with CSS

In the previous tutorial we saw how to add a custom finder on any Listable page

This search engine is just as powerful as the one that comes in the header of the home in Listable but it comes without a design.

In this tutorial we will see how we can add design through CSS.

We are going to give it a style similar to the search engine that is in the Home.

Remember that in the Premium Zone we have a Guerrilla CSS course for WordPress

Using the Google element inspector, we will copy the CSS of the main search engine.

To see the course you have to be a Premium Member. If you are not subscribed to the Premium Zone you can give sign up for €10/month here

43 Add style to search engine created with CSS in Listable

We will go from a search engine without design:

To a search engine with layout:

As you can see, with very little CSS we can make our search engine look much prettier.
The trick is to take advantage of the classes already created in the template.

We would need to add the red search button, we will see it in the next video.

Until the next tutorial 😉