Da Blogmother

WordPress: Open on Static Page

To open on a static page

Click "Settings" at the upper right corner of the Dashboard

Click "Reading"

At "Front page displays" check "A static page" and choose a page from the drop down list.

If you have not already done so, click "Write", "Write Page" and create a new page titled "Blog".  Just type in the title.  Do not write anything in the page text box.  Save and publish it.

Now go back to "Settings", "Reading", "Front page displays" at the drop down menu for "Posts page" select the new page titled "Blog" that you just created.

Bingo.  Now all your posts display on the "Blog" page, and a static page of your choice, opens as the main front page.

Multi Author WordPress Blog: Inserting Author Images

Several months ago, Greg described this process in Project Bloodhound speaking in tongues: To whom am I speaking?

At the time, I had no need to implement author images in a WordPress multi-author blog, (and I already knew the technique for TypePad), so I didn't work with the process until just today.

As I set up what will become a company blog for our incoming agents, I realized that the average WordPress user might need a little more background information to put Greg's code to use.

First of all, you need to find all your authors' ID numbers.  Unfortunately current versions of WordPress do not show author ID numbers.  The easy solution for me was to download the Reveal IDs for WP Admin plugin.

Activate the Reveal IDs plugin.

To go to the Users page, click Users in the upper right column.

You'll see each author's ID number displayed beside their username.  All ID numbers, that is, except your own.  The only way to see your own ID number is to create a new separate admin username and login, then login as that new identity, and find your old self on the list.

Next step:  Obtain images of each author.  Resize each image (I decided on 52 pixels in height, and 50 pixels in width as appropriate for the design I am using.)  Each image must be named simply by the author ID number.  For instance, my lovely image here on Bloodhound Blog is titled 34.jpg.

Upload all the newly resized and newly renamed images to your blog's root directory.

Now you are ready to rock and roll.

Click Design -> Theme Editor

From the list of Theme Files in the right column, click on Main Index Template file (index.php) to open it.

I simplified Greg's code for now to only display the author's image and name

<img src="http://www.bobtaylorproperties.com/blog/<?php the_author_ID(); ?>.jpg" height="52" width="50" align="left" hspace="10">
Posted by <?php the_author() ?> <br>

And I placed it under the PHP code that inserts the post title.  Here's the complete snippet:

<?php if (have_posts()) : while (have_posts()) : the_post(); ?>
<div class="entry">

<h1><a href="<?php the_permalink() ?>" rel="bookmark" title="<?php the_title(); ?>"><?php the_title(); ?></a></h1>

<img src="http://www.bobtaylorproperties.com/blog/<?php the_author_ID(); ?>.jpg" height="52" width="50" align="left" hspace="10">
Posted by <?php the_author() ?> <br>

<span class="meta"><?php the_time('F jS, Y') ?> <br>
Posted in <?php the_category(', ') ?> <?php edit_post_link('| Edit', '', ''); ?></span>

<br class="clear" /><br />

I'll add the email link code when l actually have live people posting. :-)

UPDATE: Reading the comment stream on Bloodhound Blog suggests that a footnote might be indicated:  If you copy and paste the above code, you might want to first paste it into a plain text editor (Windows Notepad, for example), save it, select and copy it again from the text editor, then paste it into your index.php file.

Why?  Because your browser might copy in rich-text format, changing straight quote marks to curly quote marks  ...  And code won't run with curlies.

Originally posted on Bloodhound Blog

Making Room Outside the Box: Add Padding with Image Transparency

Have you ever worked on a custom banner for a WordPress blog, and no matter how you tweak the padding and margin settings in the stylesheet, it just won't position properly?  Or it positions properly in Internet Explorer, but not in Firefox, or vice-versa.

Here's helpful trick:  Add the padding with a transparent image.  And Better yet:  Just make that transparency part of the banner image.

Here's how, in Photoshop:

Open your original banner image.  To view the image size, click Image -> Image Size, and make note of the Width and Height Pixel Dimensions.  After you note the dimensions, click cancel.

s

Next, create a new, blank image with a transparent background:  File -> New   Making sure to check the selection box for Transparent.  Change the Width and Height dimensions to numbers slightly larger than those of your original banner image.

Click back in the original image, to make it the active window.  Click Select -> All

Click the Move Tool

Drag the original image into the new blank file.  Position it so the amount of padding you want shows around all the sides of the image.

Save for Web in .PNG format to preserve the transparency.  Upload to the blog.

Presto!  Instant padding!  Works in all browsers.  :-)