How To Manually ADD AN IMAGE BANNER On BLOGGER Using HTML Code 2022

How To Manually ADD AN IMAGE BANNER On BLOGGER Using HTML Code 2022 Welcome to this tutorial on nosr web my name is catalyst okoli in today's tutorial i'll show you how to add an image or a banner to your blogger blog using html code so this is the back.

How To Manually ADD AN IMAGE BANNER On BLOGGER Using HTML Code 2022

Office of my blog let's go to the layout section and i'll also go down here and view the blog's front end so in this video i'll be adding a long.

Horizontal image banner ad and i'll also be adding a square banner ad right here on the sidebar so the first thing you do is to get your image or your images ready.

And these are the two images i'll be using this image and this other one here is a tip before i commence.

Try to always convert your images from jpeg or png into webp format because webp format is the latest recommended file format by google alright so the first step is to go to.

Layout right here if you scroll down here right here where you see home ads top is this particular long banner section right here.

[Music] so go ahead and click on the edit icon we'll go ahead and delete this default code ctrl a to highlight everything and.

Backspace to delete i'm now going to paste the html code that will enable us to add an image banner to our blogger blog if you need this code go to the.

Description box below and follow the link to where you'll find the code so basically there are two things we need to edit in this code before we hit save.

So the first thing we're going to change here is you see this place that says outgoing url to your landing page you're going to replace this text with the url where you want your visitors or anyone.

That clicks on your banner ad to land in my own case i want my visitors to land on my youtube channel's homepage so i'm going to highlight all of this.

And i'll paste the url of my youtube homepage make sure you put your links within the quotation marks for example this quotation mark right here and.

VEJA TAMBÉM:

    This other quotation mark right here all

    Right and the second thing we need to change in this code before we hit save is we need to replace this text that says.

    Image url from blogger with the actual image url of our images as hosted on blogger let's go ahead and open a new tab open the back office of your blog.

    Attempt to create a new post we are not actually going to publish anything right here we just want to temporarily import our images here so that we can extract the image url from them then after that.

    We can go ahead and discard this post because we don't need to publish this post come over here to insert image click and we're going to upload from computer.

    Click on choose files then go to where you've saved your images or banners so let's start with the long horizontal banner when it loads up you click on it to select.

    Then hit the select button it has gone ahead and imported that image right here on blogger you can come here on this gear icon and hit extra large.

    Then click on the image and right click where it says copy image address go ahead and click so now we have extracted the image address for this image as hosted on.

    Blogger and we can now go back here and replace this image url from blogger with the actual url we just copied press ctrl v to paste.

    And just like before please make sure you pasted your image url within the quotation marks you can now go ahead and click on save also click here on this disk icon to.

    Save

    Then hit on view blog and as you can see we have successfully added an image banner to the top of our blog.

    And if i go ahead and click on this image it'll take us to my youtube channel perfect so i want to add another image banner to.

    This blog but this time it's going to be a sidebar banner [Music] that is exactly how you add image banners on blogger using html code.

    DISCLAIMER: In this description contains affiliate links, which means that if you click on one of the product links, I'll receive a small commission. This helps support the channel and allows us to continue to make videos like this.All Content Responsibility lies with the Channel Producer. For Download, see The Author's channel. The content of this Post was transcribed from the Channel: https://www.youtube.com/watch?v=uZafMEr1NGo

Post a Comment

Previous Post Next Post