We as WordPress users heavily depend on themes to make our website beautiful and attractive. And our problem is that we never think beyond it. Why can’t we be more productive and show the advertisements in between the posts? You may say, oh, my theme do not support that feature. Isn’t? Then why not make that feature ourself. Why not make your own WordPress sidebars.
Today’s post will cover how you can create a widget and place it anywhere you want on your blog. Let’s break the barriers ourselves.
There are two steps: Create a sidebar and place it wherever desired.
The idea is to think of areas in your theme where you want to be able to easily use the functionality of widgets. Prime candidates are usually footer, single post (before and after), sometimes even header.
Next step is to register the sidebar. Let’s say we want to create a dynamic widget area before your posts.
You will add the following code to your theme’s functions.php
register_sidebar(array( 'name' => 'Single Top', 'id' => 'single-top', 'before_widget' => '<li>', 'after_widget' => "</li>", 'before_title' => "<h3>", 'after_title' => "</h3>" ));
Then open single.php and somewhere at the top of your post loop (before call to the_content() ) add the following code:
<?php if ( is_active_sidebar('single-top') ) { echo '<div id="single-top"><ul>' ; dynamic_sidebar('single-top'); echo '</ul></div>' ; } ?>
That’s all !
Now you have a dynamic area at the beginning of your post, where you can add as many widgets as you’d like. Mostly you would want to use it to display some kind of advertisement in an enticing way in a way that it blends properly with your theme’s color and feel.
You can register any amount of dynamic sidebars in this way.
Did you find this post useful. Do you vow to make use of this feature to enhance your productivity? Let me know in the comments.
Wow! I have absolutely no idea how to play around with code or even where to find it if I had! Something I would like to learn more about one day, but for now it baffles me. I can’t even change the colours on my website. 🙂
I too didn’t knew about codes until I had no money to outsource and I wanted my site to have a better look. So I searched and learned through most of the things that I am sharing on my blog today.
It has really helped me a lot and I am just now adding value to my posts by sharing what I have learned in the past.
I’m going to try this Keyur. I’m right now working on a killer website and I need to get an ad box to show right up to the top left of the content and don’t want to use a plugin or use code placement for it. I like your idea and it will save me a ton of time and aggravation in the long run. Plus, I can move that baby a pixel up/down or over if I want to without having to mess with CSS. I should be able to code it right in there through the widget…way, way cool!
Hey, next can you cover PSD to Bootstrap? I usually outsource it, but it would be cool to see how to works if you know. If it’s not too hard, I have a PSD ready that I might try to slice into this site …. hehe.
I am happy that it will help you Scott.
However, I won’t be able to help you on the side of PSD and Bootstrap as I have no knowledge of PSD. I am sorry.
I know a ton about Photoshop but have to learn still the PSD to Bootstrap conversion process. I will find it. Thanks
I digged a bit in to ‘PSD to Bootstrap’ but they are charging more than $300.If you are outsourcing and managing on fiverr, then you are lucky, Scott.
Generally, I do use code placement if I want to add an ad within the content, but your instructions give potential for placing exactly what and where you want an ad to appear.
While PSD to Bootstrap is a great thing for responsive and mobile themes and twitter, it does require knowledge of photoshop. It is your call if you want to delve into that topic.
Yes, it is exactly for the purpose of putting anything you want and exactly where you want.
I do not have knowledge of PSD or even Bootstrap so can’t help in it atleast for now.
Wow Keyur! You have a ton of gems in your site here. I am sure it has taken you years to master and now we just ride on the shoulders of the giant. I truly feel what a privilege to have met you 😉 I may not be ready to handle this coding yet but will definitely come in handy when need to. Thank you for being so generous in your sharing Keyur. Wishing you great success! To your Abundance!
Thanks for your kind words. It really took me years to learn and implement but when you know what is to be done whenever required, you are always on the upper edge.
Wow, this is interesting! Never even knew this existed! How did you find it?
It isn’t matter of finding buddy but a matter of sharing what I know and have experience about!
Hi Keyur, I totally agree with Sandy – you have so much fantastic informtion here and we are really fortunate that you are so genrous to share always. Kudos to you Keyur. I’m not ready yet for a lot of what you write about but I sure know where to come when I am ready and comfortable to move more into the techy side.
Alayna
I thank you for your kind words, Alayna.
Great post, Keyur! Definitely a useful skill that others are going to need down the road. I’ve run into so many themes that only offer one or two sidebars so this is an extremely useful and relevant tool to use.
Thanks Drew for passing by. Custom sidebars gives us more privileges and could help us to make our site better for our visitors.
That was truly imformative, Keyur. I knew that one could register a sidebar or footer, but I didn’t relise that it could be placed anywhere on your page.
This could be very useful. Thanks for sharing.
Karl (Charles): Internet Marketing Applied
Glad you found it useful Charles.