Gridline News
December 9th, 2007
Gridline News is a clean and modular news magazine theme for Wordpress 2.3 and up that is packed with AJAX to add flexibility to the important home page real estate. The main story section contains four of your latest posts layered on top of each other, accessible via tabbed navigation. Gridline News can transform your tubular blog into a full news magazine website.
Get Gridline News for Personal Use
This $24.99 package is for individuals who intend to use this theme on a single website. This is the full version and includes all scripts, theme files, and images. The credit link is not required to stay in tact.
Get Gridline News for Developers
This $99 package is for developers who intend to use this theme on multiple websites. This is the full version and includes all scripts, theme files, and images. The credit link is not required to stay in tact.
Buyout Rights for Gridline News
Don’t want another site on the world wide web to look like yours? Buy the full rights to Gridline News and it will no longer be available for purchase on our website. It is yours to do with as you please! Contact us for inquiries and rates.
Installation
- Unzip the downloaded file
- Upload the entire “Gridline News″ folder to your “/wp-content/themes/” folder
- Log in into your WordPress control panel
- Click the Presentation tab
- Select the “Gridline News” screenshot
Configuration
- GETTING STARTED: To get Gridline News off and running, you will need a minimum of 5 categories to populate the homepage. The main section on this page is the latest article posted in category 1, followed by category 2, 3, and 4. The three posts at right are all from category 1, offset by 1 to avoid duplication. The other sections display the latest articles in their respective categories.
- YOUR CATEGORIES: In the “home.php” you will find a series of query_posts functions which refer to specific category ID numbers from my database.
You will need to change the category numbers to reflect the ID numbers of the categories that you want to display on your homepage. Category numbers can be found in your control panel under Manage->Categories. There are a total of 6 spots in the home.php file to change to reflect the post categories that you want to display on the main page. - YOUR PHOTOS: To have thumbnails in each post, crop the thumbnail to 150px wide by 100px tall, upload it to the web and copy the URL to the photo. Within Wordpress’ Write Post page, scroll down towards the bottom and click on the Custom Fields section. Add a key called “small_photo” and then paste the link to the thumbnail photo into the key value field. Photos posted within each entry’s post will should not exceed 350px wide by 225px tall, otherwise, the images will bleed out and make you site look icky. View a screenshot of the custom fields used for the Gridline News Theme. Make sure your custom field values and keys match those in the screen shot above (but change the key value to the exact url to your images.) Custom fields are one of the most overlooked, yet powerful, tools in Wordpress. Read more about using custom fields.
- YOUR AUTHORS PAGE: Gridline News comes packaged with an author archive (authors.php), which will display some author specific info pulled from the Users page in your Wordpress installation. In order for the author’s image to show up, you’ll need to place a jpg of the author titled by the author’s last name in the wp-content/themes/gridline/images/authors/ folder. For instance, mine is Allender.jpg, sized at 75px X 75px. Here is an example author page.
- STYLES.CSS: Unlike most Wordpress themes which plug all the css in one file called styles.css, Gridline utilizes the Blueprint CSS framework to help separate positioning, typography, forms and what I’ll refer to as custom or gridline specific styles. To edit all custom gridline specific styles, you’ll need to edit the style.css file located in your wp/wp-content/themes/gridline/ directory.
- COMMON ISSUES JQuery, the javascript framework used in this theme, and Prototype, the javascript language that powers some Wordpress plugins, don’t like each other. To create a pleasant user-experience, deactivate all plugins that use the Prototype javascript framework.
ABOUT BLUEPRINT
All Gridline Themes utilize the CSS framework called Blueprint. Who is credited for the ideas behind Blueprint? Some of the best designers on the web. They include Jeff Croft, designer for Blue Flavor, Khoi Vinh, design director for NYTimes.com, Nathan Borror, Christian Metts, Eric Meyer, Wilson Minor, Angus Turnbull, Olav Bjorkoy and a few others. Most major websites use some form of css framework to allow for rapid, consistent development and design. Take the Blueprint 101 course to learn about all the possibilities.
CAUTION
If you are new to Wordpress, HTML or CSS, Gridline probably isn’t the best theme to try to learn on. Gridline is, however, perfect for those who want to learn by doing, reading and practicing life inside a sophisticated Wordpress magazine theme.
December 10th, 2007at 10:55 pm(#)
Great themes, but a small problem in Safari on a Mac. The wide page layout gets all messed up. Works fine in Firefox.
December 11th, 2007at 2:54 am(#)
Is this template for Wp 2.3.1 ?
Thanks a lot,
Gabriele
December 11th, 2007at 7:58 am(#)
@Allan - This has been fixed. It was a problem with the code I posted in the body entry, not the theme. Thanks for picking that out!
@Gabriele - Yes. It is compatible Wordpress 2.3.1.
December 16th, 2007at 1:32 am(#)
I have install the “Gridline News” theme but my blog name does not appear. How can I replays the phrase “Gridline news”, with my blog name?
December 16th, 2007at 6:52 am(#)
This can be done two ways. I’m posting the easiest method below:
Create your own logo, make it no larger than 50px tall. Call it “gridline_news_logo.jpg” and upload it to your server here:
/wp-content/themes/gridline_news/images/gridline_news_logo.jpg
Or, to have a text-based logo, instead of an image, in Presentation > Theme Editor > select Gridline News Theme > select Header and replace the code underneath the SITENAME comment and design your own preferred Header title, examples of which can be found here.
January 1st, 2008at 6:23 am(#)
cannot get the tabs working along the top (the four)
many thanks
January 1st, 2008at 7:10 am(#)
Prototype (the javascript that powers some Light box plugins) and JQuery (the javascript that powers the tabbed navigation) are known to not like each other. Try deactivating any plugins that use the Prototype framework (lightbox, thickbox). Also, make sure that this line is in your header.php:
<script type="text/javascript" src="<? php bloginfo('stylesheet_directory'); >/js/tabs.js"></script>January 1st, 2008at 7:34 am(#)
found it, in header.php the following line was missing:
<script type=”text/javascript” src=”/js/tabs.js”>
January 10th, 2008at 11:53 am(#)
Hi, you tell us how to set the small pictures - but how are the big pictures in the the grey tabbed set?
Is there a custom field, too?
Greetings from Germany
eli
January 10th, 2008at 6:23 pm(#)
@Eli
Please refer to item #3 posted above in the CONFIGURATION section.
January 10th, 2008at 10:37 pm(#)
Thank´s for the quick answer :)! I hope the IE issue will be resolved - that would make me the happiest blogger in the world! Your theme is discussed a lot in German blog lately - and I think it looks great. If only it worked in IE
Nice Greetings
Eli
January 11th, 2008at 12:43 pm(#)
figured it out myself….in the file “screen.css” (gridline_news\gridline_news\css) the line @import ‘lib/ie.css’; is missing
January 13th, 2008at 5:09 am(#)
Hi, the images don’t load on my front tabs. I’ve disabled and then removed all plugins but with no success.
I have also loaded into header.php but again with no success.
I am using WordPress 2.3.1.
Please help.
cheers
Geoff.
January 14th, 2008at 8:03 am(#)
problem solved. use medium_photo as a key, not small_photo.
January 31st, 2008at 6:58 am(#)
How to display images in Previously Featured in the right column? I don’t know if it is an automatic process or if I have to insert a PHP code manually.
Someone can help me?
Thank you very much
February 17th, 2008at 12:38 pm(#)
If you are having any IE 6 issues I believe the problem is in the header.php file where the ie.css file is referenced. I believe the correct code should be
(put the following inside HTML comments…)
[if IE]><link rel=”stylesheet” href=”/css/lib/ie.css” type=”text/css” media=”screen, projection” /><![endif]
so that the ie.css file in the lib folder within the theme will be picked up. The code that I had in my release referenced “css/blueprint/lib/ie.css”. Maybe an ealier release did not package blueprint with the theme?
Thad, thanks for the time you put into these. I purchased 3 themes!
March 1st, 2008at 7:05 pm(#)
how do i make the width fluid? (full browser width)?
thanks
March 11th, 2008at 6:48 am(#)
Is there ANY way to make grindline work together with a prototype js Plugin? I want to use the IMM glossary creator, which uses prototype.
Nice Greetings
Eli
March 24th, 2008at 12:25 am(#)
waw.. good
April 7th, 2008at 5:03 pm(#)
Hi, escribo desde Ecuador, no entiendo bien como aplicar custom fields
I dont understand the use of custom fields
Can You helpe me if I buy this theme
Gracias
Sorry for my english
April 9th, 2008at 9:12 am(#)
Reading through here again I noticed that someone else had a problem with the image showing up under the tab, and by simply changing the key to medium_photo, it worked! And it will show either the thumb or the full size image (as specced at within 350×225), so that’s nice. So then, are the instructions to enter a key of small_photo wrong, or is there somewhere else this “thumbnail” is supposed to show up?
April 9th, 2008at 9:29 am(#)
aha I see… the small_photo is for when it gets shunted off to the previously featured. OK.
So I have two large posts/questions in here that are awaiting moderation, presumably because I have links in them. Hopefully those will get release soon as I’m really stuck on several points on this theme
April 29th, 2008at 2:43 am(#)
Is this template for Wp 2.5.1 ?
April 29th, 2008at 6:06 am(#)
It is necessary to make changes? I do not know working with theme. I know only to download and put on the blog.
May 5th, 2008at 4:17 am(#)
Really nice theme! I have it!!!!!!
May 6th, 2008at 11:26 am(#)
Great theme. I love it.