Step By Step Adding Footer Widgets To Any WordPress Theme

by Mike

Footer-Widgets5

Today’s tutorial is about Adding Footer Widgets To Any WordPress Theme Without Using Any WordPress plugins.you have download your favorite WordPress Theme from Web and after activating your favorite theme. You’ll find that your theme don’t have Footer Widget included.

Now what next, Change that theme or download other theme which having footer Widget. I also faced the same problem before I start using Theme. After hours of search I am able found 1-2 WordPress themes, but some themes don’t have 2nd sidebars or Footer Widgets. It’s just a four step process of Adding Footer Widgets in any WordPress Theme. Let’s Start :)

Adding Footer Widgets To Any WordPress Theme

NOTE:-Do Take Backup of Your Current Theme Files Before Editing.

1. Open your Theme Functions (functions.php)and Paste below code just before ?>.

register_sidebar(array(
'name' => 'Custom footer',
'before_widget' => '<div id="%1$s">',
'after_widget' => '</div>',
'before_title' => '<h2>',
'after_title' => '</h2>',
));

Click Update After update check your Widgets Area if you have pasted code at right place you’ll find a footer Widgets start showing here. But you need to register Footer Widgets in your theme.

2. To register Footer Widgets in your theme copy below PHP code and paste inside your Footer (footer.php) file before footer code start, as shown below.

Footer Widgets

<div id="customfooter">
<?php if ( !function_exists('dynamic_sidebar') || !dynamic_sidebar('Custom footer') ) ?>
</div>
</div>

3.Now copy below Css code inside your Style-sheet (style.css)

#recent-posts{margin-bottom:1em;}
#recent-posts ul{list-style:none outside none;padding-left:15px;line-height:14px;}
#recent-posts ul li{margin-bottom: 1px;height:46px;}
#recent-posts img{border: solid 1px #D52300;float:left;}
#recent-post-content{float:right; width: 280px;font-size:12px;}

4. Now open Widgets page and Drag widgets from here to your newly created Footer widgets to activate them. Below is the screen shoot of Footer Widgets after using above method: -

Footer Widgets

By using above method you can easily add Footer Widgets to any WordPress Theme without using any WordPress Plugin.Do inform me if you face any problem in Adding Footer Widgets.

.

Related Posts:

Share This Article

{ 16 comments }

David

Thanks for the tutorial. It’s good when something just works!

daud

Its not working, same problem :/ There is only one column not three.

JaggedGenius

I find the fact that you deleted my comments pathetic.

You are attempting to provide a service in this article, and when people have questions, rather than helping them, you provide simple answers with no real assistance.

Then, when someone (me) comes along and attempts to help your readers, you delete the comments. Why would you do that?

Anuj Sharma

i have not deleted any of your comments.only thing why your comment’s in showing up is that,i am not able to access my blog due to illness.

JaggedGenius

Digimoguli….

Not to hijack your tutorial, Anuj, but…

try the tutorial at

there is a step by step to adding the three widgetized areas like I mentioned before.

perhaps it will help you.

JaggedGenius

Actually, CSS styling can transform them to being horizontal, but what I’ve found works the best is to add three separate “custom footers” that can each have multiple widgets placed in them.

So each area will be a column of widgets unto itself.

JaggedGenius

Does this need to be done for each individual widget? For example, If I want to have, like your image, tags, recent posts, and recent comments, do I need to include the widget in the footer three times?

If so, that could be the problem Blatant Surfer is having

Anuj Sharma

no

Digimoguli

I Tried that. There is some problem in css. There’s just on big wide column, not 3.

Anuj Sharma

you need to put 3 items on one single widgets

Blatant Surfer

Thanks Buddy !!!
It worked like a charm for me..but I donno why, its not getting there as a 3 column and all…it is showing like one below one …

Anuj Sharma

i think you are making some mistake while using footer CSS

prem Kumar

Thank you for This Info,Im Searching For This Tutorial And I Finally Got it,Sooner Im Gonna Add Footer In Ma Blog,Once Again Thnx Buddy

Anuj Sharma

your welcome mate.

Omar Tariq Jutt

A very descriptive tutorial with image. Good for those who don’t have a footer in their theme. Shouldn’t be there any plugin for this?

Anuj Sharma

thanks Omar for your comment,well i don’t think there any plugin available for this?

Previous post:

Next post: