How to Add Blog Post {{ content.name }} in Banner

Hello everyone,

I’m not a developer but know just enough CSS and HTML to screw things up so please treat me with kid gloves (and apologies if this question has been asked and answered before). I’m trying to change our blog posts so the title of the blog post ends up in a customizable “banner” area at the top of the blog post. From what I’ve been able to deduce, the field {{ content.name }} is what sets the title of the blog post and what is then referenced in the blog post list. I’ve tried creating a custom module for this and for the life of me, i can’t seem to make it work:

<div class="background-image" style="background-image: url('{{ module.blog_post_header_background_image.src }}')">
 <div class="blog_post_header_background_image_overlay" style="background:{{ module.blog_post_header_image_overlay_color }};"></div>
 <div class="page-center">
 <div class="header-text-section">
 <h1><span style="color:{{ module.headline_color }}; font-size:{{ module.headline_font_size }}em;">{{ content.name }}</span></h1>
 </div>
 </div>
</div>

Please help.

Thank you.

Dani

Hey Dani, instead of {{content.name}} you might try {{ post.name}}?
Here’s how I’m rendering post titles on a “related posts” section:

<div class="row-fluid">
 {% set max_posts = 3 %}{# Set the max number of related posts to be output to the page here #}
 {% set post_list = [] %}
 {% for topic in content.topic_list %}
 {% set post_list = post_list + blog_recent_topic_posts('default', topic.slug, max_posts + 1 ) %}
 {% if loop.last %}
 {% set post_list = post_list|sort(true, false, 'publish_date')|unique('name') %}
 {% set i = 0 %}
 {% for post in post_list %}
 {% if content.absolute_url != post.absolute_url and i < max_posts %}
 <div class="span4">
 <div class="relatedPostItem eqHeight">
 <div class="post-inner">
 <a href="{{post.absolute_url}}" class="abso-link"></a>
 <div class="feature-image-bg" style="background-image: url('{{ post.featured_image }}');">
 </div>
 <div class="post-item-content"> 
 <div class="post-header">
 <h2>
 <a href="{{post.absolute_url}}">{{ post.name}}</a>
 </h2>
 </div> 
 <em class="time-to-read">(<span class="eta"></span> read <span class="words hide" style=""></span>)</em>
 {% if post.tag_list %}
 <p id="hubspot-topic_data"> Topics: 
 {% for tag in content.topic_list %} 
 <a class="topic-link" href="{{ blog_tag_url(group.id, tag.slug) }}">{{ tag.name }}</a>{% if not loop.last %},{% endif %}
 {% endfor %}
 </p>
 {% endif %}
 </div>
 </div>
 </div>
 </div>
 {% set i = i + 1 %}
 {% endif %}
 {% endfor %}
 {% endif %}
 {% endfor %}
 </div>

Thank you much @Bryantworks — sorry for the late “thank you note”… this was very helpful.