Site logo

Archived topic

Creating a simple subheader with text

7 replies · Started by Ben on March 30, 2021

Viewing posts 1–8 of 8

Hi guys

Im looking to create a simple subheader with some text centre aligned.
Basically a small bar running horizontally under the header with a background colour and some styled text.
I believe I have to use a hook or something? Or was there an easier way?

If i use a hook, do I then have to add some css to my stylesheet?

Dont judge me Im not a coder :)

Is someone able to point me in the right direction, or perhaps help with some instructions?

Thanks in advance

Hi there,

If i use a hook, do I then have to add some css to my stylesheet?

These 2 don't overlap. Hooks allow you to change or insert HTML elements. CSS styles the HTML elements you hook in. :)

Can you point us to the page and the section you want this applied on? So we could point you to the best hook to use.

or you can check our Hook visual guide to see for yourself which hook you think is more appropriate.
https://docs.generatepress.com/article/hooks-visual-guide/

Mockup images of how you want the subheader to look like (layout+design) would help a lot.

Sure i have put a link to the same header/sub header in the private info.
The slightly green sub head is what I want to replicate

To clarify: Are you pertaining to the section boxed in red shown here? https://share.getcloudapp.com/5zuBD8qb

If so, you can easily do this with either:

A Header Element - https://docs.generatepress.com/article/header-element-overview/

or a Block Element - https://docs.generatepress.com/article/block-element-overview/

or if you have something pre-made from a shortcode, a Hook Element - https://docs.generatepress.com/article/hooks-element-overview/

These are GP Premium modules that allow you to insert HTML elements(Header), Gutenberg editor layout (Block) or PHP snippets + shortcodes (Hook) to any parts of the page.

Not quite, literally the green bar above that box has the affiliate disclosure.

Ah I see.

If that's the case, then either Block or Hook element (if you have custom HTML) can be used to insert that.

You can use the generate_after_header hook to place that in.

A quick example: https://share.getcloudapp.com/04uAr9qX

Thanks so much for your help Elvin, I really appreciate it.
Ill give this a whirl and let you know if i have any issues.

No problem. Glad to be of any help. :)

This archived topic is closed to new replies.