Embed Code Rendering Issue from API Response

[graysonkent]

We are currently using the Lightcast API to retrieve video content, with results being returned in JSON format. Within the response, an embed code is provided for each video.

However, we are encountering an issue where the embed code does not render properly when used. Additionally, any content that appears after the <iframe> embed code also fails to render as expected.

This behavior suggests that the iframe may be interfering with the rendering of subsequent content, or that the embed code itself is not being properly interpreted in our implementation.

Are there any steps to parsing HTML data other than referencing {{ looper.field({“key”:“embed_code”}) }} as I would any other API request?

[ruenel]

Hello Grayson,

Thanks for writing in! Does the iframe source exist if you try it in your browser address bar? We would be happy to double check your site if we can log in. You can create a secure note in your next reply with the following info:
– Link to your site
– WP login URL
– WP username
– WP password
– WP Administrator Role
– Confirmation that we can access and make changes to your site

To know how to create a secure note, please check this out: How The Forum Works

Best Regards.

[graysonkent]

Thank you. The requested information is supplied.

[ruenel]

Hey Grayson,

The Response {{dc:looper:field key="response" type="json" pretty_print="1"}} escaped the characters that broke the iFrame HTML code in it. This is why the rest of the response no longer displays.

If you intend to display the embed code, you can add this dynamic content: {{ looper.field({"key":"response.0.embed_code"}) }}

The next problem is that the video will still NOT display due to mixed content. It means the video embed code is served over http, but we need it to be served over https. This is reflected in the console:

“Mixed Content: The page at ‘https://www.thechurchofgod.org/media/test/’ was loaded over HTTPS, but requested an insecure frame ‘http://embed.cdn01.net/player.php?width=640&height=360&skinColor=000000&autoPlay=0&playlistPos=inside&playlistSize=350&tvButtonID=lightcast&id=802734’. This request has been blocked; the content must be served over HTTPS.”

Kindly check out this guide to be able to resolve the mixed content issue and to eventually display the video:

How to Fix the Mixed Content Error in WordPress (Easy Way)

Best Regards.

[graysonkent]

Thank you! This worked perfectly.

For anyone else who may see this and is using Lightcast APIs, I was able to request non-mixed content from Lightcast. This can be achieved by adding &ssl=1 to the request URL.

[prakash_s]

You are most welcome, Grayson.