Runway Logo

Templating

There’s no point storing data in a database for it never to be used, is there?

Tags

Runway provides a {{ runway }} Antlers tag to enable you to get model data for your resources.

For example, if you wish to create a listing/index page for a resource, you can use the tag like shown below:

1{{ runway:post }}
2 <h2>{{ title }}</h2>
3 <p>{{ intro_text }}</p>
4{{ /runway:post }}

There’s a bunch of helpful parameters you can use on the tag as well…

Sorting

You may use the sort parameter to adjust the order of the results.

1{{ runway:post sort="title:asc" }}
2 <h2>{{ title }}</h2>
3 <p>{{ intro_text }}</p>
4{{ /runway:post }}

Eloquent Scopes

If you've defined a scope on your Eloquent model and you want to filter by that in your front-end you may use the scope parameter.

1// app/Models/Post.php
2 
3public function scopeFood($query)
4{
5 $query->whereIn('title', ['Pasta', 'Apple', 'Burger']);
6}
1{{ runway:post scope="food" }}
2 <h2>{{ title }}</h2>
3 <p>{{ intro_text }}</p>
4{{ /runway:post }}

If you need to you can provide arguments to the scope like so:

1{{ runway:post scope="food:argument" }}

In the above example, argument can either be a string or we'll grab it from 'the context' (the available variables) if we can find it.

You may also provide multiple scopes, if that's something you need...

1{{ runway:post scope="food:argument|fastfood" }}

Filtering

Just like with the collection tag, you may filter your results like so:

1{{ runway:post where="author_id:duncan" }}
2 <h2>{{ title }}</h2>
3 <p>{{ intro_text }}</p>
4{{ /runway:post }}

Eager Loading

If your model has a relationship that you'd like to bring into the template, you may specify the with parameter.

1{{ runway:post with="user" }}
2 <h2>{{ title }}</h2>
3 <p>By {{ user:name }}</p>
4{{ /runway:post }}

You can specify multiple relationships to eager load, just separate with pipes.

1{{ runway:post with="user|comments" }}

Hot Tip: Eager Loading can make a massive difference in the speed of your queries.

Limiting

If you only want X number of results returned instead of ALL of them, you may specify a limit.

1{{ runway:post limit="15" }}
2 <h2>{{ title }}</h2>
3 <p>{{ intro_text }}</p>
4{{ /runway:post }}

Scoping

As with the collection tag, you may use the as parameter to scope your results.

1{{ runway:post as="posts" }}
2 {{ posts }}
3 <h2>{{ title }}</h2>
4 <p>{{ intro_text }}</p>
5 {{ /posts }}
6{{ /runway:post }}

Pagination

If you want to paginate your results onto multiple pages, you can use the paginate parameter, along with scoping and limiting.

Using the Runway tag with pagination is a little more complicated but it’s not rocket science.

1{{ runway:post as="posts" paginate="true" limit="10" }}
2 {{ if no_results }}
3 <p>Nothing has been posted yet. Sad times.</p>
4 {{ /if }}
5 
6 {{ posts }}
7 <h2>{{ title }}</h2>
8 <p>{{ intro_text }}</p>
9 {{ /posts }}
10 
11 {{ paginate }}
12 {{ if prev_page_url }}
13 <a href="{{ prev_page_url }}">Previous</a>
14 {{ /if }}
15 
16 <span>Page {{ current_page }} of {{ last_page }}</span>
17 
18 {{ if next_page_url }}
19 <a href="{{ next_page_url }}">Previous</a>
20 {{ /if }}
21 {{ /paginate }}
22{{ /runway:post }}

Augmentation

All the results output from the Runway tag are ‘augmented’, which essentially means everything is the same as you’d expect if you had the same data in an entry.

The process of augmentation takes a value (from the database in our case) and processes it via the fieldtype into a value appropriate for the front-end.

Let’s imagine you have an Assets field in your blueprint, you may have something selected for the field. In the database, the path to the asset is stored.

When this field is then augmented, Statamic does a lookup of the asset by it’s path and spits out variables like url, alt and a couple of others.

(There’s another explanation of augmentation over on the Statamic documentation)

Code highlighting provided by Torchlight.

Edit this page