Adding a Link to My Header Using Independent Publisher 2

  • coniption · Member ·

    Hi guys,

    I’m tweaking my blog layout and decided I want my header to span all my blog posts and serve as a link back to the main page (cluelessmusings.com) when visitors click on it.

    I’ve looked everywhere in the theme settings and in the forums and can’t seem to find a solid solution for such a seemingly simple task. I do have access to the CSS editor, but I’m not fluent. =/

    Can anyone help?

    Thanks!

    The blog I need help with is: (visible only to logged in users)

  • justjennifer · Member ·

    Hi there, by default the header of your site is a link back to the site homepage.

    However, it looks like you’re using a header image instead of the Site Title and Tagline and to my understanding (I might be wrong) that image should be clickable when you’ve hidden those items in Site Identity in the Customizer.

    Since it looks like you have a paid upgrade plan, you can access direct support when you post to https://wordpress.com/help/contact They’ll be able to assist you with that. If not, post back here and/or add the MODLOOK tag in the tags section of the forum post sidebar.

  • evanb503 · Member ·

    Just to understand a bit better: You’re wanting to use the main image as a link back to the front page? Or are you wanting to use a typical header with a menu? Currently I only see a header image, but no menu on the top.

  • coniption · Member ·

    No, no menus. I just want to embed a link in the image that I’m currently using as the header.

  • evanb503 · Member ·

    If the header is loading in from your template, open up the Site Editor from the Appearance menu on the dashboard.

    From there, open up the template you’re using: Most likely Header & Footer only or something similar. You can select the template from the dropdown menu on the top center of the page.

    Click on the header image block, and there should be a menu that opens up with an icon that kind of looks like a paperclip. Click on that and add the url you want to link.

    https://wordpress.com/support/images/image-settings/#within-posts-and-pages

    Did that do the job?

  • coniption · Member ·

    No, that doesn’t work. The only options I have are Header Image, which only lets you choose an image for the header but offers no linking options. When I click on the actual header image block, it takes me to Site Identity, which also doesn’t have any linking options.

  • evanb503 · Member ·

    Have you tried just replacing the Header Image block with a regular image block? Would that be a good solution for you? For functionality, I think that would be worth trying.

  • kokkieh · Staff ·

    Hi there,

    This theme doesn’t link a custom header image to the homepage, and it’s not possible to manually add a link – adding a link to the custom header image would require modifying the theme’s underlying PHP code.

    Have you considered adding your image as a site logo instead of as a custom header image? Site logos are always linked back to the homepage, and this theme displays the logo across all posts and pages.

    If you add the logo and it’s too small, we can then try to help with custom CSS code you can use to make it bigger.


    @evanb503

    Have you tried just replacing the Header Image block with a regular image block?

    Independent Publisher-2 isn’t a block theme, and doesn’t give users access to the site editor to modify the theme’s templates. The header image isn’t a block. It’s a hard-coded element of the theme, and is set in the Customizer :)

  • coniption · Member ·

    I did try the logo option, but it’s way too small. Would definitely need help making it bigger using CSS.

    The ideal header image size according to this theme is 1240×600.

  • staff-totoro · Staff ·

    Hi there,

    Yes this seems to be possible. To do that you will want to un-set your header image, and instead upload the image as the logo instead (and skip the cropping step)

    And then you can use the following CSS to make the logo full-width:

    
.custom-logo {
    max-width: unset;
    width: 100vw;
    max-height: unset;
}
.site-header {
	padding: 0;
}

    This worked in my tests, but I would recommend a higher resolution image as the logo gets rather pixelated at larger screen sizes. Also you may want to experiment with cropping out the whitespace you have in your image now, as that somewhat limits how wide the image will appear.

    Hope that helps. Please let us know if you have any more questions.

  • coniption · Member ·

    Thanks! This sounds like it would be the best solution without having to completely change or overhaul my theme.

    I’ll try this as soon as I get home. Thankfully, the original logo is pretty high resolution so it should look fine once I crop out the white space.

    I’ll update you and let you know how it goes. 🤞

  • coniption · Member ·

    The Logo/CSS combo worked!

    I cropped out all the white space I could, but it still looked a little blurry at max width, so I reduced it a little bit to keep it just big enough to look like a header, but small enough to keep it looking smooth.

    Thanks so much for the help! =D

  • The topic ‘Adding a Link to My Header Using Independent Publisher 2’ is closed to new replies.