Add a custom blog author bio to the bottom of your blog posts

[kdmeg]

Adding the blog author's bio to the bottom of your blog posts involves changing some HTML within your blog template. If you don't have experience with code, work with a designer to ensure that all edits are made correctly.

If you're comfortable working with HTML yourself, you can add the following code to your HTML blog template after the content.post_body tag:

<p id="hubspot-author_data" class="hubspot-editable" data-hubspot-form-id="author_data" data-hubspot-name="Blog Author" >

<span class="hs-author-label">Posted by</span>

<a class="author-link" href="{{ group.absolute_url }}/author/{{ content.blog_post_author.slug }}">{{ content.blog_post_author.display_name }}</a>

{% if content.blog_post_author.avatar %} <div class="hs-author-avatar"> <img width="35 px" src="{{ content.blog_post_author.avatar }}"> </div> {% endif %}
 <p>{{ content.blog_post_author.bio }}</p>

<a href="{{ content.blog_post_author.facebook }}" target="_blank" class="hs-author-social-link hs-social-facebook">Facebook </a>

<a href="{{ content.blog_post_author.linkedin }}" target="_blank" class="hs-author-social-link hs-social-linkedin">LinkedIn</a>

<a href="{{ content.blog_post_author.twitter }}" target="_blank" class="hs-author-social-link hs-social-twitter">Twitter </a>

<p> <a href="{{ content.blog_post_author.website }}" target="_blank">Website</a></p> 

 Alternatively, you can purchase an HTML template from the marketplace and add the code that way. 

[McKenzie97]

Hi there, 

Thank you for sharing this code. For the code to pull the authour blog bio's information, do we need to input all of the bio's into hubspot first?

Thanks,

McKenzie 

[jennysowyrda]

Thanks for sharing @kdmeg!