reporter wordpress theme

Widget Fix for Reporter Theme from Fab Themes

posted in: Blog | 2

reporter wordpress theme

The “Reporter” is an excellent beautiful free WordPress theme from Fab Themes designed in a magazine or a newspapaer kind of feel. It’s a wow score from me. But… it has still some problems with the widget positions, none are working except for the footer. But I have fixed it and here’s how…

I’m a beginner in coding with basic knowledge of PHP, HTML, CSS. So if you’re too then this article is for you.

Files that will be modified are:

  1. sidebar.php
  2. header.php
  3. stylesheet.css

As you may see in widget page this theme comes in five different positions:

  1. Homepage-right
  2. Homepage-middle
  3. Homepage-left
  4. Sidebar
  5. Footer

Their existence is due the following code in functions.php file.

/* Home page widgets */

register_sidebar(array(
‘name’ => ‘Homepage-left‘,
‘before_widget’ => ‘<li class=”home-widget “>’,
‘after_widget’ => ‘</li>’,
‘before_title’ => ‘<h3 class=”home-widget-title”>’,
‘after_title’ => ‘</h3>’,
));

register_sidebar(array(
‘name’ => ‘Homepage-middle ‘,
‘before_widget’ => ‘<li class=”home-widget “>’,
‘after_widget’ => ‘</li>’,
‘before_title’ => ‘<h3 class=”home-widget-title”>’,
‘after_title’ => ‘</h3>’,
));

register_sidebar(array(
‘name’ => ‘Homepage-right ‘,
‘before_widget’ => ‘<li class=”home-widget “> ‘,
‘after_widget’ => ‘</li>’,
‘before_title’ => ‘<h3 class=”home-widget-title”>’,
‘after_title’ => ‘</h3>’,
));
/* SIDEBARS */
if ( function_exists(‘register_sidebar’) )

register_sidebar(array(
‘name’ => ‘Sidebar‘,
‘before_widget’ => ‘<li class=”sidebox %2$s”>’,
‘after_widget’ => ‘</li>’,
‘before_title’ => ‘<h3 class=”sidetitl”>’,
‘after_title’ => ‘</h3>’,

));

register_sidebar(array(
‘name’ => ‘Footer‘,
‘before_widget’ => ‘<li class=”botwid”>’,
‘after_widget’ => ‘</li>’,
‘before_title’ => ‘<h3 class=”bothead”>’,
‘after_title’ => ‘</h3>’,
));

What’s wrong?

If you put widgets in wherever positions (1-4) none shows up at front. The code to call the widgets is there alright in sidebar.php, as you can se below I bold it. But it’s not working.

<!– Sidebar widgets –>

<div class=”sidebar”>
<ul>
<?php if ( function_exists(‘dynamic_sidebar’) && dynamic_sidebar(‘Sidebar’) ) : else : ?>
<?php endif; ?>
</ul>
</div>

How to fix it?

Well I took the code used in another  fab themes’ theme, “Kent.”

<?php if ( ! dynamic_sidebar( ‘sidebar’ ) ) : ?>
<?php endif; // end sidebar widget area ?>

and replace the not working one with this one. Then afterwards all widgets you put in sidebar position will shows up at front.

The next question is what about the other positions?

Strangely, it seems they are not put to use by the designer. So I decide to use two of them, the “Homepage-right” and “Homepage-middle.” I leave the “Homepage-left” alone. because I don’t think this theme was designed to have something on the left side.

Next, I want the “Homepage-right” to show at front, above the featured video, popular, recent, and random, which already have been there by default. Therefore first I create this simple code snippet:

<div class=”sidebox”>
<?php if ( ! dynamic_sidebar( ‘Homepage-right’ ) ) : ?>
<?php endif; // end sidebar widget area ?>
</div>

I inject it in sidebar.php at the top of the codes, below the <div class=”right”>

<div class=”right”>
<div class=”sidebox”>
<?php if ( ! dynamic_sidebar( ‘Homepage-right’ ) ) : ?>
<?php endif; // end sidebar widget area ?>
</div>

For the “Homepage-middle” I put it in the header.php at the bottom, above the <div id=”casing”>. As result, widgets will be shown under the ticker.

<div class=”sidebox”>
<ul>
<?php if ( ! dynamic_sidebar( ‘Homepage-middle’ ) ) : ?>
<?php endif; // end sidebar widget area ?>
</ul>
</div>

<div id=”casing”>

Now,  the font styling for title of widgets need to be fixed so I add a class “home-widget-title” before “h3.sidetitl” in sidebar.css.

.home-widget-title, h3.sidetitl{
font-family:’BebasNeueRegular’;
color:#222;
font-size:22px;
padding:0px 0px 0px 0px;
margin-bottom:10px;
font-weight:normal;
}

Done! hopefully you will find this fix useful and share it if you please. :)

***Update***

This update is to fix the color of active tab of news (popular – recent – random).

find in the file sidebar.css

.tabsnav li a:hover, .tabsnav li a:active, .tabsnav li.ui-tabs-selected a {
text-decoration:none;
color:#222222;
}

Change the color into another color.

 

2 Responses

  1. Beo

    Great .. i ever use this theme before.. early at 2010 yep i got the same problems too then i change it… now where is the fixed theme to download? c’mon share it here…

    • ekajuan

      Hai Beo, I don’t have one. I expect people just install the theme and then make some fixes according to the fixes I’ve explained in the article above.

Leave a Reply