Passing linked text to span via Javascript

Hi there,

I’m facing the same issue that others have articulated re: Webflow’s inability to link a span within a text block to a CMS item. While I can solve my issue visually with display:inline, there are big semantic issues with this approach. For example:

<h2>A personalized H2 for</h2><h2 id="linked-to-CMS">Nate</h2>

Imagine a screenreader trying to read this out. It’d also be untenable for search engine crawlers (which would likely have a hard time deducing the two H2s are part of the same sentence). The semantically correct approach is:

<h2>A personalized H2 for <span id="linked-to-CMS">Nate</span></h2>

This Wishlist post mentions there’s a workaround here using Javascript. Is there a way to call to linked CMS items’ values using JS? Has anyone outlined this process before?

https://wishlist.webflow.com/ideas/WEBFLOW-I-990

Thanks in advance for guidance~

(I don’t have a read-only link I can share at this time)

In case anyone comes across this thread in the future, the solution is simple but barely documented.

There is a Webflow-native workaround. There’s no need for JS – instead, there is a little link in the top right of the HTML embed widget that lets you pull in CMS fields dynamically. Simply replace your inline items with this.