Modified product-description.liquid to support metafield tab contant

product-description.liquid

<!-- Snippets/product-description.liquid -->

<div class="product-description" itemprop="description">

  {% assign MFTab2 = product.metafields.tab2.content %}
  {% assign MFTab3 = product.metafields.tab3.content %}
  {% assign MFTab4 = product.metafields.tab4.content %}
  
  <ul class="tabs js-tabs-container">
    {%- if tab_1 != blank -%}
      <li class="product-description__tab">
        <h5 class="h5--no-margin">
          {%- if tab_2_content != blank or MFTab2 or MFTab3 or MFTab4 or tab_3_content != blank -%}
            <a href="#tab-1" data-tab="1" class="active js-tabs-link">{{ tab_1 }}</a>
          {%- else -%}
            <div class="active js-tabs-link">{{ tab_1 }}</div>
          {%- endif -%}
        </h5>
      </li>
    {%- endif -%}
    {%- if tab_2_content != blank or MFTab2 and tab_2 != blank and tab_1 != blank -%}
      <li class="product-description__tab">
        <h5 class="h5--no-margin">
          <a href="#tab-2" data-tab="2" class="js-tabs-link">{{ tab_2 }}</a>
        </h5>
      </li>
    {%- endif -%}
    {%- if tab_3_content != blank or MFTab3 and tab_3 != blank and tab_1 != blank -%}
      <li class="product-description__tab">
        <h5 class="h5--no-margin">
          <a href="#tab-3" data-tab="3" class="js-tabs-link">{{ tab_3 }}</a>
        </h5>
      </li>
    {%- endif -%}
    {%- if tab_4_content != blank or MFTab4 and tab_4 != blank and tab_1 != blank -%}
      <li class="product-description__tab">
        <h5 class="h5--no-margin">
          <a href="#tab-4" data-tab="4" class="js-tabs-link">{{ tab_4 }}</a>
        </h5>
      </li>
    {%- endif -%}
  </ul>
  
  <div class="tab-container js-tabs-content-container">
    <div class="tab-content tab-1 current checkMyHeight js-tab-1">
      <div class="rte">
        <div class="description" itemprop="description">          
          {{product.description}}        
        </div>
      </div>
    </div>

    {%- if tab_2 != blank or MFTab2 -%}
      <div id="tab-2" class="tab-content tab-2 js-tab-2">
        <div class="rte">
          <div class="description" itemprop="description">
            {%- if MFTab2 -%}
              {%- if MFTab2 contains "page-" -%}
                {%- assign MFTab2 = MFTab2 | remove_first:"page-" -%}
                {{ pages[MFTab2].content }}
              {%- else -%}
                {{ MFTab2 }}
              {%- endif -%}
            {%- else -%}
              {% capture tab2Content %}{{section.settings.tab_2_content}}{%endcapture%}
              {{ pages[tab2Content].content }}
            {%- endif -%}
          </div>
        </div>
      </div>
    {%- endif -%}
    {%- if tab_3 != blank or MFTab3 -%}
      <div id="tab-3" class="tab-content tab-3 js-tab-3">
        <div class="rte">
          <div class="description" itemprop="description">
            {%- if MFTab3 -%}
              {%- if MFTab3 contains "page-" -%}
                {%- assign MFTab3 = MFTab3 | remove_first:"page-" -%}
                {{ pages[MFTab3].content }}
              {%- else -%}
                {{ MFTab3 }}
              {%- endif -%}
            {%- else -%}
              {% capture tab3Content %}{{section.settings.tab_3_content}}{%endcapture%}
              {{ pages[tab3Content].content }}
            {%- endif -%}
          </div>
        </div>
      </div>
    {%- endif -%}
    {%- if tab_4 != blank or MFTab4 -%}
      <div id="tab-4" class="tab-content tab-4 js-tab-4">
        <div class="rte">
          <div class="description" itemprop="description">
            {%- if MFTab4 -%}
              {%- if MFTab4 contains "page-" -%}
                {%- assign MFTab4 = MFTab4 | remove_first:"page-" -%}
                {{ pages[MFTab4].content }}
              {%- else -%}
                {{ MFTab4 }}
              {%- endif -%}
            {%- else -%}
              {% capture tab4Content %}{{section.settings.tab_4_content}}{%endcapture%}
              {{ pages[tab4Content].content }}
            {%- endif -%}
          </div>
        </div>
      </div>
    {%- endif -%} 
  </div>
</div>