Howto: Add footer widgets to the Mimbo theme
by Kunal Jain on Jun.12, 2009, under design
I had promised (weeks ago) to post a tutorial on how to add footer widgets to the Mimbo 3.0 theme once I figured out how to add them to http://www.recipemobile.com. Although, I was able to make the necessary tweaks to recipemobile, I have not had the time to post a tutorial. So, for now, I am publishing the code I have added to enable the footer widgets. I hope to be able to update this post to a full tutorial soon.
You will have to edit 3 files in your theme:
Functions.php
In functions.php, add the following code under the existing widget code:
if ( function_exists(’register_sidebar’) )
register_sidebar(array(
‘name’ => ‘Mimbo Footerbar1′,
‘before_widget’ => ‘<div class=”clearfloat”>’,
‘after_widget’ => ‘</div>’,
‘before_title’ => ‘<h3 class=”widgettitle”>’,
‘after_title’ => ‘</h3>’,
));
if ( function_exists(’register_sidebar’) )
register_sidebar(array(
‘name’ => ‘Mimbo Footerbar2′,
‘before_widget’ => ‘<div class=”clearfloat”>’,
‘after_widget’ => ‘</div>’,
‘before_title’ => ‘<h3 class=”widgettitle”>’,
‘after_title’ => ‘</h3>’,
));
if ( function_exists(’register_sidebar’) )
register_sidebar(array(
‘name’ => ‘Mimbo Footerbar3′,
‘before_widget’ => ‘<div class=”clearfloat”>’,
‘after_widget’ => ‘</div>’,
‘before_title’ => ‘<h3 class=”widgettitle”>’,
‘after_title’ => ‘</h3>’,
));
Footer.php
In the footer.php file, add the following code right under the footer div definition:
Style.css
Now, all you have to do is edit your style.css files to add the appropriate styling to the footers. This is the css code that I have used to get you started.
#footerbar { display:block; clear:both; margin-top:-10px; list-style-type: none; list-style-image: none; margin-bottom:15px; } #footerbar ul { padding-left: 15px; } #footerbar h3 { color:#dadada; font-family: 'Tempus Sans ITC','Bradley Hand ITC','Comic Sans MS','Zapf-Chancery', cursive; font-size: 18px; letter-spacing:0.15em; border:none; margin:0px; } #footerbar h3.widgettitle { color:#dadada; border:none; } #footerbar a { display:block; } #footerbar1 { float: left; margin-right:10px; } #footerbar2 { float: left; } #footerbar3 { float: right; margin-left:5px; } #footerbar1, #footerbar2, #footerbar3 { width:32%; }
No related posts.
Related posts brought to you by Yet Another Related Posts Plugin.
6 Comments for this entry
Leave a Reply
- Part of the
Network
June 12th, 2009 on 12:35 pm
Thank you very much for this, Kunal. I think I will have my son to do the modifications. These kinds of additions are beyond my mindpower.:)
EdZee’s last blog post..Me2Everyone :: Online Income Opportunity
June 12th, 2009 on 12:54 pm
@EdZee, let me know if it works out. Sorry, I have not been able to put up a better tutorial.
July 31st, 2009 on 4:56 pm
I finally have widgets in the footer of the Mimbo theme that I use for my business blog. It now has the Top Commenters, Recent Comments widgets plus the the Link Chicklets in its footer. I am happy that the tweaks I want for my are now complete.
Thanks for the information we used in modifying the Mimbo 3.0 Theme.
EdZee´s last blog ..Disbursing From An ICA Fund
July 31st, 2009 on 5:07 pm
Hey,
Congrats on getting it working.
August 30th, 2009 on 10:12 pm
Thanks so much for taking the time to share this. It’s just what I need to be able to edit my footer code to add some widgets in.
Clare Swindlehurst´s last blog ..Hollywood Rip Ride Rockit Finally Opens
September 3rd, 2009 on 2:50 am
You seem to have a good authority on the mimbo theme. Great it works with new widget support.
Chinmoy´s last blog ..Convert userscripts to Addons with Userscript Compiler