This Page

Portfolio Sites

Because Lektor lets you customize your data model entirely it's the perfect
tool for building portfolio websites. No matter what it is you're building,
you can structure the data exactly like you want. In this example we will
assume we build a website for someone who wants to showcase their art projects.

The Models

The way we want to go about this is that we have a site where all the
projects show up and then a detail page for each project in particular.

projects.ini

First we set up the project overview page. This model instructs Lektor that
all of the pages below it will be of type project. We also set it to
hidden and protected which will make it unavailable in the admin (hidden)
for new pages and make it impossible to delete (protected). This means we
need to manually create the one page later which will use this.

Because we only have a single page for the projects overview we give it a
static label manually (label = Projects).

[model]name=Projectslabel=Projectshidden=yesprotected=yes[children]model=projectorder_by=-date, name

project.ini

Next up is the model for the project. This is completely up to you, we will go
with some things here that might appear on such a portfolio page. In addition
we will do something with the attachments of this page, but more about that
later. For now we just order them by their filename (_id):

Templates

So now that we have models, we should probably go over what we can do with the
attachments. Because each page in Lektor can have attachments added we can
automatically reference those in our templates. Here is what we're going to
do: we will take all the attached images, order them by their filename and then
render thumbnails for them in the detail page. Additionally we want to show
one of the images on the overview page if it's available.

projects.html

So here we just render out all projects in the order defined in our
models and if there is an image attached, we pick the first one and make
a thumbnail.