Add Blog to homepage

launchpadlaunchpad Member Posts: 8

Hey everyone!

I am new to lightspeed and I honestly find the docs don't do a good job giving specific examples on how to loop in things in .rain.

Just a bit of background on me, I am a front end developer. I am used to working with wordpress, shopify, webflow etc. I know html, css very well and I can read things like liquid, php etc to usually figure out how to style them.

First thing I'm trying to accomplish (and I feel like once I get this the rest will fall into place) is I'd like to add featured blog posts (or latest blog posts) to the homepage.


I have a snippet on my index that I got from a tutorial. I think maybe I misunderstood what this is supposed to do. I attached a screenshot of what I"m trying to accomplish. (I realize none of the snippet is formatted but as it is I'm not getting anything)


      {% include 'snippets/customblog.rain' %}


on that snippet I have


{# snippets/customblog.rain #}

<div class="container max-width-lg">

<h1 class="yellow">Our<br>Podcast</h1>

 <!-- Basic blog info -->

<h1>{{ blog.title | t }}</h1>


<!-- Get the most recent articles but limit by 2 -->

{% for article in blog.recent | limit(1) %}

 {{ article.title }}

{% endfor %}


<!-- Get all the tags related to this blog -->

{% for tag in blog.tags %}

 {{ tag.url }} {{ tag.title }} {{ tag.count }}

{% endfor %}


<!-- Get the blog articles -->

{% for article in blog.articles %}

 {{ article.title }}

 {{ article.url }}

 {{ article.image | url_image }}

 {{ article.summary | limit(100) }}

 {% for tag in article.tags %}{{ tag.title }}{% endfor %}

{% endfor %}

</div>

5 comments

  • JanneDeVosJanneDeVos Member Posts: 41

    Hi @launchpad,

    Have you seen the developer toolbar? It makes building themes a lot easier.

  • launchpadlaunchpad Member Posts: 8

    I did but I'm not entirely sure how to use it. It's a little overwhelming, I see no reference to anything blog related. I'm likely missing the point of it.

    For example say I wanted to add a featured product to the homepage and I look in the developer tool bar I see something that say "featured" then it says 1,2,3,4,5,6, but i have no idea what this means and how to apply to any sort of code.


    I'm just surprised that there are no docs showing live examples of how to do super common things. I feel like my blog layout is something extremely common. I"m not looking to re-invent the wheel here.

  • launchpadlaunchpad Member Posts: 8

    I also feel like the docs do nothing to explain how to use something like this. The docs are not helping me at all here. They are extremely poorly thought out

  • JanneDeVosJanneDeVos Member Posts: 41

    Can you try this:

    <div>

      {% for article in shop.blogs.blog.articles %}

      <div>

        <a href="{{ article.url }}">

          <div>

            <img src="{{ article.image | url_image('50x50x1', article.title) }}">

            <div>

              {{ article.title }}

            </div>

          </div>

        </a>

      </div>

      {% endfor %}

    </div>

  • launchpadlaunchpad Member Posts: 8

    Is there a way to choose what category of blog you want to display? Also is there a way to display 3 blog articles? I might have a developer come help me. Lightspeed is way too messy for me to learn on the go like this.

Sign In or Register to comment.