stephpolinar

<!-- Metafield list -->
{%- liquid 
  assign image_key = section.settings.image | downcase | replace: " ","_"
  assign image = article.metafields.my_fields[image_key].value
  
  assign title_key = section.settings.title | downcase | replace: " ","_"
  assign title = article.metafields.my_fields[title_key]

  assign text_key = section.settings.text | downcase | replace: " ","_"
  assign text = article.metafields.my_fields[text_key]

stephpolinar

<!--
  This is assuming that the paragraphs you want to truncate are enclosed in a span tag with ID="more" 
  (e.g. Less collection description here... <span id="more">More collection description here...</span>)
-->

<!-- CSS -->
<style>
#more {
  display: none;
}

stephpolinar

<!--
  Section is added above the header section (in the customiser) AND 
  {% section 'image-preloader' %} is also added in the theme.liquid file just above the </head> tag.
-->

{% comment %} Product Page {% endcomment %}
{%- if section.settings.main_product -%}
    {%- if template.name == 'product' and product -%}
        {%- assign image = product.featured_image -%}
        <link 

stephpolinar

{% comment %}
  If the user is planning to have long collection descriptions, they would just have to add <!-- Read More-->
  at the top of the paragraph(s) that they want to be included in the "more" section of the description.
{% endcomment %}

{% assign truncated_description = collection.description | split: '<!-- Read More -->' | first %}
{% assign rest_of_description = collection.description | split: '<!-- Read More -->' | last %}

<div class="page-width">