Hola! ¡Tenemos nuestra Comunidad en Español!

CTA does not take anchor for rich text

Regular Contributor

I am creating an L.P that consists of several blocks/sections in which at the end of each block or section I am adding a CTA with an icon indicating that they continue down. So that when clicking on the CTA this send you to the next section or block, I have created an anchor that links the CTA with the section or block title. But it is not responding to that anchor. In the CTA where the option "Link URL" is added, add the link of the page + the anchor ID (https://www.inbest.cloud/desarrollo-en-la-nube/#nube) .

I have generated the anchor in title that I want you to leave by clicking on the CTA. (<h2><a id="nube"></a>¿QUÉ ES LA NUBE?</h2>). But it does not generate any action. To what is it possible that I should not take any action? Does the anchor do wrong or does the CTA have the name of the anchor wrong?

 

I add the kink of my landing page: https://www.inbest.cloud/desarrollo-en-la-nube

 

I remain to your comments.

Regards

Reply
0 Upvotes
2 Replies
Regular Advisor | Gold Partner | HubSpot Certified Trainer

Hello @Janette - I don't see any elements in your code that have an ID of #nube. However, when I add the id to the <h2 like so, <h2 id="nube">, I am able to drop the following javascript into your page and see the scrollto functionality you are looking for.

$(document).on("click", '.hs_cos_wrapper_type_cta a', function(e) {
  var thisE = $(this);
  var linkto = thisE.attr('cta_dest_link');
  if (linkto.indexOf('#') > -1) {
     var hashid = linkto.split("#").pop();
     $('html, body').animate({ scrollTop: $('#'+hashid).offset().top}, 1000);
     e.preventDefault();
  }

});

What that script does, is look through all the CTA's to find a hash and uses jquery to animate to that element id based on the hash.

CTA's are loaded dynamically so, me adding that script to the console works because CTA elements have already loaded. I tried to add code into that script to help make it work on dynamically loaded elements but, if the script doesn't work it's either related to that issue or the id that matches the hash is not found in the DOM.


If this answer helped, please, mark as solved Smiley Very Happy


tim@belch.io | forms.belch.io | Design your own Beautiful HubSpot Forms; No coding necessary.

 

Drop by and say Hi to me on slack.

Highlighted
Regular Contributor

@tjoyce Thanks very much for the comment

 

I am looking for this issue yet. I will try with the JS that you told. Because I try to the other forms but without success. 

 

I will tell you what happen whit this if work or dont.

 

Thanks.

Regards