Parse Shopify blog articles with Liquid

article.liquid

{% comment %}
  Here the article content is split by iframe and img tags, responsive Bootstrap
  classes are added in, and then output to the page.

  The Split filter removes the delimiter from the string. This functionality is
  exploited to join the array elements back together with new HTML tags added
  in.
  
  Blog post: http://nateeckerson.com/2019/10/09/wrap-shopify-blog-article-images-with-css-classes-in-liquid.html
{% endcomment %}

{% assign split_by_img = article.content | split:'<img' %}
{% assign article_content = split_by_img | join: '<img class="img-fluid"' %}

{% assign split_by_iframe = article_content | split:'<iframe' %}
{% assign article_content = split_by_iframe | join: '<iframe
  class="embed-responsive-item"' %}

{% assign split_by_iframe = article_content | split:'<iframe' %}
{% assign article_content = split_by_iframe | join: '<div
  class="embed-responsive embed-responsive-16by9"><iframe' %}

{% assign split_by_iframe = article_content | split:'</iframe>' %}
{% assign article_content = split_by_iframe | join: '</iframe></div>' %}

...
{% comment %}
  Same functionality as above, but using replace filter chain
{% endcomment %}

{% assign article_content = article.content | replace: '<img', '<img class="img-fluid"' | replace: '<iframe', '<div class="embed-responsive embed-responsive-16by9"><iframe class="embed-responsive-item"' | replace: '</iframe>','</iframe></div>' %}
...

...

<div class="rte">
  {{ article_content }}
</div>