Blog all posts

New Contributor

hi,  looking for a better view for my blog when someone selects 'view all posts'
currently, I get a very bland list of the blogs that do not look professional.

Screen Shot 2018-12-04 at 21.39.21.png

 

 

Looking for either a thumbnail image to the left or right with the title and a separator between each blog

 

any ideas welcome

thanks,

 

Reply
0 Upvotes
6 Replies 6
Community Manager

Hi @markdunham,

 

Do you mind sharing a link to your blog page, along with any styling options you've tried so far? 

 

Depending on what you've tried, your level of coding experience, and how your blog is currently set up will determine next best steps.

 

Thanks,
Jenny


Did my post help answer your query? Help the Community by marking it as a solution
Reply
0 Upvotes
New Contributor

Hi, thanks for replying to my post.


here's the link to the 'All Posts'  - https://insights.intuityconsulting.com.au/all 

 

I'd prefer it to be like this standard listing and just click to next page - link to normal layout -> https://insights.intuityconsulting.com.au/ 

 

Or having the featured pic and the headline next to it.

 

I've not tried anything really.  and my coding experience is low, but happy to try and give it a go :-)

 

thanks,

Mark

Reply
0 Upvotes
HubSpot Moderator

Hey @markdunham! for starters, this looks like a template that our Migration Techs built out. You can tell this by going here to check out your blog template: https://app.hubspot.com/beta-design-manager/4927199/templates/6439020800. The blog follows the naming convention "CompanyName_MonthYear" which is how our techs name all Template Setups or Migration projects. This means you should be able to file a Support Ticket and a support rep skilled with design should be able to help you out.

 

That said, a bit about the "all posts" section. The all posts button comes default on all blogs that use our default blog template. Our migration techs deliver that default template if a blog template was not specified for us to copy over during a template setup or migration. Currently, your blog does use our default template, which is why the all posts button is there. It's meant to deliver a list of all posts written, which is why its simple in nature. Some blogs can have hundreds of posts, and loading up all posts on that all posts page would take reaaaallly long so that page is defaulted to just the title.

 

Support isn't a good spot for custom design requests, as that's not really the scope of what Support can offer, but you could turn to a freelancer for specific design help.  That said, if you just want the all posts page to look the same as the normal blog layout at this url: https://insights.intuityconsulting.com.au/, you can simply click on the Blog Content Module > In the Right Sidebar click Edit listing template > then remove lines 34 and 66-68

Reply
0 Upvotes
New Contributor

thanks for this.   

 

here is the code for the post listings..    not sure the line numbers we're the original as a support person helped me remove a few from somewhere to get rid of comments.

 

 

 

<div class="blog-section">
<div class="blog-listing-wrapper cell-wrapper">
{# simple_list_page indicates the "blog/all" page, which is a list of links to every blog post #}
<div class="post-listing{% if simple_list_page %}-simple{% endif %}">
{% if blog_author %}
<div class="hs-author-profile">
<h2 class="hs-author-name">{{ blog_author.display_name }}</h2>
{% if blog_author.avatar %} <div class="hs-author-avatar"> <img src="{{ blog_author.avatar }}" alt="{{ blog_author.display_name }}"> </div> {% endif %}
<div class="hs-author-bio">{{ blog_author.bio }}</div>
{% if blog_author.has_social_profiles %}
<div class="hs-author-social-section">
<span class="hs-author-social-label">Find me on:</span>
<div class="hs-author-social-links">
{% if blog_author.facebook %}
<a href="{{ blog_author.facebook }}" target="_blank" class="hs-author-social-link hs-social-facebook">&nbsp;</a>
{% endif %}
{% if blog_author.linkedin %}
<a href="{{ blog_author.linkedin }}" target="_blank" class="hs-author-social-link hs-social-linkedin">&nbsp;</a>
{% endif %}
{% if blog_author.twitter %}
<a href="{{ blog_author.twitter }}" target="_blank" class="hs-author-social-link hs-social-twitter">&nbsp;</a>
{% endif %}
{% if blog_author.google_plus %}
<a href="{{ blog_author.google_plus }}?rel=author" target="_blank" class="hs-author-social-link hs-social-google-plus">&nbsp;</a>
{% endif %}
</div>
</div>
{% endif %}
</div>
<h3 class="hs-author-listing-header">Recent Posts</h3>
{% endif %}
{% for content in contents %}
<div class="post-item">
{% if not simple_list_page %}
<div class="post-header">
<h2><a href="{{content.absolute_url}}">{{ content.name }}</a></h2>
<div id="hubspot-author_data" class="hubspot-editable" data-hubspot-form-id="author_data" data-hubspot-name="Blog Author">
Posted by
{%if content.blog_post_author %}
<a class="author-link" href="{{ blog_author_url(group.id, content.blog_post_author.slug) }}">{{ content.blog_post_author.display_name }}</a> on {{ content.publish_date_localized }}
{% endif %}
</div>
{% blog_social_sharing "blog_social_sharing" overrideable=False, label='Blog Social Sharing' %}
</div>
<div class="post-body clearfix">
<!--post summary-->
{% if content.post_list_summary_featured_image %}
<div class="hs-featured-image-wrapper">
<a href="{{content.absolute_url}}" title="" class="hs-featured-image-link">
<img src="{{ content.post_list_summary_featured_image }}" class="hs-featured-image" alt="{{ content.featured_image_alt_text | escape }}">
</a>
</div>
{% endif %}
{{ content.post_list_content|safe }}
</div>
{% if content_group.show_summary_in_listing %}
<a class="more-link" href="{{ content.absolute_url }}">Read More</a>
{% endif %}
{% if content.topic_list %}
<p id="hubspot-topic_data"> Topics:
{% for topic in content.topic_list %}
<a class="topic-link" href="{{ blog_tag_url(group.id, topic.slug) }}">{{ topic.name }}</a>{% if not loop.last %},{% endif %}
{% endfor %}
</p>
{% endif %}
{% else %}
<h2 class="post-listing-simple"><a href="{{content.absolute_url}}">{{ content.name }}</a></h2>
{% endif %}
</div>
{% endfor %}
</div>
{% if not simple_list_page %}
<div class="blog-pagination">
{% if last_page_num %}
<a class="previous-posts-link" href="{{ blog_page_link(last_page_num) }}">Previous</a>
{% endif %}
<a class="all-posts-link" href="{{ blog_all_posts_url(group.id) }}">All posts</a>
{% if next_page_num %}
<a class="next-posts-link" href="{{ blog_page_link(next_page_num) }}">Next</a>
{% endif %}
</div>
{% endif %}
</div>
</div>

 

 

 

Reply
0 Upvotes
Highlighted
HubSpot Moderator

Yep! It'd be the same lines -- 34 and 66-68 that you should delete

Reply
0 Upvotes
HubSpot Moderator