Return certain number of blog posts in two sets

SOLVE
mdenning
Participant

Hi, when coding my blog template I'm wondering what's the best way to return 5 blog posts, then a regular text block, followed by the next 5 post in chronological order? 

 

Basically I'm pulling in 10 posts in the top half but using "display:none" to hide posts 6, 7, 8, 9, 10. After that, I have the the text block "Let us help you do more", followed by another set of 10 blog posts but hiding posts 1, 2, 3, 4, 5 this time.

 

This way seems a bit "hacky" and not great for accessibility so if anyone can think of alternative ways to accomplish this that would be much appreciated. Thanks!

0 Upvotes
1 Accepted solution

Accepted Solutions
josh_dev
Solution
Contributor

If you want to add a text block, just choose the index of your loop and add an if statement. You may need to change the 10 you're pulling in to 11.

 

 

 

{% if loop.index == 6 %}
  ADD YOUR TEXT BLOCK 
{% endif %}

 

 

Joshua Todd | CEO of Pixl Labs  

👉www.pixllabs.io 

View solution in original post

3 Replies 3
josh_dev
Solution
Contributor

If you want to add a text block, just choose the index of your loop and add an if statement. You may need to change the 10 you're pulling in to 11.

 

 

 

{% if loop.index == 6 %}
  ADD YOUR TEXT BLOCK 
{% endif %}

 

 

Joshua Todd | CEO of Pixl Labs  

👉www.pixllabs.io 

View solution in original post

mdenning
Participant

Hi @josh_dev, appreciate the reply that's exactly what I was looking for.

 

Now if I wanted to pull my text block (below) into the code to add in that loop, how would I go about doing that?Capture.PNG Basically I need this text block to be editable for the content team but it needs to be inserted in the code at that 6th spot in the loop. Thanks!

0 Upvotes
josh_dev
Contributor

I'd recommend creating a custom module for them instead. 
Make the text block into fields on the module.

https://developers.hubspot.com/docs/cms/building-blocks/modules

Hope that helps!


Joshua Todd | CEO of Pixl Labs
 👉www.pixllabs.io