Tag archive: tutorials

Inverting the colors of a template

When I published the Variant Artist template some days ago, I thought it would be a good example for showing how to change the light-on-dark colors into the opposite, with dark text on light background. It can be done in several ways, and this is how I prefer to do it. This is what the…

Replacing the transparent logo in Basic Landing

In the newly released Basic Landing template, there is a feature which I have never used before. The sample logotype in the header (as seen in the screenshot to the right) is a .png file which uses an alpha channel to make the background transparent and the glow effect semi-transparent. The sample logo can be…

How to add an image gallery to a template (part 2)

This is part 2 in a series of tutorial posts about adding an image gallery to a website template. For this post to be useful, make sure to read part 1 first! In the part 1 of this tutorial I described how to replace the single sample image of the Gallery template with a simple…

How to add an image gallery to a template (part 1)

Time for another tutorial series, and this time I will try to answer another common question: “How can I add an image gallery with clickable thumbnails to a template?”. I will show one way to do it, using the Gallery template and a jQuery plugin by nodethirtythree design called Gallerax. Step 1: The starting point…

Get started with @font-face

With the release of Variant Creative (alt) template, I have started using embedded fonts using @font-face. Only a few hours after the template was uploaded, I got a request to write more about how to embed fonts in a template or a website. I will definitely do that, and I am actually already writing on…

Menu