Adds Toggle Search Icon to OceanWP Theme’s Top Bar

OceanWP is a free theme on WordPress platform. You can download it from wordpress.org’s theme’s repository section. This theme have some cool features which are not available in any other themes.

Recently I was working on site which is using this theme with Elementor page builder. Site have secondary menu bar at header top bar. Client was wanting a toggle search icon at right side of this secondary menu bar. By default this toggle search icon feature is only available with primary menu bar in theme customizer. Therefore I was thinking how I shall implement it to top bar. So I went to theme customizer and saw a good option  “Select template” under Top Bar -> Content section.

I quickly drive to this steps. I created an new template with Elementor page builder.

  1. Navigate to Dashboard
  2. Click on Theme Panel -> My Library link . If you install the OceanWP Extra add-on, you will get “Theme Panel” menu at Dashboard.
  3. Click on Add New button
  4. Creating a custom library with Elementor page builder. Using Elementor because Client purchased the extensions bundle of OceanWP theme & there have an extension “Elementor Widget” . Install this add-on on the site.
  5. There have inbuilt widget “search”
  6. Drag&Drop this widget and build the layout.
  7. Next go to Appearance -> Customize page
  8. Click on Top Bar panel
  9. Click on Content section
  10. Select template from template drop down
  11. Click on Publish button

Finally it was working like a charm.

This site uses cookies to offer you a better browsing experience. By browsing this website, you agree to our use of cookies.