How To List Links Horizontally in SEO Booster PRO

A user of SEO Booster PRO recently asked me how to list the links horizontally for implementing the list in the footer of his blog.

The solution is quite simple actually, it requires a bit of editing of your footer in your theme, and adding a bit of CSS code to your theme .css as well.

First of all, locate where the footer is displayed in your WordPress theme. Usually in the file named “footer.php”.

Add the following code:

<?php
if(function_exists('seoboosterpro_show_referrers')){ seoboosterpro_show_referrers('20',TRUE); }
?>

The top 20 incoming searches will not be displayed in the footer. Change the number to whatever you feel is best for your site.

The output is included in a div named “seoboosterpro”. To style this div and the list inside, you need to add the following to your .css file. Usually named “style.css”:

#seoboosterpro {
text-align: center;
}

#seoboosterpro li {
display: inline;
list-style-type: none;
padding-right: 5px;
}

Above css first addresses the #seoboosterpro div, and aligns all content to be centered. The second CSS decleration addresses the actual items in the unordered list, and makes sure they are not displayed as they normally would. To make them a bit more visually appealing, I added a 5 pixel margin to the right of each item, feel free to change as you wish.

The CSS styling changes does not override any other styling on your site, only what is displayed inside the “seoboosterpro” div which is outputted by the php-function.

Have any questions on how to implement this? Feel free to leave a comment, and I will also post a how to soon on how to implement this in a Thesis-powered website. Thesis Demo Site — See the Thesis Theme in action!

If you enjoyed this post, please consider leaving a comment or subscribing to the RSS feed to have future articles delivered to your feed reader.