[Resolved] YouTube Video

[Author]

Posts

[Rodrigo Lopes]

Hi.

I need to insert a few YouTube videos via custom field into the template page. In order to reduce the page size, I haven't used the Video or Embedded Media fields. Instead, I created a class with custom code added to the WP theme that replaces the video with its thumbnail image (see Image 1, please).

When I add something like
<div class='youtube-player' data-id='(videocodehere)'></div>
it works fine, except in Toolset (see it working here: hidden link).

No matter what I do (pasting the code into a single line field, creating a view, or pasting the code directly in the template), it doesn't work. As you can see here (hidden link) in 'real videos', there is a black rectangle where was supposed to be the video thumbnail.
How can I fix this?

Is there any documentation that you are following?
I haven't found any similar issues in the forum.

Is there a similar example that we can see?
Links already provided

What is the link to your site?
hidden link

Images
Image 1 - CSS Code
Image 2 - Video not working on front-end
Image 3 - Custom Field
Image 4 - Implementation on the Page Template

Thank you

[Waqar]

Hi,

Thank you for contacting us and I'd be happy to assist.

I'm not exactly sure how this expansion of a simple div tag into a video embed code works.

But if it related to the WordPress 'the_content' filter, you can register a custom shortcode for that:

function custom_process_shortcode_func( $atts, $content = null ) {
	$content = do_shortcode($content);

	if(!empty($content)) {
		$content = apply_filters('the_content',$content);
		return $content;
	}
}

add_shortcode( 'custom_process_shortcode', 'custom_process_shortcode_func' );

The above code snippet can be included through either Toolset's custom code feature ( ref: https://toolset.com/documentation/adding-custom-code/using-toolset-to-add-custom-code/ ) or through the active theme's "functions.php" file.

After that, you can include the custom field's shortcode inside this newly registered custom shortcode like this:

[custom_process_shortcode][types field='post-field-slug'][/types][/custom_process_shortcode]

Note: Please replace [types field='post-field-slug'][/types] with your actual custom field's shortcode.

I hope this helps and let me know how it goes.

regards,
Waqar

[Rodrigo Lopes]

My issue is resolved now. Thank you!