Zine Readme

About

Table of Contents

  1. How to use Zine
  2. Using Images In Posts
  3. The Header
  4. Changing the Width of the Page
  5. Changing the 'Featured' Category

Zine is a free theme I made for Wordpress 1.5+. Its idea is to change the frontpage of your blog into more of a magazine or newspaper style. Zine could be used to publish an online newsletter, or fanzine, or just to give your blog a more interesting slant!

I can't be bothered to look up all the legal stuff, but Zine is free to use, distribute, change or modify, sell, even claim it as your own if you want. Do what you like with it. It uses valid XHTML and CSS. It's also designed using fluid design, so it should look ok whatever resolution you're looking at it with.

This is version 0.3.

How to use Zine

All posts you make to a certain category (by default category ID 1 - to change this see 'Changing the Featured Category') will show up in the middle "featured" column of the front page. All other posts show up in the left and right "unfeatured" columns, with the newest in the top left, descending in time down that column, then with the fourth newest top of the right column, and again descending in time down that column.

For some reason to do with my terrible coding skills, the "Recently Featured" section will show an error until you have written three featured articles. If you are using Zine on a fresh install of Wordpress, I recommend you make three empty posts in the featured category before beginning your blog/magazine in earnest.

I also recommend you use the "more" tags liberally to keep the front page succinct - particularly when writing an unfeatured post, as the columns are fairly narrow.

If you wish to make a post to the "featured" section, it must be posted only to the "featured" category. If you place it in categories other than the "featured" category, it will show up in the unfeatured section as well.

Using Images In Posts

When inserting images into posts I recommend you insert 'class="alignleft"' or 'class="alignright"' into the image tag.this will mean text correctly wraps around images you insert. Zine will automatically resize images in your posts on the front page, so that they only take up 50% width of the column they are in - this ensures the structure of the front page doesn't break.

The Header

Out of the box, Zine looks ok, but pretty boring, with a very bland, k2-esque blue header with a white title. However, I fully expect most people to want an image header. It would be cool to change the header image each week, like a real magazine! Anyway, here's what you do to put in an image header:

Make your header image, and call it "header.jpg". By default it should be 140px high, but of course you can change this by accessing the "style.css" file. Try to make the right hand end the same colour as the header div's background colour. This way, the design can strech to a bigger screen. For example... Drop your image into the wp-content/themes/zine/images folder on your server.

That's it really. To remove the text title, find the selector for h1 on line 214 of style.css, and add "display: none;" to the values there.

Also, to make the entire header clickable, follow the advice Michael Heilemann gives with regard to his theme, Kubrick. Open up header.php and:

Change line [36], from div id="header" to div id="header" onclick="location.href='http://siteaddress/';" style="cursor: pointer;". This will make the entire header a link.

Changing the Width of the Page

Zine is by default a 'fluid' design, meaning it adjusts its size according to the size of the window that it's in. You can read more about why fluid design is important at Digital Web Magazine. The width of Zine's page and its liquidity are controlled in the style.css file, at the #bodywrapper selector, at line 80. The default value for the width is 90% of the browser window.

However, you may prefer a fixed-width design, like the majority of Wordpress themes. All you need to do to acheive this is set the width of #bodywrapper at a number of pixels (e.g. width: 749px;).

Changing the 'Featured' Category

You need to change all the references to the category ID 1 in index.php to that of your chosen category. You can find the ID number of your chosen category by going to the admin area of your Wordpress blog, and clicking on the "Manage" tab, then the "Categories" sub-tab. Here are the references you need to change in index.php:

  • Line 7, change "cat=-1" to "cat=-YOURID" (it is important you retain the minus sign)
  • Line 46, change "cat=-1" to "cat=-YOURID" (it is important you retain the minus sign)
  • Line 87 change "cat=1" to "cat=YOURID" (note there is no minus sign)
  • Line 123 change "category=1" to "cat=YOURID" (note there is no minus sign)

Any troubles not resolved here, please either make a comment on the Zine demo site, or email me at tom@boilerhouseblog.com