Howe to Create Blog Categories Block with Count?

[sam_8599]

How to create a block on blog page and article page in the side bar and show the Blog Tile (Link) and (Count)?

[sam_8599]

Current code

{%- render 'section-blog-sidebar',
section: section,
blog: blog,
article: article,
section_blocks_size: section.blocks.size,
quick_add_enable: settings.quick_add_enable,
quick_shop_enable: settings.quick_shop_enable,
product_grid_image_size: settings.product_grid_image_size,
product_grid_image_fill: settings.product_grid_image_fill,
product_hover_image: settings.product_hover_image,
enable_swatches: settings.enable_swatches,
vendor_enable: settings.vendor_enable,
product_save_amount: settings.product_save_amount,
product_save_type: settings.product_save_type,
superscript_decimals: settings.superscript_decimals,
share_facebook: settings.share_facebook,
share_twitter: settings.share_twitter,
share_pinterest: settings.share_pinterest,
set_image_breathing_room: true,
product_grid_style: settings.product_grid_style,
-%}

{% schema %}
{
"name": "t:labels.blog_sidebar",
"class": "blog-layout__sidebar",
"settings": [
{
"type": "paragraph",
"content": "t:info.sidebar_is_first_two_sections"
}
],
"max_blocks": 5,
"blocks": [
{
"type": "article",
"name": "t:labels.featured_article",
"settings": [
{
"type": "text",
"id": "title",
"label": "t:labels.heading",
"default": "Popular posts"
},
{
"type": "article",
"id": "article",
"label": "t:labels.article"
},
{
"type": "checkbox",
"id": "blog_show_tags",
"label": "t:actions.show_tags",
"default": true
},
{
"type": "checkbox",
"id": "blog_show_date",
"label": "t:actions.show_date",
"default": true
},
{
"type": "checkbox",
"id": "blog_show_comments",
"label": "t:actions.show_comment_count",
"default": true
},
{
"type": "checkbox",
"id": "blog_show_author",
"label": "t:actions.show_author"
},
{
"type": "checkbox",
"id": "blog_show_excerpt",
"label": "t:actions.show_excerpt",
"default": false
},
{
"type": "select",
"id": "blog_image_size",
"label": "t:actions.force_image_size",
"default": "wide",
"options": [
{
"value": "natural",
"label": "t:labels.natural"
},
{
"value": "square",
"label": "t:labels.square_11"
},
{
"value": "landscape",
"label": "t:labels.landscape_43"
},
{
"value": "portrait",
"label": "t:labels.portrait_23"
},
{
"value": "wide",
"label": "t:labels.wide_16_9"
}
]
}
]
},
{
"type": "tags",
"name": "t:labels.tags",
"limit": 1
},
{
"type": "product",
"name": "t:labels.featured_product",
"settings": [
{
"type": "product",
"id": "featured_product",
"label": "t:labels.product"
}
]
},
{
"type": "share",
"name": "t:labels.share_links",
"limit": 1,
"settings": [
{
"type": "paragraph",
"content": "t:info.only_appear_on_articles"
}
]
}
],
"disabled_on": {
"groups": ["footer", "header", "custom.popups"]
}
}
{% endschema %}

Where should i insert the code suggested?

[sam_8599]

Any help would be appreciated.

[sam_8599]

It's the section-blog-sidebar file but does not work... it only shows "Categories" no code.

{%- if section_blocks_size == 0 -%}
<style>
.blog-layout__sidebar { display: none; }
</style>
{%- endif -%}

{% Code added %}
<div class="blog-list-block">
<h3>Categories</h3>
<ul>
{% for blog in blogs %}
<li>
<a href="{{ blog.url }}">{{ blog.title }}</a> ({{ blog.articles_count }})
</li>
{% endfor %}
</ul>
</div>

{% Code added %}

{%- for block in section.blocks -%}
{%- case block.type -%}
{%- when 'article' -%}
{%- assign article_object = articles[block.settings.article] -%}
<div class="theme-block" {{ block.shopify_attributes }}>
{%- if block.settings.title != blank -%}
<h4>{{ block.settings.title }}</h4>
{%- endif -%}
{%- render 'article-grid-item',
blog: blog,
article: article_object,
style: 'compact',
show_tags: block.settings.blog_show_tags,
show_date: block.settings.blog_show_date,
show_comments: block.settings.blog_show_comments,
show_author: block.settings.blog_show_author,
show_excerpt: block.settings.blog_show_excerpt,
image_size: block.settings.blog_image_size -%}
</div>
{%- when 'tags' -%}
{%- if blog.all_tags.size > 0 -%}
<div class="theme-block" {{ block.shopify_attributes }}>
<h4>{{ 'actions.explore_more' | t }}</h4>
<ul class="no-bullets tag-list">
{%- for tag in blog.all_tags -%}
{% if tag contains "_" %}{%- assign tag_starts_with = tag | slice: 0 -%}{% if tag_starts_with == "_" %}{% if tag_count %}{%- assign tag_count = tag_count | minus: 1 | at_least: 0 -%}{% endif %}{% continue %}{% endif %}{% endif %}
<li class="tag tag--inline">
<a href="{{ blog.url }}/tagged/{{ tag.handle }}" class="article-tag">{{ tag }}</a>
</li>
{%- endfor -%}
</ul>
</div>
{%- endif -%}
{%- when 'product' -%}
{%- assign product = all_products[block.settings.featured_product] -%}
{%- unless product.empty? -%}
<div class="theme-block" {{ block.shopify_attributes }}>
<h4>{{ 'labels.featured_product' | t }}</h4>
{%- render 'product-grid-item',
product: product,
no_actions: true,
sizeVariable: '40vw',
collection: collection,
quick_add_enable: quick_add_enable,
quick_shop_enable: quick_shop_enable,
product_grid_image_size: product_grid_image_size,
product_grid_image_fill: product_grid_image_fill,
product_hover_image: product_hover_image,
enable_swatches: enable_swatches,
vendor_enable: vendor_enable,
product_save_amount: product_save_amount,
product_save_type: product_save_type,
superscript_decimals: superscript_decimals,
set_image_breathing_room: set_image_breathing_room,
product_grid_style: product_grid_style,
enable_product_tags: enable_product_tags
-%}
</div>
{%- endunless -%}
{%- when 'share' -%}
{%- if article -%}
<div class="theme-block" {{ block.shopify_attributes }}>
<h4>{{ 'actions.share_this' | t }}</h4>
{%- render 'social-sharing',
share_facebook: share_facebook,
share_twitter: share_twitter,
share_pinterest: share_pinterest,
share_title: article.title,
share_permalink: article.url,
share_image: article.image
-%}
</div>
{%- endif -%}
{%- endcase -%}
{%- endfor -%}

[MR115_ShopiDevs]

To count the total number of unique tags used across all blog articles in Shopify. Here’s how you can do this in Liquid:

<ul>
 {% for tag in blog.tags %}
     <li>{{ tag | link_to_tag: tag }}<span>count:{{ tag.total_count }}</span></li>
 {% endfor %}
</ul>