[Resolved] Change/remove site title h1 tag

This topic contains 9 replies, has 2 voices, and was last updated by  Andrew Misplon 1 year ago.

  • Author
    Posts
  • #7141

    katja
    Participant

    Hi,
    I would like to change the site title h1 to something else.
    Now the html in header.php is:
    <div class="site-branding"><a href="<?php echo esc_url( home_url( '/' ) ); ?>" rel="home"><?php ultra_display_logo(); ?></a></div>

    This produces outcome:

    <div class="site-branding"> <a href="https://mysite.com/" rel="home"><h1 class="site-title">My Site Title</h1> </a></div>

    So the h1 appears from somewhere. I want to have my outcome for example like this:

    <div class="site-branding"> <a href="https://mysite.com/" rel="home"><div class="site-title">My Site Title</div> </a></div>

    What should I do? Thank you in advance!

    #7142

    Andrew Misplon
    Keymaster

    Thanks for posting. The way I’d go about this is:

    1. Plugins > Add New, install and activate Code Snippets plugin.
    2. Go to Snippets > Add New, name as you’d like, in the snippet body insert the following: https://pastebin.com/w8xWdUCZ. Go to that link to get the function.
    3. Once the function has been inserted, enable option to Only run on site front-end and then click Save changes and activate.
    4. Finally, go to Customize > Additional CSS and insert:

    .site-header .site-branding h2.site-title {
        display: block;
        font-size: 36.00002px;
        font-size: 2.57143rem;
        font-family: "Muli", sans-serif;
        font-weight: 300;
        letter-spacing: -1px;
        line-height: normal;
        margin: 0;
        transition: 0.3s;
        zoom: 1;
    }

    Hope that helps. I haven’t edited the logo function yet so once inserted into Code Snippets, please, change the h1 tag to h2.

    #7143

    katja
    Participant

    Thanks Andrew, did all this, but no change. The h1 tag is still there.
    (Also I did clear all caches.)

    #7144

    Andrew Misplon
    Keymaster

    A common mistake is to save the code snippet but not activate it. You can do that. Check that the snippet is saved and activated. Also that it’s set to run everywhere OR run on the front-end.

    #7145

    katja
    Participant

    πŸ™‚ – as I said I did all the things you told. It’s activated and it’s run on frontend. Plus I also cleared all the caches. Nothing changed. For some reason it looks like the snippet is not active or it just doesn’t do anything in my case.

    #7146

    Andrew Misplon
    Keymaster

    For sure, I did read your reply. I was just going through the common steps users miss when using Code Snippets plugin for the first time. Please, send me a screenshot of the entire snippet plus the bottom section which shows the save and display options. Thanks.

    (Easiest way would be to upload to a cloud site like Dropbox or Drive and send the link to the image. Thanks.)

    #7147

    katja
    Participant

    snippet

    #7148

    Andrew Misplon
    Keymaster

    Thanks πŸ™‚

    Sorry if you missed my instruction to change the snippet. You’ll need to edit the h1 tag and change it to h2.

    I haven’t edited the logo function yet so once inserted into Code Snippets, please, change the h1 tag to h2.

    Otherwise everything looks great. Also, don’t forget to insert the Custom CSS so that your new h2 tag has styling associated with it.

    #7149

    katja
    Participant

    Aaaaa- there the h1 is! I didn’t understand this, now it’s working! Thank you very much! πŸ™‚

    #7150

    Andrew Misplon
    Keymaster

    Awesome πŸ™‚ Really glad to hear that helped. Thanks for hanging in there.

    All the best.

Viewing 10 posts - 1 through 10 (of 10 total)

You must be logged in to reply to this topic.

Scroll to top