• ADM

    (@csgobluegem)


    Hi,

    I want to add a banner in the header of my website [ redundant link removed ] that will be visible for each pageview. The banner would be on the right of the website logo centered with the menu that is positioned on the top right. Sizes will be 728×90 when the website is visited by desktop/tablet and I would like the image to “resize” to 320×50 (or maybe I can add a different image that is natively 320×50) when the website is visited by a mobile user. I am not talking about an Adsense banner, just a banner that I can upload on my Media library.

    How can I do this? Which code should I add to the theme and where? (I guess on Theme Header (header.php) but I don’t know where and how to put the images. I’m sure this is quite a noob question but I haven’t seen a header banner on Go websites to inspect the implementation.

    Thank you!

    Andrea

    • This topic was modified 4 years, 4 months ago by Jan Dembowski.

    The page I need help with: [log in to see the link]

Viewing 2 replies - 1 through 2 (of 2 total)
  • Hi @csgobluegem, thank you for reaching out.

    Of course, there is a way to make this edit. However, we have to perform some steps in order to make it happen.

    1. You’ll have to create a child theme of your Go theme (if you don’t have one)
    – You can create a child theme easily with the plugin “Child Theme Configurator”. Just follow the on-screen instructions and the theme will be created.
    – Afterward, the child theme’s folder go-child will be created in the wp-content/themes folder.
    2. Copy the file header.php from folder “go” to folder “go-child”.
    3. Find the line that says <main id="site-content" class="site-content" role="main">
    and right above that line (under </header>), add the following code:

    <img src="INSERT_IMAGE_URL_HERE">
    Make sure to add the actual URL of the image to the place I marked.

    This way the image will be added right under the header and will be displayed on every page. Also, by creating a child theme, we ensured that after the next Go theme update, the changes won’t be lost.

    Once you add the image, feel free to reach out back to me so we can add a custom CSS code that will resize the image on the mobile devices.

    Best Regards,
    Pavle

    Thread Starter ADM

    (@csgobluegem)

    Thank you @gdpavle for your detailed answer.
    I need to create the banner first, then I’ll follow your instructions step by step. I’ll let you know when I add the banner.
    The banner has to be clickable and it will redirect to a different domain. If it will be multi-frame a GIF is ok or it is better an HTML5 script? I’m afraid it would be heavy so I might go for a JPG or a WebP (the lighter the better, right?). For the integration in the header it’s the same thing? (either a script, if it’s a html5 animated banner, or the ?

    Thank you very much!

    Andrea

Viewing 2 replies - 1 through 2 (of 2 total)
  • The topic ‘Add banner on header’ is closed to new replies.