Bug: adding secondary button text via Dynamic Content

[adaptifyDesigns]

Hello, I have encountered a bug in Cornerstone.

I am attempting to add an html string as secondary button text. When I paste the string directly into the Secondary Button Text field, the output works as expected:

But when I save that same html string in a ACF Pro option field, and then use Cornerstone’s Dynamic Content to place that string in the Secondary Button Text field, it creates a very strange output:

Here is the frontend output when I enter the string directly:

<a class="x-anchor x-anchor-button e3340-17 m2ks-1c m2ks-1d m2ks-1e watch-video-button-large" tabindex="0" href="/" style="outline: none;">
    <div class="x-anchor-content">
        <div class="x-anchor-text">
            <span class="x-anchor-text-secondary">
                <svg>/* ...full html string omitted... */</svg>
            </span>
            <span class="x-anchor-text-primary">Watch Video</span>
        </div>
    </div>
</a>

And here is the output when I use the dynamic content to enter the same string:

<a class="x-anchor x-anchor-button e3340-17 m2ks-1c m2ks-1d m2ks-1e watch-video-button-large" tabindex="0" style="--tco-dc2ks-0:<svg>/* ...full html string omitted... */</svg>; outline: none;" href="/">
<div class="x-anchor-content">
    <div class="x-anchor-text">
        <span class="x-anchor-text-secondary">
            <svg>/* ...full html string omitted... */</svg>
        </span>
        <span class="x-anchor-text-primary">Watch Video</span>
    </div>
</div>

For brevity I have omitted the full string. But in reality, in the second example it is printing the entire string into the style attribute on the <a> element, which breaks the style attribute because it is obviously not valid CSS.

Thankfully this is not a critical error, because the style attribute is not very important in this case. By default Cornerstone outputs a simple style="outline: none;" for all anchor elements. I can easily do without this, but it is troubling having that whole SVG string printed out, even if it isn’t technically breaking my site.

I consider this to be a bug because if I enter the html string into the Secondary Text field directly, this issue does not arise. It’s only when I use the Dynamic Content -> ACF Option Field that this happens, so it must be something to do with how Cornerstone is handling the ACF integration.

Let me know what you find out. Or if you need any assistance in replicating this.

Thanks!

[ruenel]

Hello @adaptifyDesigns,

Thanks for writing in! Please make sure that the Filetype of your ACF field is not text or text area. It should be Wysiwyg because text or textarea will only accept plain text. Even if you insert custom HTML, the ACF Pro plugin will only output a plain text.

Best Regards.

[adaptifyDesigns]

No, that’s not the problem. The field value works fine everywhere else in the theme, both via php and when using Cornerstone dynamic content. The issue only arises when I use this dynamic content in the secondary button text field. I’m pretty sure this is a bug with the secondary button text field. And besides, if I switch the ACF field to a WYSIWYG field, all that does is add a paragraph tag around the html string. Makes no difference. I tested it just to be sure. Same problem. Please report this as a bug that needs to be examined by the dev team.

[friech]

Hi @adaptifyDesigns,

Those text fields are never meant for a files. Instead use the Graphic field of the button.

• Use the URL field in the ACF PRO.
• Use a plugin to let you upload an SVG file to your library or upload your SVG file somewhere as long as you can have the URL.
• Make sure your SVG file has a width and height define to it.

Cheers,

[adaptifyDesigns]

Hi Friech. It’s not a file. It’s inline SVG. Inline SVG is a valid HTML string and it is extremely useful because you can control the fill color with CSS for hover effects, etc.

The inline SVG works fine in all other text fields in Cornerstone. It even works in the secondary button text field, but it causes an unexpected output in the style attribute when the string is called using Dynamic Content. It’s a bug! And I am letting you know so that you can pass this on to your dev team. I would love to see this fixed please.

[friech]

Hi @adaptifyDesigns,

Got it, I’ve submitted this to our issue tracker so the developers will be made aware of it. Please note that we can not promise an immediate fix to this.

Thanks,