[Support request] Custom Header

[Moretasks]

Hello,

How can create our website header like https://www.goodrxmedicine.com/?
If yes, then could you please send any documentation or Ref video?

Regards

[David]

Hi there,

that’s not easy – does the Cart Menu have to be in that position ?

[Moretasks]

Hello,

NO, we don’t need a cart button over there

Regards

[Fernando]

Hi there,

To make things much easier, one approach is to start with a similar template which may imported from the site library.

For reference: https://docs.generatepress.com/article/using-the-site-library/

Specifically, one similar site which may be imported from Appearance > GeneratePress > Site Library is Prime.

See this to know how it would look like: https://gpsites.co/prime/

After this, you may edit the logo, colors and other stuff through the customizer.

Here is the link to our documents for reference: https://docs.generatepress.com/

Other modifications can also be done, but it would be best to do it one by one and preferably new topics for each issue/inquiry to avoid confusions.

Kindly let us know. Hope this clarifies. 🙂

[Moretasks]

Thanks for the help,

Can we import only header because we don’t need products and all?

Regards

[David]

Hi there,

unfortunately not – its ALL or nothing.
You can of course import it 100% and just delete what you do not need.

If not you can follow these steps:

1. Customizer > Site Identity and set it to display your site title or logo.
2. Customizer > Layout > Primary Navigation –> Location: After Header
3. You will need this plugin for the search:

https://wordpress.org/plugins/ajax-search-for-woocommerce/

4. Now you need to create 2 x Hook Elements in Appearance > Elements ( make sure Elements is enabled in Appearance > GeneratePress ):

https://docs.generatepress.com/article/hooks-element-overview/

4.1 The first hook is for the Search in header.
Add the Search Plugins Shortcode.
Set the Hook to generate_after_header_content
Check execute Shortcodes
Set Display Rules to Entire Site

4.2 The second hook is for the login
Add this as the Hooks content:

<span class="menu-bar-item">
    <a href="https://gpsites.co/prime/account/">Login | Register</a>
</span>

Change the URL to your site
Set the Hook to generate_menu_bar_items
Set Display Rules to Entire Site

5. Now its just a case of hitting the cutomizer typography and color styles for your needs.

[Moretasks]

THANKS, DAVID

Could you please tell me how can I edit the header menu for mobile devices?
blog.goodrxmedicine.com

Regards

[David]

What layout do you require on Mobile ? As you have a larger logo then prime and you have 3 buttons in a header widget. So replicating the Prime site probably won’t work. Let me know.

[Moretasks]

Hello,

We just created a simple menu & it shows blank on mobile devices.

Regards

[David]

In Appearance > Menus ( or Customizer > Menus ) edit the menu you want and make to check the Off Canvas Panel in the list of Locations.

[Author]

Posts