This is a recurring problem with landing pages in Salesforce Account Engagement(pardot):
Step1. use the following code on a layout template:
<a href="">
<img src="https://placehold.jp/680x440.png">
<h3>title</h3>
<p>paragraph</p>
</a>
Step2. Make a landing page using the above template and open the WYSIWYG editor. After doing that the code will always change to this:
<a href=""> <img src="https://placehold.jp/680x440.png" /></a>
<h3><a href="">title</a></h3>
<a href=""> </a>
<p><a href="">paragraph</a></p>
<a href=""> </a>
This happens even if I encase the in s. Even opening the editor and just hitting save will modify the code. Can someone help me with the solution??
Found a solution! Account engagement still doesn't allow anchors with block elements inside of it (this is allowed in HTML5).
So we could either use span tags instead of h3 and p, but that would not be semanti.
One solution is to use the following code:
<div>
<h3>title</h3>
<p>paragraph</p>
<a href="">see more</a>
</div>
And style it like this:
div{position:relative}
a{position:absolute; top:0; width:100%; height:100%; opacity:0;}
This makes the link not visible and the same size as the div. I would have used an anchor with no text, but that is not allowed in Account Engagement, hence the need to use opacity:0;.