With over 10,000 active installs and more than 150 glowing 5 star reviews, it may come as a surprise that this is the end of the road for Custom Content Shortcode. People loved CCS because it allowed anybody with a little bit of WP knowledge to whip up dynamic layouts quickly using a concept they were familiar with (shortcodes). L&L accomplishes all that and more today, but is ready to do much more tomorrow!

Why is a new approach needed?

A lot has changed since Custom Content Shortcode was initially launched. People are using WordPress as more than a simple business CRM and are building full applications like Learning Management Systems on top of it. Page builders, blocks and Full Site Editing are bringing new expectations among WP users and new ways of working. Beyond that, shortcodes have some inherent technical limitations that prevent the advanced functionality needed to keep up with all this.

To learn more about the disadvantages of shortcodes, check out this article.

Given how core the functionality Custom Content Shortcode provides can be to a site, it’s also important to consider the long term commercial viability of keeping such a plugin updated and secure. While it would have been possible to create a “pro” version of CCS, the codebase was from a different time and a rewrite would have been needed to sustain a pro version. It simply didn’t make sense to put so much effort into a system that was going to be severely limited by its reliance on shortcodes (which WP as a whole is trying to get away from).

What’s the catch?

The plan to commercialize Loops & Logic is simply to have people pay for 3rd party integrations and optional cloud features. Nothing you can do in Custom Content Shortcode is a paid feature in L&L, so if you’re happy with what you have in CCS you don’t need to pay for anything to get the same result in L&L. For instance, you’ll be able to loop through any post type for free, but if a plugin uses custom tables we need to write an integration in order for you to be able to loop through that. We’ll charge for the integration since each one requires ongoing work to stay in sync with 3rd party plugin updates. Interacting with core WP data types and features will be free since those are typically quite stable and don’t require a lot of ongoing effort to maintain.

In addition to core WP features, we also include integrations with ACF and WP Fusion in the free version. You’re welcome!

So… where is the migrate button?

While we would have loved to be able to offer some kind of automated upgrade from Custom Content Shortcode to Loops & Logic, the two systems are simply too different. L&L syntax is used within special post types and page builder blocks and it can’t be parsed in “normal” WP content areas like CCS can. This isn’t an obstacle when it comes to using L&L (we’ll get to that in a minute), but it is an obstacle for writing an automated migration script.

We intend to continue to support Custom Content Shortcode in terms of ensuring features don’t break and security issues are patched as needed. It’s fine to put this off until you’re ready or simply start using L&L going forward without migrating any past work. Nothing prevents you from using both plugins on the same website.

How can I replace CCS if L&L can’t be placed everywhere?

Custom Content Shortcode had a single advantage over L&L, which is that WordPress natively parses shortcodes just about wherever you put them. This meant you could add your CCS code almost anywhere and it would work. L&L, on the other hand, is a templating language that extends HTML syntax and needs to be parsed by our plugin rather than the WP core. For that reason it only works in designated areas.

We include a special block in Gutenberg, a module in Beaver Builder & a widget in Elementor that allow you to write L&L code that will be parsed in your layout for any of those builders. If you were currently writing your CCS shortcodes in the post content area, you’d just have to break up the content before and after the CCS code and insert the L&L Gutenberg block between the two to swap out our CCS shortcodes.

Two "Tangible Template" blocks placed in Gutenberg, one using the inline editor and the other loading in a saved template.
The “Tangible Template” Block/Module/Widget can be used to insert L&L markup or load templates in Gutenberg, Beaver Builder or Elementor
The “Tangible Template” Block can be used to insert L&L markup or load templates in Gutenberg
The “Tangible Template” Widget can be used to insert L&L markup or load templates in Elementor
The “Tangible Template” Module can be used to insert L&L markup or load templates in Beaver Builder
If you don’t see the Tangible Templates module in Beaver Builder, make sure it’s enabled in your settings!

What if you’re a Gutenberg hold out? We get it, Gutenberg is a little polarizing. Luckily you can write your L&L code in a post type we call “templates” that you can then call in via a shortcode. This would also allow you to pull in any of your L&L creations into any page builder that can render shortcodes if ever it’s not one of the builders we officially support. You can even pass parameters to your shortcodes to change what they output!

For example, right here placing [template name="recommended-post" post_in="shortcodes-are-on-the-way-out" cta_text="Check this out!"] outputs the post with the matching slug, and the provided CTA text:

And placing [template name="recommended-post" post_in="377"] outputs the post with the matching ID and the fallback CTA set up for when none is provided:

While a quick workaround is now necessary to place your markup inline, L&L can be used in far more places than CCS ever could, you can now use it to build your entire site using layouts or even L&L-powered theme files in PHP!

CCS was so simple. Now I need to learn a templating language?

We’re all about taking what WP users already know and using it to give them superpowers. Shortcodes were pretty ubiquitous back in the day and early page builders largely just output a mess of shortcodes, so it made a lot of sense to leverage that.

Nowadays, new WP users may never have seen a shortcode so it’s not as reasonable to expect people to instinctively get it. The next best thing in our estimation is to leverage people’s understanding of HTML. Far more people know about HTML than about shortcodes, which makes L&L approachable even to people coming from outside the WordPress world.

There are a lot of templating languages out there like Blade and Twig, and while they are more approachable than learning PHP, they do require learning a whole new syntax and won’t get you up and running instantly the way Custom Content Shortcode did. To remove the barrier to entry, L&L just looks like regular HTML and going from CCS to L&L syntax is almost as simple as swapping the “[ ]” for “< >”. Instead of using new symbols to differentiate L&L markup from the surrounding HTML, you simply capitalize the first letter for your HTML tag.

That sounds good, but what does it look like in practice?

Let’s start by taking the example loop from the CCS documentation:

[loop type=post count=5]
  [field title]
  [field date]
  [field excerpt]
[/loop]

Here’s what that would look like in L&L:

<Loop type=post count=5>
  <Field title />
  <Field publish_date />
  <Field excerpt />
</Loop>

Not too scary! As you can guess, the ability to have this markup directly in an HTML template means you can combine standard HTML tags with the L&L markup so that you have complete control over the layout and look of the output.

Now here’s something you can do in L&L that would be impossible with shortcodes:

  <Set name=current_page_id><Field id /></Set>
  <If field=ancestors>
    <Loop field=ancestors reverse=true>
      <Set name=current_page_siblings><Field children_ids /></Set>
    </Loop>
  </If>

  <If loop type=page include="{Get name=current_page_siblings}">
    <h2>Keep exploring this section</h2>
    <ul>
      <Loop type=page include="{Get name=current_page_siblings}">
        <li>
          <a href="{Field url}">
            <If check="{Get current_page_id}" value="{Field id}">Current! </If><Field title />
          </a>
        </li>
      </Loop>
    </ul>
  </If>

Breaking free from shortcodes means loops can easily be nested and inherit their parent context. It also means that we can pass variables to our tags (you can’t safely do [tag attribute=[another-tag]] with shortcodes).

What else can L&L do that CCS can’t?

Loops & Logic allows you to apply entire layouts written in L&L as theme templates as well as template parts (for Kadence & Astra). That means that you can completely replace any post/taxonomy/archive template with L&L, as well as the headers, footers & sidebars of compatible themes.

Selection a location to use a Loops & Logic Layout

Loops & Logic templates & layouts come with additional tabs for adding CSS, JS and assets to give you more control and portability. With the import/export functionality you can take your L&L templates with you from site to site and easily update all instances of a template on a site from one place. It also makes it much easier for us to eventually provide libraries of templates people can use as a starting point.

Assembling a package for export with the Loops & Logic Import/Export tool

The Styles & Scripts post types allow you to apply your styles and scripts to your site as a whole or specific areas using our rule builder. This opens up a lot of possibilities in terms of choosing whether to bundle your CSS/JS with your templates for maximum portability or to keep them separate so that your templates inherit the unique styles of each site you work on.

The ability to use SASS in any of our style areas also means that you can pass L&L variables to your stylesheet using SASS variables.

Where CCS was limited in scope to being used inline with content, L&L can be used to control virtually any part of your website.

What difficulties should I expect when moving from CCS?

L&L is designed to be significantly more flexible and abstracted than CCS, which means that while you can accomplish a lot more with it, things that had very friendly shortcuts in CCS may seem more difficult in L&L at first.

For example, in CCS, you could use [field title-link] which would output an anchor tag with an href pointing to the post URL enclosed around the title of the post. If you learned a lot of additional shortcode parameters unique to CCS, you could also add a class, alt text, etc.

In L&L, instead of needing to learn special shorthand for all the various HTML tag attributes you might need, you simply write the HTML output you want to see directly and drop in L&L variables as needed. This also means that while CCS needs to explicitly support each possible HTML feature you might want by implementing shortcodes and parameters for each one, Loops & Logic simply puts the entire power of HTML at your disposal out of the box.

Here’s an example of creating a link to a post that displays the post title with a custom class in Custom Content Shortcode:

[field title-link class="my-custom-class"]

Here’s what you would do in L&L to achieve the same thing:

<a href="{Field url}" class="my-custom-class"><Field title /></a>

While the Custom Content Shortcode syntax may seem simpler, you’re also losing visibility and control into what’s really happening.

It’s difficult for a CCS user to understand exactly how their shortcodes will translate to HTML output (especially when you consider all the filters WP applies to shortcodes). By contrast in L&L, you can more easily copy-paste HTML/CSS/JS from around the web (like from cool Codepen projects!), swap out some variables to integrate it with WP data, and get exactly the output you expect.

Another major difference between the two systems is how L&L handles loop contexts. While CCS allowed you to address variables such as the current user’s meta with simple shorthand like [user email], L&L much more closely matches the way WordPress actually works behind the scenes. Fetching data for the main query (the current post the L&L markup is on) functions much like CCS did, but as soon as you’re opening up a new query loop you actually have to write a new loop in L&L.

That means that the [user email] shorthand becomes the more complex markup below:

<Loop type=user id=current>
  <Field email />
</Loop>

While this may seem like a lot of extra work to fetch one field, it’s much more representative of what’s happening behind the scenes. Part of the intent and outcome of this syntax is that you can easily see all the loops you’re opening on the page. If you placed [user name], [user email] & [user archive-link] on the same page, you’re effectively opening up three separate queries. L&L forces you to see that you’re opening a loop and nudges you towards a more efficient query that fetches all 3 datapoints in one go:

<Loop type=user id=current>
  <Field name />
  <Field email />
  <Field archive_url />
</Loop>

Another difference you’ll see in the example above is that the L&L syntax to get the link to the user’s author page in CCS is “archive-link” while Loops & Logic uses “archive_url”. In general, the intent is to more closely match the way things are named in WP code rather than using names that may feel more human-friendly. These changes may make things less intuitive for those that had memorized what CCS calls things, but it’s much more intuitive for people that have a background in working with WP without CCS. It also turns L&L into a better teaching tool for those dipping their toes into WP development, since what you learn in L&L more directly translates into knowledge of how both WordPress and PHP work.

Since L&L also lends it self particularly well to nesting loops and passing data between different loop contexts, having syntax that makes it very clear which loop context you’re in throughout your entire code is important.

We will certainly consider adding some shorthand options akin to those that existed in Custom Content Shortcode in the future, but in the short term our focus is matching the way WP works at a lower level so that people can have full control and visibility into what’s really happening (and so those not familiar with CCS can more intuitively guess L&L syntax). If and when we do implement shortcuts, we want to do so in a way that doesn’t encourage bad habits or foster incorrect intuitions.

We think L&L will make you a better developer!

What’s next for L&L?

The upcoming pro upgrade for L&L is going to add ways to incorporate data from the following plugins at launch (with more to follow!):

  • WooCommerce
  • WooCommerce Subscriptions
  • WooCommerce Memberships
  • Teams for WooCommerce Memberships
  • Easy Digital Downloads (EDD)
  • The Events Calendar
  • Gravity Forms
  • LearnDash
  • LifterLMS

We also plan to implement an easier way to save your templates to a personal cloud so you can share your L&L snippets between your sites as well as obtain snippets from a public cloud.

How can I stay in the loop?

Participating on our forum is one of the best ways to stay in touch and see what others are doing. You can also sign up for our newsletter here:

Leave a Reply

Your email address will not be published.