For you to create a good looking blog, you must understand your template very well. Adding an image or ad banner whose width is more than that of the sidebar, will make the image fall off your sidebar and even make your blog look scattered. Hence, today, I have decided to share with you, how to know if the width of an image or ad unit will fit into your blog header and sidebar or not.
Knowing the width of your sidebar also comes handy when adding widgets like the Facebook Like box etc to your blog in which you will have the option to indicate the size of your widget.
How To Get Started
Log in to your Blogger dashboard.
Go to Layout or Design
Right on the page elements page, you will see the "Header" as seen in the picture below
Click on the "edit" next to it.
This will bring up a new window similar to what you are seeing in the picture below:
Look down right under the "shrink to fit". You will see something like: "Image will be shrink to xxx pixels wide".
Just make sure the image you want to upload as header image is not more than the xxx pixels indicated as explained above. Though it will be shrinked to fit if bigger but this might affect the quality of the image. More so, if you are to add an image or Adsense unit to the Header via the "Html/Javascript" gadget, kindly consider the width limit as explained above.
As for the Sidebar,
Go to Layout or Design and click on the "Add Gadget" right on the sidebar.
Select the "Picture" gadget and you will also see the "shrink to fit". The pixels highlighted below it should give you an idea of the width of an image or ad banner that will not be too big for the sidebar.
Example
Let's assume images to be added to my sidebar will be shrinked to 200pixels. This simply means if I decide to add a 728x90 Adsense ad unit to the sidebar, it WILL NOT fit into the sidebar because the 728 is far more than 200pixels of the sidebar. Hence, I will not be able to add it to the sidebar but rather go for the "160 x 600" Adsense ad unit since 160 pixels is less than 200pixels of the sidebar, which means it will fit perfectly into the sidebar.
I hope you understand this, if not, you can use the comment from below to drop your comments
That's all.
If you are using a Blogger template compatible with Template designer, you can easily adjust the width of your blog and sidebars, should in case you want to create enough space for your ads or images to fit into.
I hope this helps.
Cheers!
Knowing the width of your sidebar also comes handy when adding widgets like the Facebook Like box etc to your blog in which you will have the option to indicate the size of your widget.
How To Get Started
Log in to your Blogger dashboard.
Go to Layout or Design
Right on the page elements page, you will see the "Header" as seen in the picture below
Click on the "edit" next to it.
This will bring up a new window similar to what you are seeing in the picture below:
Look down right under the "shrink to fit". You will see something like: "Image will be shrink to xxx pixels wide".
Just make sure the image you want to upload as header image is not more than the xxx pixels indicated as explained above. Though it will be shrinked to fit if bigger but this might affect the quality of the image. More so, if you are to add an image or Adsense unit to the Header via the "Html/Javascript" gadget, kindly consider the width limit as explained above.
As for the Sidebar,
Go to Layout or Design and click on the "Add Gadget" right on the sidebar.
Select the "Picture" gadget and you will also see the "shrink to fit". The pixels highlighted below it should give you an idea of the width of an image or ad banner that will not be too big for the sidebar.
Example
Let's assume images to be added to my sidebar will be shrinked to 200pixels. This simply means if I decide to add a 728x90 Adsense ad unit to the sidebar, it WILL NOT fit into the sidebar because the 728 is far more than 200pixels of the sidebar. Hence, I will not be able to add it to the sidebar but rather go for the "160 x 600" Adsense ad unit since 160 pixels is less than 200pixels of the sidebar, which means it will fit perfectly into the sidebar.
I hope you understand this, if not, you can use the comment from below to drop your comments
That's all.
If you are using a Blogger template compatible with Template designer, you can easily adjust the width of your blog and sidebars, should in case you want to create enough space for your ads or images to fit into.
I hope this helps.
Cheers!
You really nailed it bro but I have a question. if my sidebar is 400px and i have 3 banners ( 125x125px wide each), can I write the codes for the 3 banners in one html/javascript gadget since the total of the 3 banners will still be less than 400pixels of the sidebar?
ReplyDeleteyes, you can bro
Delete