Theme Tip: Advanced uses for Pages database fields

Our Pages app includes a powerful feature that allows you to create your own databases within the community. Within each database, you create custom fields (we support a number of custom types, from plain text fields, to YouTube embeds and more). And while we provide some generic, simple templates to display your data, custom templates allow you to more precisely control how your database looks in a manner best suited to your site.

Anyone who has created a Pages database will be familiar with using custom fields. You may have created a field for the title of your item, or an upload field so that the item contains a file for users to download. But beyond these straightforward uses, I wanted to explore some more advanced uses of custom fields. Fields don't necessarily have to be displayed to the user - or at least not in the usual way. We can use them as configuration options for our record display, or manipulate the data in order to show it in a different way. Let's take a look at some examples.

1. Adding an optional badge to records

We'll start with a fairly simple example. In our Guides section, we highlight guides that have a video tutorial by showing an 'Includes Video Guide' label on the listing:

We achieve this simply by having a Yes/No field that we turn on as needed. In the field format, we turn the Yes/No value into the label by setting the format to Custom and using this code:

{{if $formValue == 1}}
	<span class='ipsType_medium'><i class='fa fa-video-camera'></i> <strong>Includes Video Guide</strong></span>
{{endif}}

2. Using fields as a way to configure the record display

Fields don't necessarily need to be shown to users. Instead, we can use them as a means to configure the record display, giving us some really powerful flexibility in how we show records. In this contrived example, I'm going to create a field that changes the background color of the content.

1. Create a Select Box field. Each option key will be a hex color, while the value will be the name the record creator will choose.
2. Set the field key to record_background
3. Set the field formatting to Custom, and the format to simply: {$formValue}. This means it will output our hex value instead of the color name.
4. In the display template assigned to this database for records, we can use the field like so:

   <div style='background-color: #{$record->customFieldDisplayByKey('record_background', 'listing')|raw}' class='ipsPad'>
     ...rest of the template...
   </div>

5. Now, when you create a record, you can choose a color and that color will be used when the record is shown:
   

You can use this approach in others ways - toggles to control the layout of the record, or options for grid sizes, or even take an upload field for images and set the background of an element as that image.

3. Pass data to 3rd-party integrations

Pages has built-in support for several 3rd party integrations, such as Spotify, Soundcloud, YouTube and Google Maps. But using custom fields, you can pass data to other services too. Let's say we wanted to embed an iTunes album widget into each of our records - perhaps the album is relevant to the Pages record in some way and we hope to encourage some click-throughs. In this example, we'll use the embed.ly service. 

1. Create a URL custom field.
2. Set the field key to itunes_album
3. Set the field formatting to Custom, and the format to:

   <a class="embedly-card" href="{$formValue}">iTunes Album</a>
   <script async src="//cdn.embedly.com/widgets/platform.js" charset="UTF-8"></script>

4. In your database display template, position the field as desired by adding:

   {$record->customFieldDisplayByKey('itunes_album', 'listing')|raw}

Now when you add an iTunes album link to your record, you'll get an embed automatically!

This approach is great for a range of uses. Perhaps you have an Amazon Associates account and want to add a relevant product link to each of your records so that you earn a commission when users click through. Using database fields and templates in this way, it's easy to set up.

I hope that's given you some ideas of other ways you might use database fields in Pages. Share any interesting uses you've come up with in the comments!