Wordpress PHP/CSS coding help needed...I'll even pay!

[Brk]

My blog is quite simple. In fact, it uses a theme called "Simplest 1.3",

I've been able to modify it to my liking through trial and error, but there are a couple of things I just can't figure out how to accomplish. I've Googled and tried snippets of code I've found. So far, disaster. I even e-mailed the theme's author, but he told me he's "...too busy to offer that kind of support."

Below is how the bottom currently looks, followed by how I want it to look. I would be willing to pay you for your time, but I'm sure it wouldn't be too difficult if you know what you're doing.

You can download the PHP/CSS here.

TIA


CURRENT:




DESIRED:

[TonyT]

site url?

[TonyT]

Change this in index.php:

<?php if ( is_active_sidebar( 'widgets' ) ) : ?>
          <div class="widgets"><?php dynamic_sidebar( 'widgets' ); ?></div>
        <?php endif; ?>
        <?php if ( is_singular() || is_404() ) : ?>
          <div class="left"><a href="<?php bloginfo( 'url' ); ?>">&laquo; Home page</a></div>
        <?php else : ?>
          <div class="left"><?php next_posts_link( '&laquo; Previous Post' ); ?>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<?php previous_posts_link( 'Next Post &raquo;' ); ?></div>

to this:

<?php if ( is_singular() || is_404() ) : ?>
          <div class="left"><a href="<?php bloginfo( 'url' ); ?>">&laquo; Home page</a></div>
        <?php else : ?>
          <div class="left"><?php next_posts_link( '&laquo; Previous Post' ); ?>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<?php previous_posts_link( 'Next Post &raquo;' ); ?></div>
        <?php if ( is_active_sidebar( 'widgets' ) ) : ?>
          <div class="widgets"><?php dynamic_sidebar( 'widgets' ); ?></div>
        <?php endif; ?>

and that chnage should drop the widgets (category, archive, search) beneath the next-previous row.

Change style.css from this:

.widgets {margin-bottom:2em; border-bottom:1px solid #ddd;}
.widget {margin-bottom:2em;}

to this:

.widgets {margin-bottom:2em; border-bottom:1px solid #ddd; display:inline;}
.widget {margin-bottom:2em; padding:0 20 0 20;}

and that should place all the widgets in a single line and space them 20 pixels on left & right.

[Brk]

Thanks Tony for the reply.

The first part, duh, I didn't even think to just swap the position of the elements.

As to the widgets, I actually already tried the "display:inline" code and it doesn't work. I've read a few Google results where people asserted you had to put the widgets in a list and somehow that made them display horizontally, but none of it worked for me, either.

[TonyT]

Put back the widgets and let me look at the site and view its source there.
Then I'll be able to provide a sure fix.

[Brk]

Done.

[TonyT]

Try this:

Change the line 8 in functions.php to this:

    'before_widget' => '<td style="padding-right:20px;"><div class="widget">',    'after_widget' => '</div></td><!-- widget -->',

Change the widget section in index.php to this:

<?php if ( is_active_sidebar( 'widgets' ) ) : ?>
<table style="border:0; width:auto;"><tr>
<div class="widgets"><?php dynamic_sidebar( 'widgets' ); ?></div>
</tr>
</table>
<?php endif; ?>

That should throw each widget into a table cell with 20 pixels between them, all in one row.

[Brk]

Works like a charm. I'm just trying to figure out how to make the border color the same as the background. Can't find the correct place to change it in the stylesheet at the moment, and the border-color property won't work on the index.php for some reason.

[TonyT]

The stylesheet has this:

th, td {padding:0.5em; border:1px solid #ddd;}
body {background-color:#003366;

which gives the table cells a light border ddd and the body the color 003366.
The table is set to have no border.
Change functions.php to this

 'before_widget' => '<td style="padding-right:20px; border:0;"><div class="widget">',    'after_widget' => '</div></td><!-- widget -->',

for no table cell border at all.

[Brk]

Perfect! Looks great now. Thanks for all the help, Tony. Where should I send the Paypal?

[TonyT]

The search button drops down under the search box.
Remove this from functions.php

padding-top:32px; padding-right:20px; padding-left:25px; padding-bottom:0px;

and replace it with this:

width:auto; text-align:center; padding:32 0 0 0;

or this:

width:auto; margin:32px auto 0px auto; /* this is nicer */

CSS property order is always: top right bottom left. When margin "auto" is set to left & right the element centers in the parent element.

If your theme has a file called searchform.php you can edit it and change the button value to "Go" or Find" (smaller than Search).

Where should I send the Paypal?

I don't use paypal. Email me a 6 pack of Bass Ale!