We recommend reading our blog post covering the FAQs about the switch from CSS to L&L before diving into this reference guide.

Getting Started

Here is an example of how to display your content.

Let’s imagine a bicycle shop.

  1. Create a custom post type called bicycle. Add categories and fields such as model, price, and description. You can use plugins like Custom Post Type UI and Advanced Custom Fields to create your own post types, taxonomies and fields. Themes and plugins often come with built-in content types.
  2. Add all bicycles as new posts.
  3. Create a new page to display bicycles. A basic template could be:
<Loop type=bicycle>
  [field image]
  Model: <Field model />
  Price: <Field price />
  Description: <Field description />
</Loop>

Another section can display a list of freestyle bicycles:

<ul>
<Loop type=bicycle category=freestyle>
  <li><a href="{Field url}"><Field title /></a> - <Field model /> - <Field price /></li>
</Loop>
</ul>

Editing

There are some points to keep in mind when using L&L Markup.

  1. L&L markup won’t be parsed in the normal WordPress content area. To add content to the content area or a page builder you’ll need to either:
    • use the provided “Tangible Template” block inline or
    • create a Template with your markup and load it with the shortcode or the “Tangible Template” block.

Loading

L&L can be applied to your site in a number of different ways

L&L Parameters

The shortest way to define a parameter is without quotes.

  <Loop type=post count=3></Loop>

For multiple values, do not use a space after the comma.

  <Loop type=fruit category=apple,orange></Loop>

If you need to pass a value that contains a space, use quotes.

  <Loop type=post custom_field=something custom_field_value="John Smith"></Loop>

When using L&L markup in an HTML or L&L attribute, use curly brackets instead of angle brackets, and use quotes.

  <a href="{Field url}" title="{Field title}"></a>