Landing Page CTA Label Global Variable not appearing

[rmoravick1]

Hi Disha,

Here is the source code at the LP level:

<div>&iexcl;Hola!</div>
<div><br /></div>
<div>Ahora que est&aacute; un a&ntilde;o m&aacute;s cerca de la jubilaci&oacute;n, es posible que se pregunte c&oacute;mo hacerle para vivir bien ahora y ahorrar lo suficiente para su futuro. Para ayudarle a responder esa pregunta y a lograr el equilibrio en la jubilaci&oacute;n, le ofrecemos acceso exclusivo a nuestros recursos educativos y de planificaci&oacute;n adicionales.</div>
<div><br /></div>
<div>Estas nuevas herramientas y recursos incluyen:</div>
<div>
<ul>
<li>Orientaci&oacute;n sobre los gastos durante la jubilaci&oacute;n para asegurarse de cubrir todos los aspectos</li>
<li>Consejos para maximizar sus beneficios del Seguro Social y Medicare</li>
<li>Art&iacute;culos, videos y hojas de trabajo para ayudarle a tomar el control de su planificaci&oacute;n</li>
</ul>
</div>
<div><br /></div>
<div>Considere tambi&eacute;n el plan de contribuci&oacute;n adicional 50+ catch-up contribution, que le permite ahorrar m&aacute;s a trav&eacute;s de su plan de jubilaci&oacute;n cada a&ntilde;o</div>
<div><br /></div>
<div><button type="button" name="myButton" href="${ButtonURL}">${ButtonLabel}</button></div>

[Jasbir_Kaur]

Hi @rmoravick1,

Please approve the LP and check again.

[Dave_Roberts]

Here's a few additional suggestions:

• You do not need the mktoModuleScope attribute on your variable - that's an email thing. 
• You might want to choose to use an anchor tag OR a button tag for your button rather than nesting a button inside of an anchor tag. I'd recommend going with the <a> tag (b/c it's editable in using the Rich Text Editor) and adding a class to it for styling... something more like:
  HTML
  

  <div><a href="${ButtonURL}" class="button">${ButtonLabel}</a></div>​

  CSS
  

  /* default button state */
  .button {
     padding: 5px 15px;
     background-color: transparent;
     color: #000;
     border: 1px solid #BBB;
     border-radius: 6px;
  }
  /* active button states (hover, active and focus) */
  .button:hover, .button:active, .button:focus {
     background-color: #BBB;
     color: #fff;
  }

[rmoravick1]

Hey Dave,

Thank you for those suggestions! Ive tried using both an anchor tag and a button tag for the section but I am still seeing the same issue.

 

[Dave_Roberts · Accepted solution]

Thanks for following up and giving the button switch a try. I've read thru some of the other suggestions here and would have thought that one of those should have solved the problem. 

I did some add'l testing this morning and setup a Guided LP template with some variables to match your situation. What I discovered is that when the variables are contained inside an editable text area that they don't work, but when they are not inside an editable area, they do work. 

Here's a few images for reference of the testing setup:

(above) There are two buttons here (same button) -- one is included inside an editable area, the other is outside the editable area

(above) The highlight parts are inside an editable area (and do not work) and the bottom button is outside the editable area (and does work).

Is there a chance that you're using the variables inside an editable area on the template?

If so, I think that could cause the issue you're running into here. If that's the case, you really don't need the variable there b/c you can use the Rich Text Editor to go in and change the URL and Text of the button. If you use the <button> element, it'll be harder to edit the buttons using the RTE but if you use the <a> element, you can use the Insert/Edit Link tool on the RTE toolbar to easily edit the button text and link. I'd recommend using the <a> tag over the <button> tag in this situation.

[rmoravick1]

Hey Dave,

I think you are right about this! Not only is the ButtonLabel variable in an editable text area, but the ImageURL and ButtonURL variables are also in an editable text area, which was also giving me some errors with testing. To your point, I think using the <a> element and using the Insert/Edit link tool will be best here. Thank you again for your help troubleshooting this!

[Dave_Roberts]

No problem, glad I was able to help. When you've got a minute would you mind marking that answer as correct b/c there's a bunch of other ideas in this thread and that'll help anyone else in the future who runs across an issue like this to find a solution more easily. Thanks again for working thru all the ideas here and providing feedback along the way, it really helps to build the overall knowledge base.

[rmoravick1]

Will do! Thanks again for helping me work through this!