How to add a mobile-only search bar
If you'd like to have a prominent search bar on your site that displays on mobile, we'll show you how in this tutorial! Find your theme name below and follow the instructions.
Charlotte, Magnolia, & Pippa themes
- Click here and copy the code.
- In your WordPress dashboard, go to Appearance > Editor > Theme Functions (functions.php).
- Scroll to the VERY bottom, make a couple line spaces, and paste the code. Click Update File.
- Next, click here and copy the code.
- Go to Appearance > Customize > Additional CSS and paste the code in the box. Click Publish.
- Lastly, go to Appearance > Widgets and add a search bar to the Mobile Search widget area.
Vivienne theme
- Click here and copy the code.
- In your WordPress dashboard, go to Appearance > Editor > Theme Functions (functions.php).
- Scroll to the VERY bottom, make a couple line spaces, and paste the code. Click Update File.
- Next, click here and copy the code.
- Go to Appearance > Customize > Additional CSS and paste the code in the box. Click Publish.
- Lastly, go to Appearance > Widgets and add a search bar to the Mobile Search widget area.
Any other 17th Avenue themes
- Click here and copy the code.
- In your WordPress dashboard, go to Appearance > Editor > Theme Functions (functions.php).
- Scroll to the VERY bottom, make a couple line spaces, and paste the code. Click Update File.
- Next, click here and copy the code.
- Go to Appearance > Customize > Additional CSS and paste the code in the box. Click Publish.
- Lastly, go to Appearance > Widgets and add a search bar to the Mobile Search widget area.