• Threaded Comments ¹
• Comment Paging ¹
• Post classes
• Sticky posts

Version 1.3.1 ² has all these implemented. Other stuff you’ll see in this version are an additional 620px content width layout option to choose from and a modified search widget.

Notes:

1. Comment features need to be activated in the Settings > Discussion panel for them to be functional.
2. 1.3.1 is backward compatible up to WordPress 2.5. It has all the right stuff to be working on WP 2.3 as well, but hasn’t thoroughly been tested on.

Looking around for ways to make the theme more user friendly, I noticed some of you
- were unable to accommodate ads properly in the sidebars
- wanted to embed external objects like videos and photo galleries
- or just wanted to show some ‘About’ or ‘Intro’ text at the top spanning across two columns.

Also some of you wanted a wider content column,
- maybe to display bigger images
- or just to show more content above the fold.

The biggest change I’d like to tell you about in version 1.3 is the introduction of Theme Options page. Without overdoing the whole options thing, I’ve created the options which I thought were very essential.

Among all the options I consider the “Layout Options” to be the most important. By using a combination of the two “Layout Options” i.e ‘content width‘ and ‘no. of sidebars‘ in the “PrimePress Options” page you’ll be able to choose a set-up that should meet your needs.

Other options eliminate the need to hack up the theme template files and let you

• enter your custom FeedBurner feed URL
• type in your FeedBurner ID to activate email subscription link
• give you some control over the main navigation tabs

First, I’ll give you the code and explain how it works. That way, you’ll understand it better and can easily adapt it to your site.

The Code

<?php if (is_page('28')) { ?>
	<img src="<?php bloginfo('template_url'); ?>/headers/image1.jpg" width="920" alt="<?php bloginfo('name'); ?> header image" />
<?php } elseif (is_page('26')) { ?>
	<img src="<?php bloginfo('template_url'); ?>/headers/image2.jpg" width="920" alt="<?php bloginfo('name'); ?> header image" />
<?php } elseif (is_page('30')) { ?>
	<img src="<?php bloginfo('template_url'); ?>/headers/image3.jpg" width="920" alt="<?php bloginfo('name'); ?> header image" />
<?php } else { ?>
	<img src="<?php bloginfo('template_url'); ?>/rotating.php?image=<?php echo mt_rand(0,100); ?>" width="920" alt="<?php bloginfo('name'); ?> Rotating Header Image" title="<?php bloginfo('name'); ?> Random Header Image" />
<?php } ?>

I have 3 Pages here. With the above code, I’m telling the theme to display a given image on each of those 3 Pages and to display random images everywhere else.

• 1st two lines tell the theme to display image1.jpg on a Page with ID 28.
• next two lines tell it to display image2.jpg on a Page with ID 26 and so on.
• Last two lines (marked in blue) tell it to display random images everywhere else.

How to

1. Upload your header images into the headers folder in your PrimePress directory.
2. Open your header-images.php in your WordPress theme editor, delete the already existing code and paste the above code block in there.
3. Change the Page ID and the image file name according to your site. (parts marked in red)

Some Notes

Chances are, you want to do this on more than three pages. Just copy (duplicate) the lines marked in green, paste them right below (but above lines marked in blue) and change the ID and filename.

If you have permalinks turned on, you can also type in the post-slug in place of the Page IDs.

Earlier on, I assumed support through comments would be sufficient for PrimePress. I was wrong. Support process is getting way too dis-organized and it’s getting increasingly hard to find the right info under the relevent post.

Heck!… I myself am finding it hard to locate some of my answers, let alone the users.

So to simplify the support process, I’ve set up the support forums… to make it much more efficient and easier for both you & me. I request you to ask your PrimePress support questions in the forums.

Thank You

Make sure you update your PrimePress theme to the latest version before you proceed.

You need to have two pages ready to implement this.

• Homepage – A Page with welcome text or anything you wish to show first to your visitors. creating this is pretty straightforward.
• Posts page – A page to show all your blog posts. You need this because you’ll lose the default blog functionality once you activate the static homepage.

1. Create the blog posts Page

Go to write Page panel in your WordPress Dashboard and create a new blank Page with the title ‘Blog‘. Scroll down to the Page Template options at the bottom and from the drop down list select ‘Blog‘ and publish the Page.

2. Assign the home and blog pages

Go to Settings > Reading > Front Page displays and select ‘A static page‘. There are 2 more options to be selected under this. choose a page of your choice for the front page. But for the Posts page select ‘blog‘ and save.

3. Modify the navigation menu

Open main-menu.php in your WordPress Theme Editor. Delete or comment out the marked code in the following code block (everything but the last line).

<li class="<?php if ( is_home() or is_archive() or is_single() or is_paged() or is_search() or (function_exists('is_tag') and is_tag()) )
{ ?>current_page_item<?php } else { ?>page_item<?php } ?>"><a title="<?php bloginfo('name'); ?>" href="<?php bloginfo('url'); ?>">Home</a></li>
<?php wp_list_pages("depth=1&title_li=&sort_column={echo $pp_sort_pages}&exclude={echo $pp_exclude_pages}"); ?>

Addendum

Homepage – Any default Page you create will have the title centered at the top. You may not want this on your static homepage. Use the ‘HomePage‘ template for that Page to get rid of this.

Page-Order – A word about the Page Order in the main navigation menu. If you prefer doing things manually, assign a number to each of the Pages in the Advanced Options and they’ll be sorted in ascending order. A better and easier alternative is to use a plugin.

Here are two ways you can personalize your site by adding some simple bits of code to your custom stylesheet. Just paste these code snippets into the custom.css and change the colors to your liking.

Adding a Simple Border

The following code makes the site content more distictive while preserving all the white space.

body.custom #container {
	border: 1px solid #cccccc;}

body.custom ul.menu {
	right: 10px;}

body.custom #rotating {
	border-top: none;}

• First rule adds a simple border around the entire content area
• The 2^nd & 3^rd style rules are minor tweaks for better integration of things. 2^nd moves the top level menu a bit to the right and the 3^rd removes the top border above the rotating header images.

Changing the Background Color

The following CSS code makes for a crisp overall design.

body.custom {
	background: #444444;}

body.custom  .homelink a {
	color: #ffffff;}

body.custom .homelink a:hover {
	color: #ffffff;}

body.custom .description {
	color: #cccccc;}

body.custom ul.menu {
	right: 10px;}

body.custom #rotating {
	border-top: none;}

• The first style rule changes the background color to a deep grey.
• Since we chose a dark background, we need to pick a lighter contrasting color for the site title and tagline, for them to be clearly visible. In this case 2^nd & 3^rd rules change the color of the title and the 4^th changes the color of the tagline.
• The last two style rules are minor tweaks to balance the overall design. 5^th moves the top level menu a bit to the right and the 6^th removes the top border above the rotating header images.

A few well chosen images – can add tons of visual appeal to your site, can convey more information, can make a good site a great one. so gather up all the pictures you like, putting them up in PrimePress is easy.

note: If you are already using PrimePress, please update your theme to version 1.2. It has a better image rotation solution. These instructions apply to v1.2 and on.

How-to?

I’m assuming you have your images cropped and ready. If not, crop them to a wide aspect ratio. The ideal and default width here is 920px and any bigger or smaller images will be scaled to this width. The height is calculated to a value that doesn’t mess up the aspect ratio.

1. upload them to the /headers folder inside the primepress directory
2. hehe… that’s it. Its done, you don’t have to rename them or edit any of the theme files.

Every image in this folder will automatically be read and randomly rotated. For the record, you can upload any number of images – just let me know if you wanna put up more than a 100.

Don’t want them rotating?

May be you’ve got a single header image ready and would like to show only that one. That’s easy, just upload that one image to the /headers folder inside the theme directory and delete any other files in that folder.

A solution then… is to use a separate stylesheet for all those custom mods & tweaks we make to personalize the theme.

And that’s exactly what custom.css is for. A dedicated stylesheet for all your CSS customizations. By placing all the custom styles in one place, your stylesheet will be much more organized and you’ll know where everything is when you choose to change something later on.

And more importantly, it makes updating the theme a no-hassle. all you have to do is to preserve the custom.css file to keep your changes intact.

custom.css How-to ?

There are many ways to do this, but the easiest is using the Theme Editor in WordPress. Just follow the simple steps below.

1. log in to your WordPress admin panel and go to Theme Editor
2. make sure PrimePress is selected under Select theme to edit:
3. custom.css should already be open at this point, if not click on custom.css on the right side under Theme Files to open it.
4. type in your custom CSS styles here prefixing body.custom to each CSS rule.
5. If you just dabble around in CSS occasionally and are not comfortable writing the styles,
   • copy the relevent styles from the main stylesheet (style.css)
   • paste them in your custom.css
   • attach body.custom to each style and tweak away

No clue what CSS is? no problem, coming soon… are some easy instructions detailing all the customizations that can be done.

A little more clarity

For example, if you want to change the size of the site title and color of the site tagline, the CSS styles associated with these in the main stylesheet (style.css) are

.homelink {
	font-size: 35px;
	}

.description {
	color: #666666;
	}

The 1^st one governs the size of the title and 2^nd one the tagline color. Copy & paste them into your custom.css

Lets say you want to increase the title to 40px and change the tagline color to a cool blue, here’s how the modified code would look like.

body.custom .homelink a {
	font-size: 40px;
	}

body.custom .description {
	color: #3399ff;
	}

As per the CSS cascading rules, a more specific & targeted style declaration wins over a lesser specific one. By adding body.custom, we are being more specific at what we want and so it overrides the default style.

A WordPress theme with thorough coding and Design that is close to “having ‘em all” while still leaving room for cutomizability was the main goal here.

Behind the Scenes

All the WordPress bloggers out there, by using a well coded theme and writing well structured blog posts that are accessible and standards compliant, you make the web a better place. And for that you are rewarded with search engines indexing your posts more accurately and that results in a better visibility in web searches.

PrimePress has been developed taking all these things into consideration and features a strong code architecture that is valid, simple and efficient with maximum internal SEO. It is high on accessibility and features a rich semantic markup achieved by implementing microformats.

What you See

A killer architecture isn’t worth much without a good design. You wouldn’t even be here if you weren’t looking for a good one. Well… In this case, painful attention to details & obsessive tweaking have resulted in a final overall design that is pleasing & well-balanced while still being content centric. Every care has been taken not to leave any element un-styled.

We all heard the mantra “Content is King”. As trite as it may sound, it still holds true. And one aspect that can solely make the content come across loud and clear is… good Typography. More often than not typography takes a backseat in many design projects and doesn’t get the attention it deserves. With each element styled with uttermost care, typography in PrimePress has been setup to follow a certain rhythm so as to enhance the screen readability to its best.