v1

Publishing via the API

This post refers to a legacy version of Siteleaf.

For the last week publishing in the Siteleaf interface has been powered by our API. This has been a requested feature by some of our users and ourselves. Its behavior is bit different than some of our other API endpoints, so let’s go over it.

To initiate a publish, make an authenticated POST request to the /sites/:id/publish endpoint.

$ curl -u "$API_KEY:$API_SECRET" -X POST \
  http://api.siteleaf.com/v1/sites/$SITE_ID/publish

{"job_id":"e79af12c79ccd8866902d3dd"} 

This triggers a publish and immediately returns a job ID (or returns an already running job ID if one exists). You can stop here if you’d like and Siteleaf will happily chug away in the background.

But the fun doesn’t stop there. You can optionally check in on publish progress using your job_id from above by making an authenticated GET request to the new /jobs/:id endpoint.

Read more

Advanced Liquid: Group By

This post refers to a legacy version of Siteleaf.

Advanced Liquid: Group By

Following sort and where, this Advanced Liquid post introduces another handy new filter to Siteleaf: group_by.

As the name suggests, this filter allows you to group your content by a certain property.

For example, here’s how we could group all posts by year published:

{% assign posts_by_year = site.posts | group_by:"year" %}

You can group by any property like date, title, slug, even metadata and taxonomy. Here are a few real-world examples you may want to apply to your theme.

Read more

Advanced Liquid: Where

This post refers to a legacy version of Siteleaf.

Advanced Liquid: Where

Now that you are sorting like a pro, we’ll move on to another new and exciting Liquid filter: where.

Where allows us to find content based on a parameter. If you are coming from Jekyll, you’ll be happy to know it follows the same syntax.

For example, here’s how we could find all pages titled “Foo”:

{% assign foo_pages = site.pages | where:"title","Foo" %}

As with sort, you can use any property like date, title, slug, even metadata and taxonomy. Below are few real-world examples you might find useful.

Read more

Advanced Liquid: Sort

This post refers to a legacy version of Siteleaf.

Advanced Liquid: Sort

Liquid is the flexible templating language that powers themes on Siteleaf. While simple at first glance, there’s a lot of power under the hood for those wanting a greater level of control. In this new blog series, we’ll dive deeper and take a look at some advanced Liquid code and examples.

First up in this post, we’ll take a look at the sort filter.

With any site, Siteleaf makes some general assumptions about your content. For example, posts are sorted by date (newest post shows first) and pages are sorted manually. In cases where this doesn’t fit your design, you can utilize the sort filter to order content any way you wish.

For example, here’s how we might sort pages by date:

{% assign sorted = pages | sort:"date" %}

This will sort in ascending order, but we could also choose descending order by adding reverse:

{% assign sorted = pages | sort:"date" | reverse %}

You can sort on any property like date, title, slug, even metadata and taxonomy. Below are few real-world examples you might find useful.

Read more

Improvements to page and post management

This post refers to a legacy version of Siteleaf.

Improvements to page and post management

If you’re a heavy Siteleaf user, you might notice a few tweaks here and there that we recently introduced.

Improved page menu

new-menu

The first thing you might notice is a redesigned page menu in the sidebar. After building large sites with Siteleaf, we realized the original design didn’t accommodate subpages and posts as well as it could. Now, it’s a lot easier to dive into and sort multiple levels of subpages while still keeping things looking clean.

Quickly search and browse posts

Another new thing we’ve introduced is the posts sidebar. Now you can dive straight into a page’s posts by clicking the posts icon posts-icon next to the page link in the sidebar, or by clicking the “other posts” link on the post itself. From the posts sidebar you can now search and filter the posts list by title.

Quick tip: Assets in meta fields

This post refers to a legacy version of Siteleaf.

Siteleaf makes it easy to assign assets in your metadata fields, just drag and drop (as shown above).

Now in your theme, you can easily link to your asset:

<a href="{{ meta['project_link'] }}">
  {{ meta['project_link_title'] }}
</a>

This is a great way to reference special assets like featured images or PDF downloads.

To learn more about metadata see our tutorial Metadata in Siteleaf.

Siteleaf turns one

This post refers to a legacy version of Siteleaf.

It’s time to celebrate, today is Siteleaf’s first birthday!

Here’s what we’ve been up to lately:

  • GitHub Pages integration: now you can publish your site with version control, see revisions and revert back to any publish state.
  • New help site: we have a new site for theme documentation, tips, and FAQs (built on Siteleaf of course).
  • User roles: control site access for your collaborators and clients.
  • Asset metadata: add captions, alt text, and information to your images.
  • Zapier integration: create new Siteleaf posts via e-mail or third party services.
  • Siteleaf Gallery: see how others are using Siteleaf and get inspiration.

If you’re just joining us, we now have free Developer accounts available. You can sign up for free, try out our tutorials, and get a feel for the service before going live.

Follow @siteleaf on Twitter for more updates.

New: Asset Metadata and Quick Post Edit

This post refers to a legacy version of Siteleaf.

New: Asset Metadata and Quick Post Edit

We’re constantly working on improving the Siteleaf experience and making it as flexible as possible. Today we’re happy to introduce two new features:

Asset metadata

Just like metadata on your Siteleaf posts, pages, and sites, asset metadata is a flexible way to add additional information to the assets uploaded to your site. This is perfect for things like captions, alt text, adding location info, and more. In your Siteleaf theme, you can access asset metadata through the asset’s meta variable. For example, if you had an asset meta field with a name of “caption”, you would access its value like so:

asset.meta.caption

For a more advanced example of how you could use asset metadata, check out our latest Siteleaf lab where we use asset metadata and a JS library to swap out images based on the window width.

Quick post edit

quick-post-edit

Another new feature we’ve added to the Siteleaf management area is the ability to quickly edit a post without leaving the list of posts. This is perfect if you just need to make a small change to a post’s title, toggle its visibility, or to reorder your posts by their publish date.

Using Markdown in metadata

This post refers to a legacy version of Siteleaf.

In previous posts, we talked about using Markdown for text formatting and Metadata for extending your content in Siteleaf.

Markdown makes it easy to add links and *emphasis* to your content without having to write HTML. While your body content uses Markdown by default, you can also apply this easy-to-use formatting to your metadata.

Read more

Layouts in Siteleaf

This post refers to a legacy version of Siteleaf.

Layouts in Siteleaf

In my last article about Siteleaf, I wrote about what goes into porting a theme to Siteleaf from another CMS. This time around, I’ll show you how to write cleaner, less redundant templates through the use of layouts.

Read more

Porting a theme to Siteleaf

This post refers to a legacy version of Siteleaf.

Porting a theme to Siteleaf

Today, I ported another theme to SiteleafAllison House’s Martin theme. I started porting themes to Siteleaf earlier this month as a self-imposed challenge. A friend of mine asked if a particular theme was possible to implement using Siteleaf and rather than answer with a simple ‘yes’, I responded with the ported theme. This was a great way of demonstrating Siteleaf’s adaptability, but also a useful exercise for myself to see where Siteleaf excels and where it falls short. In this post, I’ll walk through porting the Martin theme and show you just how easy it can be.

Read more

Markdown in Siteleaf

This post refers to a legacy version of Siteleaf.

Markdown in Siteleaf

In the last Siteleaf post, we explored taxonomy and the many ways you could use it to extend your website. This time, we’ll break from templating and take a closer look at content—specifically, Markdown’s role in Siteleaf.

Markdown

If you develop for the web and haven’t heard of Markdown yet, I’m going to have to ask you to leave. As described by its originator, John Gruber, “Markdown is a text-to-HTML conversion tool for web writers.” With it, we can write a blog post, like this one, and style it without touching HTML. Instead of typing <strong>bold</strong> for a selection of text we’d like to bold, we can type **bold** and use a Markdown engine to produce the proper HTML syntax. This allows for more legible text when writing, so we don’t lose track of the actual words.

Along with styling, we can also use Markdown for more complex elements, like links: [alt text](http://mylink.com), and images: ![alt text](/myimage.jpg). Under the hood, Siteleaf uses Redcarpet, a widely-adopted Markdown engine, and SmartyPants, a plugin for automatic smart quotes and other fancy characters. With these libraries, we get a few extra shortcuts for free, like em dashes: ---, ellipsis: ..., and tables:

| First name | Last name   | Age |
| ---------- | ----------- | --- |
| Jonnie     | Hallman     | 26  |
| Larry      | Fox         | 15  |
| Sawyer     | Hollenshead | 14  |

With the support of Markdown, Siteleaf posts can follow our guiding principle—all content should outlive its CMS. No matter where you manage your website, you should be able to take your content with you, free from any ties to the previous system.

Read more

Taxonomy in Siteleaf

This post refers to a legacy version of Siteleaf.

Taxonomy in Siteleaf

Last week, I wrote about metadata in Siteleaf and the variety of ways you could use it to customize your website. In this post, I’ll do the same, but with metadata’s much cooler, older brother—taxonomy.

Read more

Developing sites and themes

This post refers to a legacy version of Siteleaf.

Watch Developing sites and themes on Vimeo

In this video, we show you how to create Siteleaf themes using Liquid and develop sites locally using the Siteleaf Ruby Gem and Pow/Anvil.

Watch this tutorial on Vimeo.

Also see: Getting started with Siteleaf

Metadata in Siteleaf

This post refers to a legacy version of Siteleaf.

Metadata in Siteleaf

In Siteleaf, metadata is pure key/value data attached to a site, page, or post. It provides a way to interact with templates beyond the basic usage of injecting title or body copy. Metadata can be used to set inline CSS values or specify the number of posts on a given page—the uses are endless. It’s also very flexible, down to a per-entity level. A post could have a completely unique set of metadata compared to that of its siblings. Let’s look at a few examples.

Read more

Getting started

This post refers to a legacy version of Siteleaf.

Watch Getting started on Vimeo

In this video, we show you around the Siteleaf interface and create a simple website.

Watch Getting started with Siteleaf.

Hello World, I’m Siteleaf

This post refers to a legacy version of Siteleaf.

Hello World, I’m Siteleaf

Last week, I ran through a number of Siteleaf’s most compelling features and provided a general overview of the service. This week, I’ll hold your hand through creating a basic website using Siteleaf.

Read more

Introducing Siteleaf

This post refers to a legacy version of Siteleaf.

Watch Introducing Siteleaf on Vimeo

Watch Introducing Siteleaf.

Siteleaf overview

This post refers to a legacy version of Siteleaf.

Siteleaf overview

Recently, we at Oak launched a new website publishing platform, called Siteleaf. In short, Siteleaf lets you build your website locally, edit its content in the cloud, and publish to static. In between, it’s so much more. Let me tell you about it.

Develop locally

As the one who makes the websites, you undoubtedly have a dev environment you prefer. All your code is version-controlled, your snippets are award-worthy, and you are one with your text editor. With Siteleaf, there’s no online WYSIWYG editor forced upon you, so you can build your website in the comfort of your own IDE. Use the Siteleaf gem to preview your templates locally using the data from the live server. When you’re ready to go live, simply push the files with the gem or upload them using the website. You can even use Pow or Anvil to preview your sites with a proper hostname.

anvil

Read more

Introducing Siteleaf

This post refers to a legacy version of Siteleaf.

Introducing Siteleaf

Approach — Managing content on sites can be a precarious task. We wanted to build a lean tool that would integrate easily into your workflow, yet provide everything necessary to maintain your content.

Goals — Siteleaf aims to strike a balance between control and simplicity. We believe content management systems should be simple but not overly simplified. That you own your content, your sites should be able to outlive their CMS, and you should be able to host sites anywhere you want. With these principles in mind we developed Siteleaf.

Features — Siteleaf is a lightweight platform for publishing websites. Write with markdown, collaborate with colleagues, develop with templates, build with our API.

If you can write HTML, you can create with Siteleaf.

Read more