Shopify - Add dynamic links on description

{% assign productdescription = product.description %}

{% assign productdesclinks = "maxi dress~https://examples.com/collections/maxi-dresses,midi dress~https://examples.com/collections/midi-length-dresses,midi~https://examples.com/collections/midi-length-dresses,pockets~https://examples.com/collections/dresses-with-pockets,kasey rainbow~https://examples.com/collections/kasey-rainbow,maggi~https://examples.com/collections/maggi-mcdonald-x-proud-poppy ,Maggi McDonald~https://examples.com/collections/maggi-mcdonald-x-proud-poppy,spring~https://examples.com/collections/spring-dresses-collection ,floral~https://examples.com/collections/floral-dresses" %}

{% assign productdesclinks = productdesclinks | split: ',' %}

{% for productdesclink in productdesclinks %}

  {% assign productdesclk = productdesclink | split: '~' %}

  {% assign productdesclkcomp = productdesclk[0] %}

  {% assign productdesclkurl = productdesclk[1] %}

  {% assign productdesclklink = '<a href="' | append: productdesclkurl | append: '">' | append: productdesclkcomp | append:"</a>" %}

  {% assign productdescription = productdescription | replace:productdesclkcomp, productdesclklink %}

{% endfor %}

{{ productdescription }} 

How to show #(hash) link when sticky header using HTML CSS

Link

<a href="#FlavoredToothpicks">Jaydip Kansagra is developer</a>

HTML

<span class="anchor" id="FlavoredToothpicks"></span><h3 class="subsection-title">Jaydip Kansagra is developer</h3>
<p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book.</p>

CSS

.anchor {
    display: block;
    height: 100px;
    margin-top: -100px;
    visibility: hidden;
}