Page Builder by SiteOrigin Shortcode

Below, you’ll find a detailed guide on how to add the Page Builder by SiteOrigin Shortcode to your WordPress website, including its parameters, examples, and PHP function code. Additionally, we’ll assist you with common issues that might cause the Page Builder by SiteOrigin Plugin shortcode not to show or not to work correctly.

Before starting, here is an overview of the Page Builder by SiteOrigin Plugin and the shortcodes it provides:

Page Builder by SiteOrigin

"Page Builder by SiteOrigin is an intuitive, grid-based plugin enabling you to create responsive page layouts. With siteorigin-panels, create stunning pages with drag-and-drop simplicity."

★★★★☆ (1001) Active Installs: 700000+ Tested with: 6.3.2 PHP Version: 5.6.20

Included Shortcodes:

• [self_video]

Page Builder by SiteOrigin [self_video] Shortcode

The SiteOrigin Panels shortcode ‘self_video’ is used to embed a video in a WordPress page or post. The shortcode function ‘siteorigin_panels_video_shortcode’ takes in attributes like URL, poster, skin, ratio, and autoplay. It uses these attributes to create a video widget instance. If the ‘src’ attribute is provided, it takes precedence over the ‘url’. If no ‘url’ or ‘src’ is provided, the function returns nothing. The function then returns the rendered widget as a string.

Shortcode: [self_video]

Parameters

Here is a list of all possible self_video shortcode parameters and attributes:

• url – The video’s source URL.
• src – Alternative parameter for the video’s source URL.
• poster – Image to show before video plays.
• skin – Defines the video player’s appearance.
• ratio – Sets the video aspect ratio, default is 1.777 (16:9).
• autoplay – Controls if the video starts playing automatically (0 for no, 1 for yes).

Examples and Usage

Basic example – A simple usage of the ‘self_video’ shortcode to embed a video in your content. In this case, the ‘url’ attribute is used to specify the source of the video.

[self_video url="http://example.com/video.mp4" /]

Advanced examples

Embedding a video with a custom poster image. The ‘poster’ attribute is used to specify the image that will be displayed before the video starts playing.

[self_video url="http://example.com/video.mp4" poster="http://example.com/poster.jpg" /]

Using the shortcode to embed a video with a custom skin and aspect ratio. The ‘skin’ attribute is used to specify the skin for the video player, and the ‘ratio’ attribute is used to specify the aspect ratio of the video.

[self_video url="http://example.com/video.mp4" skin="custom" ratio="1.333" /]

Embedding a video that will autoplay when the page loads. The ‘autoplay’ attribute is set to ‘1’ to enable autoplay.

[self_video url="http://example.com/video.mp4" autoplay="1" /]

PHP Function Code

In case you have difficulties debugging what causing issues with [self_video] shortcode, check below the related PHP functions code.

Shortcode line:

add_shortcode( 'self_video', 'siteorigin_panels_video_shortcode' );

Shortcode PHP function:

function siteorigin_panels_video_shortcode( $atts ) {
	/**
	 * @var string $url
	 * @var string $poster
	 * @var string $skin
	 */
	$instance = shortcode_atts( array(
		'url' => '',
		'src' => '',
		'poster' => '',
		'skin' => 'siteorigin',
		'ratio' => 1.777,
		'autoplay' => 0,
	), $atts );

	if ( ! empty( $instance['src'] ) ) {
		$instance['url'] = $instance['src'];
	}

	if ( empty( $instance['url'] ) ) {
		return;
	}

	ob_start();
	the_widget( 'SiteOrigin_Panels_Widgets_Video', $instance );

	return ob_get_clean();
}

Code file location:

siteorigin-panels/siteorigin-panels/widgets/widgets.php

Conclusion

Now that you’ve learned how to embed the Page Builder by SiteOrigin Plugin shortcode, understood the parameters, and seen code examples, it’s easy to use and debug any issue that might cause it to ‘not work’. If you still have difficulties with it, don’t hesitate to leave a comment below.