Adding a custom datetime field to a blog post and accessing from blog listing

[DCardinal3]

I am attempting to use the Blog as both a blog, but also to use it for an events listing page. All I really need is to add two custom fields for these events, datetime and location, and then to access the datetime field from the Blog Listing template so that events can be listed in order of the event date, rather than the creation date of the post.

So I created a custom module called eventDetails which I can access when creating a Blog Post by clicking the 'add' button and it all works as expected:

However, once this has been added to a Blog Post, I cannot seem to pull the data on my blog listing template, like so (solution pulled from here ) :

{% for module in contents.widgets %}
  {% if module.module_id === "XYZ" %}
    {# Handle module content here #}
  {% endif % }
{% endfor %}

Obviously I've replaced XYZ with the actual module_id. And I've tested if this is working at all by doing the following:

{% for module in contents.widgets %}
  {% if module.module_id === "XYZ" %}
    <p>Test</p>
  {% endif % }
{% endfor %}

However, the <p> never appears on the page, so it doesn't seem that the module is available at all on the blog listing.

I'm sure I'm missing something obvious here, but I could use a hand!

[Anton · Accepted solution]

Hi @DCardinal3, 

Since you've already created a custom module, make sure to add the export_to_template_context  function to the module code in the template. Also check out the docs about retrieving parameters from modules. Those options will let you access the module data from the template(s).

Two additional notes:

- If your module doesn't have a repeater the "for X in module.Y" wrap is unnecessary

- You can add something like this to the module so your marketers/page-editors don't forget about it:

{% if is_in_page_editor %}
{% require_css %}
<style>
.page-editor-box{
width: 80%;
    margin: 0 auto;
    background: #ccc;
    color: #222;
    padding: 4rem;
    display: flex;
    jusitfy-content: center;
    align-items: center;
    border-radius: 1rem;}
</style>
{% end_require_css %}
<div class="page-editor-box"><strong>Click here for event settings</strong></div>
{% endif %}

My recommendation for this is to put this module above the {{content.post_body}} module. 

hope that helps, 

best, 

Anton

[DCardinal3]

Hey Anton, thanks for taking the time to reply and for all the information!

I'm not sure if I understand exactly where I'm supposed to be placing the export_to_template_context. From reading the article I believe I need to place the module code directly into the Blog Post template, and using the export function it will make the modules data available to the Blog Listing template, is that correct?

I tried doing the above based on my assumption, however I ran into an error when adding the module code to the Blog Post template (blog-post.html) like so:

<div>
  {% module "module_XYZ" path="/my-website-theme/modules/eventDetails", label="eventDetails", export_to_template_context=True %}
</div>
<div class="blog-post__body">
  {{ content.post_body }}
</div>

The error message I see in my IDE is:

line 1: Syntax error in '{% module_block module "widget_XYZ" %}': Missing end tag: end_module_block for tag defined as: {% module_block module "widget_XYZ" %}

Though from my understanding I don't need an end tag for this type of module declaration?

And the error message is different when I try to implement the change directly in the HS Design Manager:

However, I copied the code for the module directly from the Design Manager under "Template Usage" in the right-hand bar so I'm not sure why it couldn't be found?

Again I'm sure I'm missing something obvious here, I would really appreciate any further insight you might have!

[DCardinal3]

I think I figured it out. So the documentation for export_to_template_context shows that you should be using commas between the various parameters of the module, like so:

{% module "module_name" path="path/to/module", export_to_template_context=True %}

However, when I did this, I would receive an error that the module cannot be found (as mentioned in my previous post). What I've found is that if I don't use a comma, it won't throw the error, and the module will be added to the template as expected, with the module data available on the blog listing page:

{% module "module_name" path="path/to/module" export_to_template_context=True %}

I have no idea why this works, but I'm glad it does! I am now able to retrieve the module details in the blog listing template, thanks again for all the help @Anton, your info pointed me in the right direction!

[Jaycee_Lewis]

Hi, @DCardinal3 👋 Welcome to our community! I wonder if HubDB might be a better fit for your goal. You could create a HubDB table for your events, with columns for the datetime, location, and a reference to the blog post ID. This table can then be queried on the blog listing page to display the event details.

Hey @jonchim @HFisher7 @ChrisoKlepke, do you have any tips you can share with @DCardinal3?

Thank you very much! — Jaycee

[DCardinal3]

Using the HubDB but linking it to the blog posts through an ID is an interesting idea, I'll definitely take a look at that if I can't get the initial solution working, thanks for the suggestion and for taking the time to reply!