Promote Cartoon Character To Decorate Your Blog Footer

Promote Cartoon Character To Decorate Your Blog Footer


Tailor your Footer

Cartoon Character is now-a-days rapidly using in different blog which has brought a revolution in blog platform as well as design. Many bloggers are using Human character as a Theme of their own blog which is able to establish a place in visitors mind. whenever they think about that particular blog then an image will appear in your mind. This can be call creating an unique identity through Cartoon Character. We can use different Human Character set that is available to use for Personal and Commercial purpose under creative common License or you can use by your own creation.

However I have chosen a section that is often included in some good blogs with Human Character called Picture Footer. This section is generally placed above or below Blogger footer which contain some pictures with specific message and links such as, About Us, Advertise Here, Write For Us, Contact Us etc. Generally this section easily distract visitors mind to Images. We know Images fulfill the lacking of blog contents, with this theory If you can add some attractive Images on the above/below footer then section then you can overcome from certain lacking as well as you blog will become more beautiful.

I have got many Message and E-mail about the Source code of BloggerSpice's Picture Footer which is holding a place above footer section and finally I am going to reveal it for my loyal readers thus they can tailor their own blog.

I have used here a set of Images of Teen Girl who is expressing different gesture. This image set is under creative common License 3.0  furthermore you can use it for personal and commercial purpose but you are not allowed to redistribute. So you don't have any legal bindings to use it. So let's go for main tutorial to add this in your blog template. Before proceed you must have a Full Horizontal Widget in your templates.

Live Demo

Step 1 Go to your Layout tab.

Step 2 Click on "Add a Gadget" then select "HTML/JavaScript" Gadget.

Step 3 Now Copy the below code and paste it in "HTML/JavaScript" Gadget and Save it.

<div class='widget-content'>
border-top:5px solid #c0c0c8;
padding:50px 0 10px 0;
#BS-Footer li{
background:url( no-repeat 0 0;
padding:0 5px;
#BS-Footer li:hover{
background-position:0 -180px;
#BS-Footer li:first-child{
#BS-Footer li a{
text-shadow:#222 0 -1px 0;
#BS-Footer li a:hover{
#BS-Footer li a img{
#BS-Footer li a br{
#BS-Footer li a strong{
-webkit-transition:opacity .2s linear;
#BS-Footer li a:hover strong{
}                                                                                                                                /**/
<div id='BSFooter'>
<ul id='BS-Footer'>
<li><a href=''>
<img alt='Learn More About This Site!' height='198' src='' width='200'/>
<strong style='background: url(;'>About Us</strong>
Learn more about This Site!</a></li>
<li><a href=''>
<img alt='Advertise' height='198' src='' width='200'/>
<strong style='background: url(;'>Advertise</strong>
Want To Advertise Here!</a></li>
<li><a href=''>
<img alt='Need Help' height='198' src='' width='200'/>
<strong style='background: url(;'>Need Help</strong>
Need Help For Your Blog</a></li>

<li><a href=''>
<img alt='Write For Us' height='198' src='' width='200'/>
<strong style='background: url(;'>Write For Us</strong>
Be Our Guest Publisher</a></li>

<li><a href=''>
<img alt='Contact Us' height='198' src='' width='200'/>
<strong style='background: url(;'>Contact Us</strong>
Want To Interact With Admin</a></li>
<div class='clear'></div>


  • Change with your link Location.
  • Change Learn More About This Site! With Image Alternative text. 
  • Change Learn more about This Site! with your own Text.

CSS Part of Promote Cartoon Character To Decorate Your Blog Footer

Please follow the CSS Tutorial from below link to fix the widget. If you face any problem then feel free to contact with me.

Promote Cartoon Character To Decorate Your Blog Footer
4 Stars stars - "Promote Cartoon Character To Decorate Your Blog Footer" Cartoon Character is now-a-days rapidly using in different blog which has brought a revolut...

Post a Comment

thank you so much. I was looking for this source code

Boss its cool..thanks

thank you so much for smiley and cartoon character in your blog

Million thanks!!

hey please help me to get full horizontal widget because i don't have in my template

you can easily create a new gadget after that you can add the above widget..plz visit the below link...

if you have any more querry plz. feel free to ask..

sir how to protect my content from copying and how to complain DMCA If Any one Is copying my content?

thanks for your comment just visit the following link and read the article about to complain DMCA..

Thanks Man Really Helped

Hey hello admin Please Give Me Cartoon Characters Of Boys Like You ...........Please This Is Request ................And I Want Scroll Bar.............Thank you................And Admin My Widget Container Is 960px So it Is Not Getting Fixed Inside IT What Should I do............please Reply Fast

I have visited your site widget is fit now . just added a code before starting the widget code...

reduce the character size width='200' to width='175' maybe now it will fix.

And boy character is publishing soon..

For scrollbar please visit the below tutorial link-----

Please Help It doesn't overlaps the footer!! So it has a Cutted Head!! HELP!!

Hi Ritesh..Please visit the below link and follow only CSS Part to solve the issue.

Bro What Happened TO This Widget Please Check The Demo

Hi Nauman.. After changing the Demo template it become narrow. Nothing else. Anyway thanks for informing me.

Hello Brother How Are You???? Please check this widget images are coming half half i have just checked the URL the image is half only so fix it soon

Alhamdulillah I am fine. Which one is half or broken..I just check the Demo and code in HTML Editor everywhere this is working fine.

Please check first and second images of advertise and about us in the script ...

thanks you so much for article and smile..good job
berita unik

this is coming vertically , how to make it horizontal

Hi Pranav, I think your template's widget container width is not set 100%. You can resize the image image size by changing width='200' with width='170' or according to your desire. Generally this widget place at the bottom of the template, I means above the footer section. So there should be a widget adding option which should be minimum 1030px width.

Facebook Group Community Disqus Channel Code ConverterHide Code Converter Show EmoticonHide Emoticon

Got questions? Ask ’em below! While we’re here, you might like to give any feedback about this Post, Your comment inspire us to continuous Improvement of This Blog and Contents. Your words are your own, so be nice and helpful if you can. Please, only use your REAL NAME, not your business name or keywords. Using business name or keywords instead of your real name will lead to the comment being deleted. Anonymous commenting is not allowed either. Limit the amount of links submitted in your comment. We accept clean XHTML in comments, but don't overdo it please.

Make sure you tick the Notify Me box below the comment form to be notified of follow up comments and replies. Thank you for commenting

Contact Form


Email *

Message *