How can I add a 'read more' link in this code?

Store Design
1

Hi Guys,

Can anyone help me add in a “read more” text link in the code below, thanks!

{%- assign blog = blogs[section.settings.blog] -%}

  

    
    

    {% if section.settings.title != blank %}
      
    {% endif %}

    {% unless blog.empty? or blog.articles.size == 0 %}

      
        {% for article in blog.articles limit: section.settings.post_limit %}
          

            {%- render 'article-grid-item',
              article: article,
              image_size: section.settings.blog_image_size,
              show_excerpt: section.settings.blog_show_excerpt,
              show_author: section.settings.blog_show_author,
              show_date: section.settings.blog_show_date,
              show_comments: section.settings.blog_show_comments,
              show_tags: section.settings.blog_show_tags -%}
          

        {% endfor %}
      

    {% else %}

      
        {% for i in (1..3) %}
          

            
          

        {% endfor %}
      

    {% endunless %}

  

{% schema %}
  {
    "name": "Blog posts",
    "settings": [
      {
        "type": "text",
        "id": "title",
        "label": "Heading",
        "default": "Blog posts"
      },
      {
        "id": "blog",
        "type": "blog",
        "label": "Blog"
      },
      {
        "type": "range",
        "id": "post_limit",
        "label": "Posts",
        "default": 3,
        "min": 3,
        "max": 12,
        "step": 3
      },
      {
        "type": "checkbox",
        "id": "blog_show_tags",
        "label": "Show tags"
      },
      {
        "type": "checkbox",
        "id": "blog_show_date",
        "label": "Show date",
        "default": true
      },
      {
        "type": "checkbox",
        "id": "blog_show_comments",
        "label": "Show comment count"
      },
      {
        "type": "checkbox",
        "id": "blog_show_author",
        "label": "Show author"
      },
      {
        "type": "checkbox",
        "id": "blog_show_excerpt",
        "label": "Show excerpt"
      },
      {
        "type": "select",
        "id": "blog_image_size",
        "label": "Image size",
        "default": "wide",
        "options": [
          {
            "value": "natural",
            "label": "Natural"
          },
          {
            "value": "square",
            "label": "Square (1:1)"
          },
          {
            "value": "landscape",
            "label": "Landscape (4:3)"
          },
          {
            "value": "portrait",
            "label": "Portrait (2:3)"
          },
          {
            "value": "wide",
            "label": "Wide (16:9)"
          }
        ]
      },
      {
        "type": "checkbox",
        "id": "view_all",
        "label": "Show 'View all' button",
        "default": true
      },
      {
        "type": "checkbox",
        "id": "alt",
        "label": "Use alternate section color"
      }
    ],
    "presets": [
      {
        "name": "Blog posts",
        "category": "Blog",
        "settings": {
          "blog": "News",
          "post_limit": 3
        }
      }
    ]
  }
{% endschema %}
2

Hi Jamescox1981,

Depending on where you wanted the button the following code would work. As long as it is contained inside the for loop: {% for article in blog.articles limit: section.settings.post_limit %}

 Read More

Let me know and I can troubleshoot further.

Thank you,

Kyle Kopelke

3

Hi, yes i figured this one out and placed the link where you suggested with a div id which i was then able to style.

Thanks for the reply!

1 Like