CMS Development

tommy
Member

HubL coding in a blog template to insert a line of text after a certain word count

SOLVE

Greetings,

I am new to Hubspot and I need some ideas on how to approach a problem using HubL code with a blog template. I have been given the task to figure out a way to get a word count on a blog post and once a certain certain word count is achieved (lets say 150 words) a line of text will be inserted after that certain word count and then remaining blog article text will be displayed. 

 

I have tried to edit the {{content.post_body}} with the HubL filters but I am not having much luck with the logic.  Any thoughts?

 

Thanks ,

Tommy

1 Accepted solution
tommy
Solution
Member

HubL coding in a blog template to insert a line of text after a certain word count

SOLVE

Thanks you for your reply!!!!!

Both  your methods solved my task. 🙂

 

Are there any other extra resources about HubL coding (besides the basic overview documentation found on the Hubspot website) that you could recommend? I want to learn more about HubL!!!!

 

Thanks again,

Tommy

 

View solution in original post

4 Replies 4
TRooInbound
Key Advisor | Partner
Key Advisor | Partner

HubL coding in a blog template to insert a line of text after a certain word count

SOLVE

Hi @tommy, you can achieve this task by two methods

 

1) Split out every word and append your line of text.

here you need to split out your post body into words after then you need to slice words  to your required word count.

 

{%  set words = content.post_body|split(' ', 10000)  %}
{% for column in words|slice(YOUR-WORD-COUNT,' ') %}
    {% for item in column %}
        {% if item %}
            {{ item }}
        {% endif %}
    {% endfor %}
    
    {% if loop.first %}
        Line of text to insert
    {% endif %}
{% endfor %}

 

2)  Add some tag to slice out article. 

In this example we used '<!--more-->' (separator) to slice content as it can directly set from edit post item and can set individually for each as per your requirement.

Separator will be used to show some information on blog  listing page and all information on blog posting page. for more info please refer here.

 

So in below code article is divided based on separator position and then it shown with adding your custom text in between.

 

{% set sections = content.post_body|split('<!--more-->', 2) %}
<div class="brief-summary">
    {{  sections[0] }}
</div>

<div>
    Line of text to insert
</div>

<div class="detailed-summary">
    {{  sections[1] }}
</div>

 

We hope it resolve your query.

Team TRooInbound!

 

tommy
Solution
Member

HubL coding in a blog template to insert a line of text after a certain word count

SOLVE

Thanks you for your reply!!!!!

Both  your methods solved my task. 🙂

 

Are there any other extra resources about HubL coding (besides the basic overview documentation found on the Hubspot website) that you could recommend? I want to learn more about HubL!!!!

 

Thanks again,

Tommy

 

TRooInbound
Key Advisor | Partner
Key Advisor | Partner

HubL coding in a blog template to insert a line of text after a certain word count

SOLVE

Hi @tommy,

 

That's Great! Cool!

I don't think so there is another document available for Hubl references.

 

if you want to learn HubL code than just utilizing those available HubL filter and module in your project than automatically. 

 

Kindly my above answer marking as a solution.

 

Did my post help answer your query? Help the Community by marking it as a solution.

 

Thanks

Team TRooInbound

 

0 Upvotes
Christopher
Participant | Partner
Participant | Partner

HubL coding in a blog template to insert a line of text after a certain word count

SOLVE

Great question and solutions!   I really like this second solution that uses the <!--More--> tag.   

 

In this modified example I break the article into 3 parts (if available)  3rd part made available from inserting a second <!--more--> tag.     This relies on the Author to add the second tag, but allows them to put the line of text in wherever they feel appropriate.

 

 

{% set sections = content.post_body|split('<!--more-->', 3) %}
<div class="brief-summary">
{{ sections[0] }}
</div>

<div class="detailed-summary">
{{ sections[1] }}
</div>
{% if sections[2] %}
<div>
Line of Text
</div>
<div>
{{ sections[2] }}
</div>

{% endif %}