Site logo

Archived topic

Modify h1 of blog page

17 replies · Started by Jeremy on January 20, 2021

Viewing posts 1–15 of 18

Hi Support,
Can you tell me where I can modify the h1 (Affichage des Contenus) on this blog page.
Thanks
Jeremy

Hi,

Can you specify the modifications you want to apply to it?

If it's simple styling for the font you can use .page-hero .inside-page-hero h1 CSS selector:

Example: Changing the font color to red and adding background color of green.

.page-hero .inside-page-hero h1 {
color: red;
background-color: green;
}

Here's how to add CSS: https://docs.generatepress.com/article/adding-css/

If you want to modify the HTML structure, go to Appearance > Elements and find the Header Element that applies to this page among the list of Elements.

More about header element here:
https://docs.generatepress.com/article/header-element-overview/

Hi Elvin,
Thanks for your answer.
I just want to modify the content of the h1 tag.
But I can't do that on the page edit, it's strange.
Thanks

I just want to modify the content of the h1 tag.
But I can’t do that on the page edit, it’s strange.

As mentioned on the previous reply, If you want to modify the HTML structure (and its contents), go to Appearance > Elements and find the Header Element that applies to this page among the list of Elements.

When you open the Header Element, you'll most likely see <h1>{{post.title}}</h1> in it's text area. That's the one responsible for the text display.

If you want to display the same static text, you can change {{post.title}} to the static text you want to add in place of it.

But if you want to keep using {{post.title}} it dynamic but change the text displayed on specific pages then you'll have to edit these specific pages' page titles instead.

Same problem for me, it's always "AFFICHAGE DES CONTENUS" who appeared on the front end. I have the problem for the woocomerce home page "PRODUITS".

I have tried to make a new element or to change the name of theses two pages, no change.

Hi there,

in your original Element that is displaying the {{post_title}} - you must go to the Display Rules and Exclude the new elements you have made

Hi David,

Thanks for your help.
I'm sorry but I can't find the solution.
I followed your tips but the title "Archives" set in the page doesn't replace the title "Affichage des Contenus".
Baptiste is it OK for you?

For the Blog page - you will need to create a separate Header Element and DO NOT use the {{post_title}} tag instead just manually add your title eg.

<h1>My blog title</h1>

It works!
Thanks for your patience David and Elvin.

Glad we could be of help

Hi,

Do you have multiple Header Elements? If so, make sure their display rules don't overlap. If they do, the older Header Element will take precedence over the latter.

Say for example, you have 2 Header Elements:

If the older Header Element has a display rule or "Entire Site", even if you make another Header Element with display rule of "Blog", the older Header Element will still display because "Entire Site" includes "Blog" in it.

To fix this, you either change the display rule location of the older header element to apply specifically on pages you want them to apply OR keep the rule "Entire Site" but exclude "Blog" so the other Header Element's rule doesn't overlap with it.

Same problem, the dropbox link have been updated with new screenshoots.

Same problem, the dropbox link have been updated with new screenshoots.

Can you try temporarily remove the Global Header and the exclusions from the other Header elements to test?

Header disappear (screenshoot added)

This archived topic is closed to new replies.