CODEWITHSUNDEEP
shopifyliquid
datasn.io
datasn.io

Reputation: 12867

Load content of a specific page in Liquid?

We have some very large articles (HTML content) as long as 2000 words that need to be loaded and displayed at an arbitrary place in the Shopify theme, for example, at the bottom of a specific collection.

For now, we are saving them as snippets .liquid files that are conditionally loaded at the bottom of the collection template by:

{% if collection.handle == 'collection-abc' %}
  Article 1 HTML goes here...
{% elsif collection.handle == 'collection-def' %}
  Article 2 HTML goes here...
{% endif %}

Is it possible to here load the content of a specific page by handle? So it's easier for our editors and writers to work in the Shopify page editor otherwise we have to give them permission to edit theme code which isn't ideal in many ways.

Neither is creating a theme section helpful here since the content is too long to be comfortably edited in the theme customizer. It's not secure either as the writer will have access to theme customization.

Is there any better way & intended way to achieve this?

Upvotes: 0

Views: 3522

Answers (1)

cMarius
cMarius

Reputation: 1132

There are multiple ways to achieve this behavior.

  1. Use Blog Posts (Online Store -> Blog Posts), and make sure the article has the same handle as the corresponding collection, then get article content inside the collection template like this (we're using "news" as the blog title in this example):
{% for article in blogs["news"].articles %}
  {% if article.handle contains collection.handle %}
    {{ article.content }}
  {% endif %}
{% endfor %}
  1. Use Pages (Online Store -> Pages), and make sure the page has the same handle as the corresponding collection, then get the page content inside the collection template like this:
{{ pages[collection.handle].content }}
  1. Use collection descriptions. In Products -> Collections you can add your content in the description field, and access it in collections like this:
{{ collection.description }}

Upvotes: 2

Related Questions