User Guide

Tim­ber is a pho­tog­ra­phy Word­Press theme aimed at all you visu­al cre­atives out there that need a tool to show­case your work. In this guide, I will try to walk you through the main fea­tures that Tim­ber brings on top of what already Word­Press has to offer (basic Word­Press learn­ing is not the scope of the cur­rent arti­cle — check this out for that kind of infor­ma­tion).

Getting Started

Tim­ber is a theme that strives to fol­low all the Word­Press stan­dards both in cod­ing but most of all in the way it uti­lizes the func­tion­al­i­ty that Word­Press offers out of the box. We believe this is the way for­ward for themes, mak­ing it eas­i­er for you to switch themes and take your old con­tent along for the ride.

The Portfolio

The port­fo­lio sec­tion is one such exam­ple (actu­al­ly the main one as we are talk­ing about a port­fo­lio theme). We have focused each project on the Word­Press edi­tor (yes you’ve heard it right).

How can one have those beau­ti­ful project gal­leries with hor­i­zon­tal scroll, text, videos, thumb­nails, and so on, all in the old edi­tor? Well, you can if we do the heavy lift­ing for you. Let me elab­o­rate.

Creating Projects

When you cre­ate a new project from your Word­Press admin pan­el by going to Projects → Add New you get a pret­ty stan­dard set of tools (the same ones you would get when cre­at­ing a new post). You get the edi­tor, project types (these are sim­i­lar to cat­e­gories), project tags, a fea­tured image and a few cus­tom set­tings of our own in the Project Set­tings box under the edi­tor box.

So where do I get to add my photos?

Right in the edi­tor in the form of image gal­leries (we auto­mat­i­cal­ly insert an emp­ty gallery when you cre­ate a new project just to get you start­ed that much faster), reg­u­lar images (I would rec­om­mend keep­ing the images on sep­a­rate lines) or video embeds.

Tim­ber will only look at the image URL (or id if it’s a gallery short­code) and the cap­tion if present. So any oth­er set­tings you may use (like image align­ment) will be ignored.

What about text to go along with my photos?

You can at any point insert reg­u­lar con­tent (text, short­codes, and so on) between any of the 3 types described above. We will respect this and make a text box that will be part of the project’s pre­sen­ta­tion. So noth­ing gets lost.

As you can see, by inter­pret­ing your con­tent Tim­ber suc­ceeds in giv­ing you flex­i­bil­i­ty while at the same time mak­ing your con­tent more future proof.

Impor­tant note: Sor­ry for this but right now we only sup­port self-host­ed images (images that are uploaded to your site’s Media Library, not images from oth­er sites/domains). This is due to the fact that we need to process and know these images pret­ty well (hence take advan­tage of the pro­cess­ing done by Word­Press when cre­at­ing attach­ments), a thing that is not fea­si­ble (per­for­mance wise) with exter­nal images. So please use only images that you upload when you click on the Add Media but­ton or edit the default emp­ty gallery.

Project Layouts

We know that each project of yours has a dif­fer­ent mood and atti­tude, as do you. When cre­at­ing or edit­ing each project you can select from the Project Set­tings box under your edi­tor what lay­out you wish to use.

There are 3 project lay­outs to choose from (ordered ascend­ing by the size of images):

  • thumb­nails — your project will open up in a view dis­play­ing all of the project’s images in thumb­nail form (text and videos are exclud­ed); by click­ing on any image thumb­nail, your vis­i­tor will tran­si­tion to the next lay­out, film­strip;
  • film­strip — this lay­out will dis­play your project con­tent (text and videos includ­ed this time) as a full height film strip with hor­i­zon­tal scrolling; by click­ing on any image, your vis­i­tor will tran­si­tion to the Zoom & Pan view that will immerse him even more into your pho­tog­ra­phy; one can switch freely between these 3 views (thumb­nails, film­strip and Zoom & Pan);
  • fullscreen — your project will be pre­sent­ed as a fullscreen slideshow with a trans­par­ent head­er and foot­er (giv­ing your pho­tos the max­i­mum screen space).

Fullscreen Image Scal­ing

  • FILL — the image cov­ers the entire screen and can be explored using an immer­sive pan­ning effect
  • FIT — the image is resized to fit inside the con­tain­er and it’s ful­ly vis­i­ble from the start

Own Your Front Page

Tim­ber knows you like to play with your front page (the main page of your site). That is why you have the flex­i­bil­i­ty of bring­ing your port­fo­lio, or parts of it, cen­ter stage.

Once you have cre­at­ed and set­up your sta­t­ic front page, open it in edit mode. First, you need to give it the Cus­tom Port­fo­lio Tem­plate from the Page Attrib­ut­es sec­tion. Once you do that your edi­tor will dis­ap­pear (we don’t sup­port con­tent on these type of pages, so what’s the point of hav­ing it around right?) and a box called Cus­tom Port­fo­lio Tem­plate Options will appear.

There are 3 con­tent types:

  • projects slid­er that will dis­play a slideshow of some projects of your choos­ing;
  • the port­fo­lio archive (project title and thumb­nails with AJAX load­ing of old­er projects);
  • and a sin­gle project of your choos­ing.

That’s it regard­ing putting your port­fo­lio on the front page of your site. Pret­ty straight for­ward right?

This has been a short and straight­for­ward intro­duc­tion into how Tim­ber can work for you. Take this info, play with Tim­ber and share with us sur­pris­ing ways of using it.

This article applies to Timber, as they share the same underlying structure.

Updated on April 18, 2017

Was this article helpful?