Skip Navigation

[Resolved] YouTube Video URL only displays the video on the backend but not on frontend

This thread is resolved. Here is a description of the problem and solution.

Problem:

I have a custom field (embedded media) on a custom post type to store a YouTube URL.

In a content template I inserted in the block editor a Toolset “YouTube” field. This field pulls in dynamically the YouTube URL from the embedded media field of the current post.

It worked before. Now the video is displayed in the content template but not on the front end

Solution:

It is a compatibility issue with "SG Optimizer" plugin, you can try these:

Dashboard-> SG Optimizer-> Media Optimization, disable option "Lazy Load Iframes".

Relevant Documentation:

This support ticket is created 3 years, 3 months ago. There's a good chance that you are reading advice that it now obsolete.

This is the technical support forum for Toolset - a suite of plugins for developing WordPress sites without writing PHP.

Everyone can read this forum, but only Toolset clients can post in it. Toolset support works 6 days per week, 19 hours per day.

Sun Mon Tue Wed Thu Fri Sat
- 9:00 – 13:00 9:00 – 13:00 9:00 – 13:00 9:00 – 13:00 9:00 – 13:00 -
- 14:00 – 18:00 14:00 – 18:00 14:00 – 18:00 14:00 – 18:00 14:00 – 18:00 -

Supporter timezone: Asia/Hong_Kong (GMT+08:00)

This topic contains 8 replies, has 2 voices.

Last updated by kai-peterW 3 years, 3 months ago.

Assisted by: Luo Yang.

Author
Posts
#2133851

I have a custom field (embedded media) on a custom post type to store a YouTube URL.
In a content template I inserted in the block editor a Toolset “YouTube” field. This field pulls in dynamically the YouTube URL from the embedded media field of the current post.

It worked before. Now the video is displayed in the content template but not on the front end (only white space where the video should be displayed).

If I you the Toolset Fields and Text field and then add Field and View (Toolset block field) and choose the custom field with the video URL, the same happens: the video is displayed in the content template but not on the front end.

If I manually copy the embed code from the YouTube video and past it to an inserted fields and text field, then the video is correct displayed on the front end! To do this dynamcally for all post I would have to create a new field and copy all embed codes from YouTube into this new field …

How to get a YouTube URL to work on the front end?

#2134447

Hello,

The problem you mentioned above is abnormal, please check these:
1) Make sure you are using the latest version of Toolset plugins, you can download them here:
https://toolset.com/account/downloads/

2) In case it is a compatibility problem, please deactivate all other plugins, and switch to WordPress default theme 2021, deactivate all custom PHP/JS code snippets, and test again

3) Also check if there is any PHP/JS error in your website:
https://toolset.com/documentation/programmer-reference/debugging-sites-built-with-toolset/

#2134587

Hi Luo,

here an example URL where the video is lacking and you only see white space:
hidden link

The inspector shows you:
<iframe class=" lazyloaded" data-data-src="hidden link" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen="" frameborder="0"></iframe>

followed by rare html:
#document
<html>
<head></head>
<body> ...

I cannot find php errors. No error logs are written the error_log.txt (I do not know if this file is working).

Errors in the inspector console are:
Feature Policy: Unbekannte Funktionalität (Feature) "accelerometer" wird ignoriert. krankenpflegepraktikum-costa-rica
Feature Policy: Unbekannte Funktionalität (Feature) "autoplay" wird ignoriert. krankenpflegepraktikum-costa-rica
Feature Policy: Unbekannte Funktionalität (Feature) "encrypted-media" wird ignoriert. krankenpflegepraktikum-costa-rica
Feature Policy: Unbekannte Funktionalität (Feature) "gyroscope" wird ignoriert. krankenpflegepraktikum-costa-rica
Feature Policy: Unbekannte Funktionalität (Feature) "picture-in-picture" wird ignoriert. krankenpflegepraktikum-costa-rica
Feature Policy: Unbekannte Funktionalität (Feature) "accelerometer" wird ignoriert. krankenpflegepraktikum-costa-rica

I have the latest Toolset plugins installed.

When I deactivate the SiteGround Optimizer plugin, then the YouTube video is displayed on the frontend.
Seems that the SiteGround Optimizer is the culprit.

But then the following error is displayed in the inspector console:
Quellübergreifende (Cross-Origin) Anfrage blockiert: Die Gleiche-Quelle-Regel verbietet das Lesen der externen Ressource auf hidden link. (Grund: CORS-Anfrage schlug fehl).

What can I do to fix this error and use the SiteGround Optimizer? Any ideas?

Thanks in advance.

Kai Peter

#2134743

Hello Luo,
ok, in the meantime I tried the following:
I did the php debugging in WP as described in your link.
It worked.

With the
ini_set('log_errors',TRUE);
ini_set('error_reporting', E_ALL);
ini_set('error_log', dirname(__FILE__) . '/error_log.txt');
in the wp-config.php the website crashed and on the frontend several errors displayed.

Disabling the plugins one by one I found the culprit: Toolset Types.
Only with Toolset Types enabled the errors occured.

In the backend errors showed that it must have something to do with an oxygen builder component called oxygen-toolset.php. Maybe or maybe not.

The error_log.txt displays the following errors:

[05-Aug-2021 09:04:07 UTC] PHP Notice: Undefined index: media in /home/customer/www/interswop.de/public_html/wp-content/plugins/oxygen/component-framework/components/component.class.php on line 3216

[05-Aug-2021 09:04:07 UTC] PHP Notice: Undefined index: original in /home/customer/www/interswop.de/public_html/wp-content/plugins/oxygen/component-framework/components/component.class.php on line 2351

[05-Aug-2021 09:30:48 UTC] PHP Notice: Undefined variable: id in /home/customer/www/interswop.de/public_html/wp-content/plugins/oxygen/component-framework/components/classes/easy-posts.class.php(149) : eval()'d code on line 10

[05-Aug-2021 09:30:48 UTC] PHP Notice: Array to string conversion in /home/customer/www/interswop.de/public_html/wp-content/plugins/oxygen/component-framework/component-init.php on line 4316

[05-Aug-2021 09:50:48 UTC] PHP Notice: Undefined index: original in /home/customer/www/interswop.de/public_html/wp-content/plugins/oxygen/component-framework/components/component.class.php on line 2351

[05-Aug-2021 11:38:42 UTC] PHP Notice: Undefined variable: show_gradient in /home/customer/www/interswop.de/public_html/wp-content/plugins/oxygen/component-framework/toolbar/views/background.view.php on line 167

[05-Aug-2021 11:38:47 UTC] PHP Notice: Undefined offset: 0 in /home/customer/www/interswop.de/public_html/wp-content/plugins/oxygen/component-framework/includes/toolset/oxygen-toolset.php on line 61

[05-Aug-2021 11:38:52 UTC] PHP Notice: Undefined index: html_template in /home/customer/www/interswop.de/public_html/wp-content/plugins/oxygen/component-framework/api/oxygen.element.class.php on line 297

[05-Aug-2021 11:38:52 UTC] PHP Notice: Undefined index: inlineJS in /home/customer/www/interswop.de/public_html/wp-content/plugins/oxygen/component-framework/api/oxygen.element.class.php on line 318

[05-Aug-2021 11:38:53 UTC] PHP Notice: Undefined index: queryOptions in /home/customer/www/interswop.de/public_html/wp-content/plugins/oxygen/component-framework/api/single.template.php on line 20

[05-Aug-2021 11:38:53 UTC] PHP Notice: Undefined index: children in /home/customer/www/interswop.de/public_html/wp-content/plugins/oxygen/component-framework/api/oxygen.element.class.php on line 876

With the code:
ini_set('log_errors',TRUE);
ini_set('error_reporting', E_ALL);
ini_set('error_log', dirname(__FILE__) . '/error_log.txt');

in the wp-config.php the production website is crashed and I had to delete this code again to make the website work. But in the "background" these errors still exist. And I have no idea how to fix them.

Do you have some idea?

Greetings. Kai Peter

#2135353
youtube2.JPG

Thanks for the details, I have tried the problem URL you mentioned above:
hidden link

I can see the youtube video correctly, see my screenshot youtube2.JPG

Is there any missing steps? Where and how can I see the problem you mentioned above?

Now the video is displayed in the content template but not on the front end (only white space where the video should be displayed).

I have enabled the private message box, if you need more assistance for it, please provide your website credentials in it.

And according to the PHP debug logs you provided above, those PHP Notice message are from another plugin "oxygen", you can check it with the author of plugin "oxygen"

#2137187

I have tried the credentials you provided above, but it isn't an admin account, please check it, make sure it is valid admin account of your website, thanks

#2137283

Hi Luo,
oh, sorry, I forgot to set you as an administrator.

Now I changed it and you have now credentials as an admin.

Greetings,
Kai Peter

#2137369

Thanks for the details, I have done below modifications in your website:
Dashboard-> SG Optimizer-> Media Optimization, disable option "Lazy Load Iframes", please test again, check if the problem is fixed, thanks

#2137381

My issue is resolved now. Thank you!