[Support request] Content title Vs. H1 title

Home Forums Support Content title Vs. H1 title

Viewing 8 posts - 1 through 8 (of 8 total)
  • Author
    Posts
  • #1046692
    Marina

    Hi Guys,

    Does the content title functions as H1 title so I don’t need to add H1 for each page/post and start with H2 titles from the begining?

    If so how do I align all to the center?

    And also if I disable the content title does it mean the H1 is not valid from SEO perspective?

    #1046901
    David
    Staff
    Customer Support

    Hi there,

    thats correct the content title is output as H1 on each post and page. So you don’t ( and shouldn’t ) add a H1 to the content.

    You can align the entry title with this CSS:

    h1.entry-title {
        text-align: center;
    }

    If you disable the content title then yes you’re removing the only H1 from the page, so not advisable unless you are adding it manually to the content.

    #1047479
    Marina

    Thanks! that helps!
    How do I manage to align differently for different pages though? Is it even possible?

    I have 3 more questions please:

    1. How do I add breadcrumbs to pages? I manged to do it to posts only.. :\
    2.How do I move the site title in the navigation bar to be more on the right and not on the edge of the left side of the navigation bar?
    3. how do I close the “Leave a Comment” text box and so if someone would like to leave a comment they can click the link?

    Thanks!!

    #1047586
    David
    Staff
    Customer Support

    If you want to change alignment on a page by page basis you would be better off Disabling the Content title in the Theme and adding it directly to the editor. You can remove it using the Disable Elements metabox in the post editor, or apply it with display rules using the Layout Element:

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

    1. Breadcrumbs would be generated by your SEO plugin heres how to add those for Yoast:

    https://docs.generatepress.com/article/adding-breadcrumbs/

    2. Add this CSS:

    .main-navigation .navigation-branding {
        margin-left: 40px;
    }

    3. Do you have an example of this so i can better understand?

    #1048172
    Marina

    Thanks David!

    1. As I mentioned before it does appear on posts but not on pages although I’ve added pages as well
    2. How do I differentiate between mobile and web view? At the moment it looks good on Desktop but not on mobile
    3.yes, here for example
    https://www.giftbasketdiy.com/family-gift-baskets-for-christmas/

    #1048284
    David
    Staff
    Customer Support

    1. This is probably the hook you have chosen is not available on the Page. You can see all of the main hooks here:

    https://docs.generatepress.com/article/hooks-visual-guide/

    2. This:

    /* Desktop */
    .main-navigation .navigation-branding {
        margin-left: 40px;
    }
    /* Mobile */
    @media (max-width: 768px) {
        .main-navigation .navigation-branding {
            margin-left: 20px;
        }
    }

    3. Not sure that helps lol – so the Comments form you want hidden by default and the user has to click a link/button to display it?

    #1048460
    Marina

    Thanks for 2!
    Is there a way to increase the 3 lines of the off canvas menu icon on mobile/desktop? to make it thicker/bold?

    3. Yes, that’s what I meant. Wht is it open by default its a bit strange..

    I’ll try once more with the breadcrumbs on pages 🙂

    #1048635
    David
    Staff
    Customer Support

    2. Its default behaviour is to have the comments form display. To hide / show it will require some CSS:

    #reply-title {
    	cursor: pointer;
    }
    
    .comment-form {
    	display: none;
    }
    .comment-form.visible {
    	display: block;
    }

    And then some Javascript:

    <script type="text/javascript">
    const showComments = document.querySelector("#reply-title");
    const commentsContainer = document.querySelector("#commentform");
    
    showComments.addEventListener("click", ()=>{
        commentsContainer.classList.toggle("visible");
    });
    </script>

    The JS you can add to a Hook Element, select the WP_footer Hook and set your Display Rules to All Posts.

Viewing 8 posts - 1 through 8 (of 8 total)
  • You must be logged in to reply to this topic.