Add module to blog listing template

[aldwey]

I created a custom module that's being used in the blog post template.

The module is called "Category" and allows a user to enter text into field.

I tried to use this module in the blog listing template, but instead of displaying the category entered, it only displays "Category".

How can I make this work?

Here is the module code:
<a href="http://blog.indiewalls.com/test-hubspotsupport/tag/{{ module.category }}">{% inline_text field="category" value="{{ module.category }}" %}</a>

Along with the usage snippet:
{% module "module_1558045840165535" path="/Category" %}

Here is the code in the blog listing template:

<div class="PostMainContent blogListingcolumn3">
<div>
{% module "module_15580422318786376" path="/Category" %}
</div>

Here's the link to the page:
http://blog.indiewalls.com/test-hubspotsupport

[lscanlan · Accepted solution]

Hi @aldwey,

So I think you've gotten this figured out since you posted? But I figure it could be useful to add a response in case other people find this thread running into the same issue. So you've got the module itself added to the blog template, which gives the blog author the ability to edit that module for each post in the blog post editor.

But within the blog content module's listing template where you can create the logic for printing into the HTML document, you were actually re-creating the module. Since the module already exists, all we really want is to grab the value created by the blog post's author, and then print that value into the HTML. I've got a few samples written up doing similar things here: https://community.hubspot.com/t5/Share-Your-Work/How-to-Create-Custom-Blog-Post-Summaries-for-Blog-L... and here: https://community.hubspot.com/t5/Share-Your-Work/How-to-add-Featured-Video-functionality-to-a-blog/m....

So all of the module data will get stored in a "dict" that can be accessed through HubL. So if you were for example looping through the posts on your listing page with a loop like: {% for content in contents %} , then each post is represented in its loop iteration by the variable "content". The dict for the module data is "widgets". So for each post, you can access its module data by doing another loop like: {% for module in content.widgets %} . Altogether:

{# loop through blog posts #}
{% for content in contents %}

  {# loop through a blog post's modules #}
  {% for module in content.widgets %}

  {% endfor %} {# end for module in content.widgets #}

{% endfor %} {# end for content in contents #}

And then it's just a matter of identifying the module that you're looking for. In my last example I used "module_id": {% if module.module_id == "XXXX" %} . And when you find the module you're looking for, you print the value you need into the HTML.

Let me know if you have other questions here, but it looks like you've already got it figured out.

 - Leland

[lscanlan · Accepted solution]

Hi @aldwey,

So I think you've gotten this figured out since you posted? But I figure it could be useful to add a response in case other people find this thread running into the same issue. So you've got the module itself added to the blog template, which gives the blog author the ability to edit that module for each post in the blog post editor.

But within the blog content module's listing template where you can create the logic for printing into the HTML document, you were actually re-creating the module. Since the module already exists, all we really want is to grab the value created by the blog post's author, and then print that value into the HTML. I've got a few samples written up doing similar things here: https://community.hubspot.com/t5/Share-Your-Work/How-to-Create-Custom-Blog-Post-Summaries-for-Blog-L... and here: https://community.hubspot.com/t5/Share-Your-Work/How-to-add-Featured-Video-functionality-to-a-blog/m....

So all of the module data will get stored in a "dict" that can be accessed through HubL. So if you were for example looping through the posts on your listing page with a loop like: {% for content in contents %} , then each post is represented in its loop iteration by the variable "content". The dict for the module data is "widgets". So for each post, you can access its module data by doing another loop like: {% for module in content.widgets %} . Altogether:

{# loop through blog posts #}
{% for content in contents %}

  {# loop through a blog post's modules #}
  {% for module in content.widgets %}

  {% endfor %} {# end for module in content.widgets #}

{% endfor %} {# end for content in contents #}

And then it's just a matter of identifying the module that you're looking for. In my last example I used "module_id": {% if module.module_id == "XXXX" %} . And when you find the module you're looking for, you print the value you need into the HTML.

Let me know if you have other questions here, but it looks like you've already got it figured out.

 - Leland

[victorwu]

i've a question about using a blog post module to load on the blog's listing page

use individual post date and multiple-choice volume.  show each different output to the listing page.

blog post's local module:

listing page template:

please help me figure out how can show the correct volume. 

Thank you.

[aldwey · Accepted solution]

Thanks Leland! Your solution is very helpful!

Here's the code that worked:

{% for content in contents %}

<div>
<div class="feature-category">

{% for module_item in content.widgets %}

{# the name of this particular module is "Category" #}

{% if module_item.body.widget_name == "Category" %}

<a href="http://blog.indiewalls.com/test-hubspotsupport/tag/{{module_item.body.category }}">{{module_item.body.category }}</a>

{% endif %}

{% endfor %}

</div>

{% endfor %}