About Sideways

I’m fascinated by the whole horizontal-scrolling idea, especially for portfolios, but don’t feel it meets my own desires for this site. Nonetheless, I just had to dig in and create a working horizontally-scrolling WordPress theme. So I present to you Sideways Portfolio. Here are some brief points…

• Horizontal scrolling through all archives and blogs.
• Non-scrolling on single posts and pages.
• Dark, grungy background.
• Clean, simple. Not minimal in a design sense, but free of unnecessary features.
• No extra plugins are required.
• GPL-licensed – use as you wish, personally or commercially, modify to your heart’s content.

Release Notes

0.9.0 – The first release. Please let me know about any bugs you find in the comments on this post so that I can do any necessary repair work for the next release. All releases are free to all purchasers.

Frequently Asked Questions

These will surely be asked…

How do I replace the title text with my logo?

The easy way is to open up the canvas file, add your logo to the background, then export that area as a logo file. You may need to adjust the padding of the #header #title area in the style.css file to line it up nicely.

How do I get pictures to fit the post areas well?

For the purpose of the demo, I’ve gone into the Settings > Media panel and have set thumbnails to 180×180, medium to 240×240, and large to 360×360, which matches the width of the post area.

What about comments?

I have purposely not included any comments functionality in this theme. After a lot of experimenting, I finally decided it best to leave them off.

What about widgets?

Where would I fit them? This theme is designed to be very simple and is really targeting portfolio and photoblog users, not blogs intended for discussion and community necessarily.

Demo & Purchase

Live Demo

Free Download

UPDATE: Thanks to all who have commented, but I’ve now made the theme FREE for everyone. Thanks!

I really like giving things away. It feels good and it gets the word out about this site. So this week, I’m giving away three copies of my newest WordPress theme, Old News. It’s a great theme for blogging, has an old newspaper feel, is built for threaded comments, ad space, etc. The cost of the theme is normally $15, but I’m going to give away three copies.

How can you be one of the recipients? It’s simple. Just retweet this post. I’ll know about it because I pull in tweets via Backtype, so your tweet will become a comment below. At the end of the week, I’ll choose 3 from a hat and arrange getting the files to you. Linking to the theme’s sales page won’t increase your chances, but it would be a nice gesture. And hey, I’m offering 50% to affilates! Just check the page.

Over at my other design blog, Creative Cox, I’ve published a list of WordPress resources. Pass along or add to the stack yourself. Enjoy!

Breadcrumbs are a great way to give people a perspective of where they are on your site. You can easily add them via several good plugins (my favorite is Yoast Breadcrumbs), but sometimes you want to build breadcrumbs into a theme without using a plugin, especially if you’re releasing it to the public. This was what I needed to do with my latest latest WordPress theme. So here’s what I did…

1. I created a php file called breadcrumbs.php and inserted the following code…

Home';
    while (list($j,$text) = each($urlArray)) {
        $dir='';
        if ($j > 1) {
            $i=1;
            while ($i < $j) {
                $dir .= '/' . $urlArray[$i];
                $text = $urlArray[$i];
                $i++;
            }
            if($j < count($urlArray)-1) echo ' » ' . str_replace("-", " ", $text) . '';
        }
    }
    echo wp_title();
}
breadcrumbs();
?>

Notice that I’ve included an opening and closing div with the pseudoclass of “breadcrumbs” so that I can add some style to the stylesheet.

2. Wherever I want to include the breadcrumbs in my theme files, I add this line…

That’s it! You can do the same by creating a function in your functions file and then calling the function in your theme, but I think this may be the most simple way to reach the objective.

Want to customize it a bit? Notice that I’ve “echoed” the phrase “You Are Here:” but you can change that text to whatever you’d like to lead the breadcrumb trail. And you can also change the “»” near the bottom to a “|” or “/” or whatever you like. Then you can style your breadcrumbs in the stylesheet.

There are probably better ways, but this is my way. Enjoy.

about old news
release notes
faq’s
screenshot, demo, purchase & download links
affliates – earn 50%!
comments & support

About Old News

I couldn’t sleep one night – kept having a creative idea about a wordpress theme that resembled an old newspaper, but was still built around the actual content (the news itself) and not the graphic design. That vision changed a bit as I coded it, but the essence of the theme is that of a newspaper look and feel. Ultimately, it’s a personal blog theme, probably not the best for a business, but great for blogging.

The theme was developed in a WordPress 2.8 testing environment and is fully 2.8 compatible, right down to the threaded comments. Here are some things that I think make it stand out…

• Focus on usability – very easy to navigate, fonts are large, padding is somewhat generous.
• Built on a grid, so it’s easy to customize to different sizes.
• Plenty of comments throughout the files to help you customize it.
• Planned for some ad spaces.
• Breadcrumbs are built in – no plugin needed.
• Includes every possible theme file except a home.php. I plan on developing a few optional home.php files and offering them separately.
• Works just as well in plain white with no background (see screenshots) for an example.
• jQuery tabs are built-in for the top widget to condense some sidebar space.
• Used soft gray lines to guide the eyes through the content flow.
• Four widgetized areas in the sidebar, the fourth at the bottom which appears only on the front page.
• GPL-compatible license. Credit to me is appreciated, but not required.

Release Notes

Release – 0.9.1, July 1, 2009 – added a horizontal listing/menu of child pages of the current page under the breadcrumbs in page.php.

Current Release – 0.9.0 beta, July 1, 2009

Why beta? I’d like to give it a week or two of use by others to see what bugs I might have missed. Then, when it’s ready to submit to the themes directory, I’ll upgrade it to 1.0. So please offer feedback in the comments below or via my contact form so I can make fixes.

I’d also like to thank a few friends on Twitter who tested the theme before its release… @jamesgarland, @joshhemsley, @ianroke, @cottonr, @jasonlinas, @Whodeeni, @stubbyd, @passionsista, and @wayne_etc.

Frequently Asked Questions

I’m assuming these will be frequently asked…

How do I replace the header’s title text with my logo?

Graphically, I would put in a transparent png, take a screenshot, clip your logo against my background and re-insert it as a jpeg. But that’s just me.

As far as the code goes, take out the following from header.php:

and insert this:

 alt="" id="logo" class="site-title" />

Your image file can be .jpg, .gif, or whatever, but store it in the /images directory of the theme’s files. Either name it logo.jpg or change the link in the above code accordingly. This will show your logo and will have an alt= text of your site’s name.

How do I insert adsense, amazon, or other script based code into the ad space?

This will require some working knowledge of css and html. In the sidebar, you’re basically going to need to create a div with margins and put the script inside that div to space it away from other elements. For example, if you want to insert a 250 pixel wide ad code into the 300 pixel wide sidebar, I would do this…

You say the theme supports threaded comments, but they don’t appear.

You must turn on threaded discussions in your admin panel under Settings > Discussion. I set my levels to 3, but you can do whatever you’d like.

I’ll add more to the faq’s as I hear questions frequently asked.

Screenshots, Demo, & Download

Working Demo

Free Download

Ministry Free is a little bit similar to the premium theme, Ministry Theme. I designed this site to be the front end web site where I will feature the Ministry Theme. I wanted it to be clean and free of clutter. Here are some features…

• Valid CSS & XHTML
• Widget-ready sidebars
• Support for tags, gravatars, comments, etc.
• Nice search feature and clean menu style
• FREE!

View the Demo

Download the Theme

If you’d like customizations made, a logo designed, or if you download this and use it, feel free to contact me.

Note: to replace the header’s text with a logo, take out the following from header.php:

<p class=”site-title”><a href=”<?php bloginfo(‘url’); ?>”><?php bloginfo(‘name’); ?></a></p>
<p class=”description”><?php bloginfo(‘description’); ?></p>

and add this:

<a href=”<?php bloginfo(‘url’); ?>”><img src=”<?php bloginfo(‘template_directory’); ?>/images/yourlogo.jpg” alt=”<?php bloginfo(‘name’); ?>: ,<?php bloginfo(‘description’); ?>”></a>

Your image file can be .jpg, .gif, or whatever, but store it in /wp-content/themes/ministry-free/images/.

This will show your logo and will have an alt= text of your site’s name and tagline. Right now, the logo’s area is 300 pixels wide by 108 pixels high. You would need to tweak the stylesheet.css file to change this.

Update: The Ministry Theme was initially intended to be a theme for purchase, but because of the swirling debate surrounding commercially licensed WordPress themes, I’m attempting to remain above reproach. You may donate below, but the theme and all code is now licensed as GPL.

The Ministry Theme has been a LONG time in the making. It’s a premium WordPress theme designed with churches and ministries in mind. The support site, www.ministrytheme.com, will be launched very soon, but you can go ahead and pick up a copy now! The theme features…

• A clean, but easily skinnable, light design.
• Custom home, archives, and links pages.
• Tabbed sidebars (that degrade in IE6).
• A DHTML menu that follows your page structure.
• Front page post thumbnails.
• A widgetized sidebar.
• WordPress 2.6 ready with image and caption styling.
• Gravatar/avatar support in the comments section.

I’ll soon be opening up a forum for support, but for now you can contact me with questions or support requests. Please note that I’m available for support and will offer tutorials publicly soon, but customizations will be handled on a quote-per-hour basis.

Check out the DEMO!

Visit www.ministrytheme.com to Download the Theme. (Downloading of the Ministry Theme has been temporarily disabled while I enhance and improve it for its next release, due in late February 2009.

Bible Scholar is basically the theme I use for my blog (currently) at www.brandonacox.com, enhanced so that it can be applied to any WordPress blog. It can be 2 or 3 columns, depending on how the owner wants to style the site. It has room for ads, a nice search function, and the built-in ability to use the blogroll without using it site-wide. The preview page includes instructions. Note that I’ve updated it as of April 24 to include threaded comments and to reflect some changes suggested by WordPress. The theme provides gravatar/avatar support.

View the Demo

Download the Theme

If you’d like customizations made, a logo designed, or if you download this and use it, feel free to contact me.

One common question related to WordPress relates to how one can have a “static” (in the sense that content doesn’t change) home page with just a simple link to the blog pages. That’s how this site is set up, though it’s subject to change. Just selecting a page as your home page under reading sections is fine for a simple blog site, but what if you want to have different sidebars or style changes between the two areas of your site? Here’s how I accomplished it for eGrace Creative.

Arrange your design, html, and your loop the way you want it to work for your pages and save the file as page.php. Then do the same for your blog and save it as index.php. I created a secondary loop (not the real term, but you get the idea) and added it to a duplication of page.php and named it home-page.php. At the top of that page, I inserted this within a php tag…


/*
Template Name: Home
*/


In WordPress, I created my front page and assigned the page template called “home” from the dropdown box. This tells WordPress to use the correct template file for the front page of my site.

Back to the drawing board, I duplicate my index.php, which has my blog loop, and name it blog.php. I do this at the top (within a php tag):


/*
Template Name: Blog
*/


In WordPress, I create another page with the slug “/blog/” and leave the content blank. In the page template dropdown box, I select “Blog” as the template for this page. On the front page of my site, I link to this as http://www.yourdomain.com/blog/. This page calls up my blog posts in date order. I’ve arranged the code so that my categories display at the top, but your options are limitless for creating an easily-navigated page.

Note this – if you don’t see a dropdown box with various page templates available, it’s either because the theme you are using does not include any, or you’ve mistyped something before uploading.

I hope this helps!

I’ve completed work on a custom WordPress theme I’m calling Balance of Blue. I designed it with business applications in mind. I’m an advocate for using WordPress as an entire site solution and content management system, so this theme was created to highlight the potential for that kind of usage.

Please note: I’ve updated this theme and have based it on better code, so it now supports gravatars, tags, and other important features.

View the Demo

Download the Theme

If you’d like customizations made, a logo designed, or if you download this and use it, feel free to contact me.