Archive for tag 'templates'

The Grid v2.1 released

The Grid v2.1The second version of The Grid template has been updated to version 2.1, fixing a minor error in the sample content. A package of sample layouts built from the template will be released separately at the end of this week, showing the flexibility that the grid system provides for creating both simple and complex layouts.

Download The Grid v2.1 (.zip, 164 Kb)

Variant Whitespace template re-organized

Guy Rutenberg found a couple of details in the Variant Whitespace template which could be improved, and decided to create and release a modified version of it. Guy changed the code order and edited the way that the sidebar is positioned, and the result sure is an improvement. Check it out!

Open call to designers, photographers, artists and other creative people!

Since the first free website template was published on andreasviklund.com in October 2005, I have mostly focused on creating and releasing simple, well-coded and generic designs, trying to keep each template neutral in terms of the sample content to allow template users to turn the templates into websites about any imaginable topic. There are lots of examples that show that this neutral and generic approach has been successful and appreciated.

For example, the andreas01 template has, among many other things, been used to run an official NBA team blog, several advanced science websites, numerous sites and blogs about faith and different religions, as family websites for people all over the world, as the base design for university professors, school classes, politicians and even a member of a Royal family. The generic design and the easy customization has made it easy to give the template a specific touch that is relevant to the topics that different template users are working with.

But something has been missing…

While many template users prefer to put their own touch to a generic website template, not everyone want to do it. If I would gather all requests I have got about making topic-specific templates, it becomes obvious that a lot of visitors to this site wants to see templates about specific topics. Those who are looking for a template to build a website about cars, would naturally be searching for car website templates. The same goes for nature websites, financial websites, sports websites and any other topic that could be relevant.

Now, I need your help!

Since andreasviklund.com by now has a large collection of generic templates, it is time to add a new touch to the free template gallery. Soon, I will start releasing new templates with specific topics, hoping to provide more inspiration and new ideas to site builders. But rather than making up topics and designs for all of them, I would like to invite all of you creative people (designers, photographers, artists – well, anyone who loves to create material) to help me out. Is there any talented fashion designer out there who would want to participate in creating a free fashion website template? Or any artists creating beautiful paintings that could be turned into backgrounds and sample content for a series of art website templates? If so, let me know!

I'll do the HTML/CSS coding, based on material from others who provide input, images and fresh ideas. All contributors will of course be given appropiate credit, both inside the templates and in the template gallery. As a first step, I have been in talks with a talented Swedish nature photographer about making a series of wildlife templates, and with one of my favorite illustrators about making a cartoon-themed template (both of which are designs that I would never be able to make by myself).

Join in, all ideas are welcome!

I do of course also welcome ideas from everyone. What kind of topic would you like to see in a future website template? Share your opinion, either in the comments to this post or by sending me an e-mail.

Also keep in mind that these topic-specific templates will be possible to modify in any way you may want to, so if you find a fashion-themed template that you would want to use for your wedding website – then you can of course do so. The topics are for inspiration, for showing that website templates can look amazing and still be easy to use as starting points for building websites.

I think that it will be an incredibly fun direction to take for the andreasviklund.com template gallery, and that more people will find inspiration and ideas from the templates when topics are added. I also think that it will be a great place for creative people to get their work seen by a lot of people all around the world, as each template gets thousands of downloads.

Sounds exciting, don't you think?

N.nu now featuring templates from andreasviklund.com

N.nu - Free website builder featuring templates from andreasviklund.com

N.nu with the andreas03 template

The quickly growing website host N.nu is now featuring three of the templates from andreasviklund.com. N.nu is a free online website builder which offers the ability to build high-quality sites for free, with a set of useful premium services available. If you are looking for an easy way to build a website, it is well worth a try.

I will post a review of N.nu before the end of this week, with a short tutorial on how to set up and organize a N.nu site using one of the andreasviklund.com templates. At the moment, the templates that have been made available are andreas03, andreas08 and andreas09. The creator of N.nu, Swedish web developer and SEO professional Jim Westergren, has joined the andreasviklund.com forum. If you have specific requests for templates that you want to use with N.nu, feel free to post your requests in this forum thread.

How to select the grid width in The Grid v2 template

The new version 2.0 of The Grid template includes two separate grid layouts, one that is 960 pixels wide and another that is 1200 pixels wide. Both grids use 12 columns with 20 pixels of spacing, but the column widths are diferent. The 960 pixels grid use a column width of 60 pixels while the 1200 pixels grid use a column width of 80 pixels. Since both the included grids have a similar set up, you can use any of them with the layouts created with the template. The only thing that needs to be modified to switch between the two width options is the <body> tag.

Using the 960px grid

The 960px grid is the default setting. To use it, keep the <body> tag free from additional classes, and just let it be written out as:

<body>

Using the 1200px grid

The wider grid is applied by adding a class to the <body> tag. The class, named "wider", activates a part of the CSS which changes the grid width and all the relevant parts of the layout that are affected by the width. To switch to using the 1200px grid, modify the <body> tag to make it look like this:

<body class="wider">

No matter how the columns and rows are set up in the template, the layout and the background image will adjust to the width thanks to the body class. The exception is the header image which needs an additional edit of the HTML code. Change the header image filename by adding "-1200" to the file name, like this:

<div id="headerimage" class="col c12">
<p><a href="index.html"><img src="images/header-1200.png" alt="The Grid template" /></a></p>
</div>

…and you are ready to use your layout in a wider format!

')