I’m trying to display a collection list of Podcasts on the News page of our website, with each Podcast item in the CMS holding its own HTML Embed Codes (usually an iframe from Stitcher of the like). On the page, within the collection list item, I planted an HTML Embed.
When I simply “+Add Field” for the relevant code-holding field, it displays as normal text, rather than an Embed. When I surround the field with the Script tag, it shows nothing.
Help!
Hi Tim, Welcome to the Webflow forum ! 
You might need to use custom code field with the CMS for this. A read only link will help us understand better the problem and solution 
No, I meant HTML Embed element… my bad.
Can you share a read-only link?
I created an approach and tutorial for this very issue. It may meet your needs.
Hey, thanks for pointing out your solution. This worked, but ONLY for the first item in the collection list: News - the rest of them now still display as plain text code. Being a collection list on the page, they all have the same embedID, so I’m not sure why they don’t all work.
@Tim_Milazzo take another look at my reply. You need to use a plain text field inside the collection , that’s where each embedID can be pulled from within the code.
The script was written for a collection template page, not a collection list. It needs to be refactored for a list. I will put it on my list and update the post as soon as I get a chance.
This code block could be added to the before body close. This is using jQuery (included on Webflow page loads).
<!-- If you already loaded HE then you don't need this line-->
<script src="https://cdnjs.cloudflare.com/ajax/libs/he/1.2.0/he.min.js"></script>
<!-- decode CMS collection item embed -->
<script type="text/javascript">
$(document).ready(function () {
// targeting class of .podcast-embed
$(".podcast-embed").each(function () {
$(this).hide(); // hide so code is not displayed (better to hide in CSS)
$(this).html(he.decode($(this).html())); // decode the text
$(this).show(); // show the decoded element
});
});
</script>
This would work fine if they were all SoundCloud links, but they are not.
@Tim_Milazzo well, yes, it has to be adjusted to whatever platform you’re using. I recently used this same method for embedding a shopping cart as well as social media buttons.
@webdev when would you use your workaround versus the basic dynamic embed options?
Anytime that the code you need to display can change from one item to the next. With this decode method it does not matter what you put in the embed. It simply decodes the encoding that Webflow does on embeds from a collection.
@webdev ah, so, say I want an embed code from one source (say soundcloud) on one collection item and in the same area I want another code, say simplecast, that’s what that code’s for? Rather than the dynamic embed where you could display a podcast episode that’s different for each item but not from a different source.
That would be a good example. This just makes it trivial to have a text field in a collection that you can drop code into and have it render on your list or your template. You don’t even need to add an embed element. A plain text element will do just fine.
I would add that you need to use the embed field when you are adding dynamic variables from other fields into the mix (values in the code block).
I inserted the latest code into the Before Body section character for character…
… but it’s not rendering the embeds correctly in either a Text Block or an HTML Embed: https://stacksource-website.webflow.io/news
Not sure what I could have done wrong.
Remove the ID and replace it with a class. Use podcast-embed.
You’re the man! Thanks for your help. Let me know if I can throw you a few bucks. Can you DM on here?
.