Blog Posts not displaying on Live site

[TPasic]

Hi there,

Would appreciate if anyone got a minute to spare.

So I’ve got a page where I want to display some recent post by tags. While it works on my staging website, when I send my changes to production, the posts are not showing

Has anyone tackled with this issue before ?
Btw I’m trying to display those posts on Page template, not a blog/blog_listing template. They show nicely without any issues, until it’s on production.

 {% set tag_posts = blog_recent_tag_posts("default", ["category-customer-stories"], 6) %}
 {% for tag_post in tag_posts %}

 <div class="flex flex-col customer-card"> 
 <div class="customer-card-content">
 {% if tag_post.featured_image %}
 <a class="block" href="/blog/{{ tag_post.slug }}">
 <img class="aspect-video w-full object-cover rounded-lg" src="{{ tag_post.featured_image }}" alt="{{ tag_post.featured_image_alt_text }}" loading="lazy">
 </a>
 {% endif %}
 <div class="mt-5">
 <div class="md:overflow-ellipsis md:overflow-hidden md:whitespace-nowrap">
 <a href="#" class="text-sm font-semibold uppercase whitespace-nowrap text-gray-400 hover:no-underline hover:text-blue-500">Customer Stories</a>
 </div>

 </div>
 <div class="mt-0">
 <a class="mt-1 block hover:no-underline" href="/blog/{{ tag_post.slug }}">
 <h3 class="mb-0 line-clamp-2 hover:text-gray-600 transition-colors duration-150 ease-out">{{ tag_post.name }}</h3>
 </a>
 </div>
 <a class="mt-1 block hover:no-underline" href="/blog/{{ tag_post.slug }}">
 <h3 class="mt-4 mb-4 button button-link large water">Read Story</h3>
 </a>

 </div>

 </div>
 {% endfor %}

[ankitparmar09]

Hello @TPasic
Thanks for reaching out. I have modified the code. You can use it.

{% set tag_posts = blog_recent_tag_posts("default", module.select_tag, 6) %}{% for tag_post in tag_posts %}<div class="flex flex-col customer-card"> <div class="customer-card-content">{% if tag_post.featured_image %}<a class="block" href="/blog/{{ tag_post.slug }}"><img class="aspect-video w-full object-cover rounded-lg" src="{{ tag_post.featured_image }}" alt="{{ tag_post.featured_image_alt_text }}" loading="lazy"></a>{% endif %}<div class="mt-5"><div class="md:overflow-ellipsis md:overflow-hidden md:whitespace-nowrap"><a href="https://vaadin.com/blog/tag/category-customer-stories" class="text-sm font-semibold uppercase whitespace-nowrap text-gray-400 hover:no-underline hover:text-blue-500">Customer Stories</a></div></div><div class="mt-0"><a class="mt-1 block hover:no-underline" href="/blog/{{ tag_post.slug }}"><h3 class="mb-0 line-clamp-2 hover:text-gray-600 transition-colors duration-150 ease-out">{{ tag_post.name }}</h3></a></div><a class="mt-1 block hover:no-underline" href="/blog/{{ tag_post.slug }}"><h3 class="mt-4 mb-4 button button-link large water">Read Story</h3></a></div></div>{% endfor %}

Use field - Tag

[TPasic]

Thank you @ankitparmar09 . I will try this out and let you know if it works!

[ankitparmar09]

Sure thing

[TPasic]

So I’ve updated module file in order for users to select tag/number of posts

{% set tag_posts = blog_recent_tag_posts("default", module.select_tag, module.posts_per_page) %}
{% for tag_post in tag_posts %}
<div class="flex flex-col customer-card"> 
<div class="customer-card-content">
{% if tag_post.featured_image %}
<a class="block" href="/blog/{{ tag_post.slug }}">
<img class="aspect-video w-full object-cover rounded-lg" src="{{ tag_post.featured_image }}" alt="{{ tag_post.featured_image_alt_text }}" loading="lazy">
</a>
{% endif %}
<div class="mt-5">
<div class="md:overflow-ellipsis md:overflow-hidden md:whitespace-nowrap">
<a href="#" class="text-sm font-semibold uppercase whitespace-nowrap text-gray-400 hover:no-underline hover:text-blue-500">Customer Stories</a>
</div>
</div>
<div class="mt-0">
<a class="mt-1 block hover:no-underline" href="/blog/{{ tag_post.slug }}">
<h3 class="mb-0 line-clamp-2 hover:text-gray-600 transition-colors duration-150 ease-out">{{ tag_post.name }}</h3>
</a>
</div>
<a class="mt-1 block hover:no-underline" href="/blog/{{ tag_post.slug }}">
<h3 class="mt-4 mb-4 button button-link large water">Read Story</h3>
</a>
</div>
</div>
{% endfor %}

And in the module fields.json file I’ve added two fields for user to select blog post number/tag name

[
 {
 "label": "Blog Posts Per Page",
 "name": "posts_per_page",
 "type": "choice",
 "display": "select",
 "choices": [
 ["2", "2"],
 ["3", "3"],
 ["4", "4"],
 ["5", "5"],
 ["6", "6"],
 ["7", "7"],
 ["8", "8"],
 ["9", "9"]
 ],
 "default": "6",
 "required": true
 },
 {
 "label": "Choose Posts Tag",
 "name": "select_tag",
 "type": "choice",
 "display": "select",
 "choices": [
 ["category-customer-stories", "Customer Stories"]

 ],
 "default": "category-customer-stories",
 "required": true
 }
 ]

Still doesn’t show posts, should tag field in Json file be different than what I made it ? IS there a Hubspot field for tag that can grab all tags atuamatically ?

[TPasic]

I finally managed to make it work Thank you very much for your help

[hadvisor]

Can i use this code n my website to provide services