Below, you’ll find a detailed guide on how to add the Gallery Box Shortcodes to your WordPress website, including their parameters, examples, and PHP function code. Additionally, we’ll assist you with common issues that might cause the Gallery Box Plugin shortcodes not to show or not to work correctly.
Before starting, here is an overview of the Gallery Box Plugin and the shortcodes it provides:
"Gallery Box is a dynamic WordPress plugin that allows you to seamlessly create and manage stunning photo galleries. Customize your display with this user-friendly tool."
- [GalleryBox]
- [gbox_youtube]
- [gbox_vimeo]
Gallery Box [GalleryBox] Shortcode
The GalleryBox shortcode allows you to display a gallery on your website. It retrieves and displays images from the ‘gallery_box’ post type. The ‘id’ attribute specifies the gallery to display. It supports various media types including images, YouTube, Vimeo, and iFrame content. Shortcode: [GalleryBox id=””] If the specified gallery doesn’t exist or is empty, it will display an error message.
Shortcode: [GalleryBox]
Parameters
Here is a list of all possible GalleryBox shortcode parameters and attributes:
id– Identifier that specifies the particular gallery box to display
Examples and Usage
Basic example – A simple usage of the GalleryBox shortcode to display a gallery box by its ID.
[GalleryBox id=1 /]Advanced examples
Display a gallery box by using its ID. If the gallery box with the given ID is not found, it will try to display a gallery box by its title.
[GalleryBox id=1 title="My Gallery" /]Display a gallery box by using its ID and specify the number of posts to display per page. If the gallery box with the given ID is not found, it will try to display a gallery box by its title.
[GalleryBox id=1 title="My Gallery" posts_per_page=5 /]Display a gallery box by using its ID and specify the post status to display. If the gallery box with the given ID is not found, it will try to display a gallery box by its title.
[GalleryBox id=1 title="My Gallery" post_status="publish" /]PHP Function Code
In case you have difficulties debugging what causing issues with [GalleryBox] shortcode, check below the related PHP functions code.
Shortcode line:
add_shortcode('GalleryBox','galleryBox_shortcode');Shortcode PHP function:
function galleryBox_shortcode($atts, $content = null){
ob_start();
global $post;
$gallery_box = shortcode_atts( array(
'id'=> '',
), $atts );
//Query args
$args = array(
'post_type' => 'gallery_box',
'post_status' => 'publish',
'posts_per_page' => 1,
'p' => $gallery_box['id']
);
//start WP_Query
$loop= new WP_Query($args);
$number=1;
?>
<?php if ($loop -> have_posts() ) : ?>
<?php while ( $loop->have_posts()) : $loop->the_post();
$post_ID = $post->ID;
//for typography option
if(get_option('Lightbox_settings')){
$gbox_lightbox = get_option('Lightbox_settings');
}
$gbox_use_typography = isset( $gbox_lightbox['use_typography'] ) ? $gbox_lightbox['use_typography'] : 'yes';
?>
<div id="boxGallery" class="g-box<?php echo esc_attr($post_ID); ?> Gallery-container gallery-box <?php if($gbox_use_typography == 'yes'): ?>gbox-font<?php endif; ?>">
<!-- Regular images -->
<?php
//simple image gallery meta
$gbox_simple_imgs = get_post_meta(get_the_ID(), 'simple_imgs', true);
//advance image gallery meta
$gbox_img_main = get_post_meta(get_the_ID(), 'img_main', true);
$image_title = !empty( $gbox_img_main[0]['image_title']) ? $gbox_img_main[0]['image_title'] : '';
$image_small = !empty( $gbox_img_main[0]['image_small']) ? $gbox_img_main[0]['image_small'] : '';
//Portfolio gallery meta
$gbox_portfo_main = get_post_meta(get_the_ID(), 'portfo_main', true);
$portfolio_title = !empty( $gbox_portfo_main[0]['portfolio_title']) ? $gbox_portfo_main[0]['portfolio_title'] : '';
$port_img = !empty( $gbox_portfo_main[0]['port_img']) ? $gbox_portfo_main[0]['port_img'] : '';
//Youtube gallery meta
$gbox_youtube_main = get_post_meta(get_the_ID(),'youtube_main', true);
$you_url = !empty( $gbox_youtube_main[0]['you_url']) ? $gbox_youtube_main[0]['you_url'] : '';
//Vimeo gallery meta
$gbox_vimeo_main = get_post_meta(get_the_ID(), 'vimeo_main', true);
$vimeo_url = !empty( $gbox_vimeo_main[0]['vimeo_url']) ? $gbox_vimeo_main[0]['vimeo_url'] : '';
//Soundcloud gallery meta
$gbox_Soundcloud_main = get_post_meta(get_the_ID(), 'Soundcloud_main', true);
$sound_id = !empty( $gbox_Soundcloud_main[0]['sound_id']) ? $gbox_Soundcloud_main[0]['sound_id'] : '';
//Iframe gallery meta
$gbox_iframe_main = get_post_meta(get_the_ID(), 'iframe_main', true);
$iframe_url = !empty( $gbox_iframe_main[0]['iframe_url']) ? $gbox_iframe_main[0]['iframe_url'] : '';
if(!empty($gbox_simple_imgs)){
// Simple image gallery
do_action( 'gallery_box_simple_image', get_the_ID() );
}
if( !empty($image_title) || !empty($image_small) ){
// Advance image gallery
do_action( 'gallery_box_image', get_the_ID() );
}
if( !empty($portfolio_title) || !empty($port_img) ){
// portfolio gallery
do_action( 'gallery_box_portfolio', get_the_ID() );
}
if(!empty($you_url)){
//youtube gallery
do_action( 'gallery_box_youtube', get_the_ID() );
}
if(!empty($vimeo_url)){
//vimeo gallery
do_action( 'gallery_box_vimeo', get_the_ID() );
}
if(!empty($sound_id)){
//Soundcloud gallery
esc_html_e( 'Soundcloud Gallery No longer Available!!','gbox' );
}
if(!empty($iframe_url)){
//iframe gallery
do_action( 'gallery_box_iframe', get_the_ID() );
}
?>
</div>
<?php endwhile; ?>
<?php wp_reset_postdata(); ?>
<?php else: ?>
<div class="gbox-error">
<?php esc_html_e('No gallery item found!','gbox'); ?>
</div>
<?php endif; ?>
<?php
$galleryBox = ob_get_clean();
return $galleryBox;
}
Code file location:
gallery-box/gallery-box/includes/gallerybox-shortcode.phpGallery Box [gbox_youtube] Shortcode
The Gallery-box plugin shortcode ‘gbox_youtube’ embeds YouTube videos into your WordPress site. The shortcode uses the YouTube video ID, height, width, and caption attributes. This shortcode function generates a div with the class “gallery-box”. It creates a clickable image that opens the YouTube video in a pop-up window. The image is the video’s thumbnail from YouTube.
Shortcode: [gbox_youtube]
Parameters
Here is a list of all possible gbox_youtube shortcode parameters and attributes:
id– It’s the unique identifier of the YouTube video.height– Defines the height of the YouTube video box.width– Sets the width of the YouTube video box.caption– Specifies the caption for the YouTube video.
Examples and Usage
Basic example – Embeds a YouTube video in the gallery box with a predefined ID, height, and width.
[gbox_youtube id="CXkl1FgeM7M" height="300" width="800" /]Advanced examples
Embed a YouTube video in the gallery box with a custom ID, height, width, and caption. The caption will be displayed as the alt and title attribute for the video.
[gbox_youtube id="dQw4w9WgXcQ" height="400" width="600" caption="Rick Astley - Never Gonna Give You Up" /]Display a YouTube video in the gallery box with a different ID and default height and width parameters. The ID is the only required attribute, and if the height and width are not specified, it will default to 300 and 800 respectively.
[gbox_youtube id="3tmd-ClpJxA" /]Embed a YouTube video in the gallery box with all default parameters. This will display the video with the ID ‘CXkl1FgeM7M’, a height of 300, a width of 800, and a caption of ‘simple Youtube video’.
[gbox_youtube /]PHP Function Code
In case you have difficulties debugging what causing issues with [gbox_youtube] shortcode, check below the related PHP functions code.
Shortcode line:
add_shortcode('gbox_youtube','n_single_youtube_gbox');Shortcode PHP function:
function n_single_youtube_gbox( $atts, $content = null ) {
$g_youtube = shortcode_atts( array(
'id' => 'CXkl1FgeM7M',
'height' => 300,
'width' => 800,
'caption' => __('simple Youtube video','gbox')
), $atts );
$youtube_url='//youtu.be/'.$g_youtube['id'];
$youtube_img_url='//img.youtube.com/vi/'.$g_youtube['id'].'/0.jpg';
return '<div class="gallery-box"><a class="gclick" href="'.esc_url($youtube_url).'" data-poptrox="youtube,'.esc_attr($g_youtube['width']).'x'.esc_attr($g_youtube['height']).'"><img src="'.esc_url($youtube_img_url).'" width="'.esc_attr($g_youtube['width']).'" height="'.esc_attr($g_youtube['height']).'" alt="'.esc_attr($g_youtube['caption']).'" title="'.esc_attr($g_youtube['caption']).'" /></a></div>';
}
Code file location:
gallery-box/gallery-box/includes/other-shortcode.phpGallery Box [gbox_vimeo] Shortcode
The Gallery-Box plugin shortcode, ‘gbox_vimeo’, allows you to embed Vimeo videos into your WordPress site. It enables customization of video dimensions and captions. The PHP function ‘n_single_vimeo_gbox’ handles the shortcode attributes, like video ‘id’, ‘height’, ‘width’, and ‘caption’. It constructs the Vimeo video URL and thumbnail image URL using these attributes. Finally, it returns a div element containing the video link and image.
Shortcode: [gbox_vimeo]
Parameters
Here is a list of all possible gbox_vimeo shortcode parameters and attributes:
id– The unique identifier of the Vimeo video.height– Defines the height of the video player.width– Sets the width of the video player.caption– Adds a caption to the video display.
Examples and Usage
Basic Example – A simple way to utilize the ‘gbox_vimeo’ shortcode is by merely referring to the Vimeo video ID. The default height and width will be used in this case.
[gbox_vimeo id=121840700 /]Advanced Examples
Adjusting the video size: You can easily customize the video size by changing the height and width parameters. In this example, we are setting the width to 900 and the height to 500.
[gbox_vimeo id=121840700 width=900 height=500 /]Adding a caption: It’s also possible to add a caption to the video. The caption will be displayed as the alt and title text of the video. In this example, we’re adding the caption “My Vimeo Video”.
[gbox_vimeo id=121840700 caption="My Vimeo Video" /]Combining all parameters: This example combines all the parameters. We’re setting the video ID, customizing the height and width, and adding a caption.
[gbox_vimeo id=121840700 width=900 height=500 caption="My Vimeo Video" /]PHP Function Code
In case you have difficulties debugging what causing issues with [gbox_vimeo] shortcode, check below the related PHP functions code.
Shortcode line:
add_shortcode('gbox_vimeo','n_single_vimeo_gbox');Shortcode PHP function:
function n_single_vimeo_gbox( $atts, $content = null ) {
$g_vimeo = shortcode_atts( array(
'id' => '121840700',
'height' => 400,
'width' => 800,
'caption' => __('simple Vimeo video','gbox')
), $atts );
$vimeo_url='//vimeo.com/'.$g_vimeo['id'];
$vimeo_img_url='//i.vimeocdn.com/video/'.$g_vimeo['id'].'_640.jpg';
return '<div class="gallery-box"><a class="gclick" href="'.esc_url($vimeo_url).'" data-poptrox="vimeo,'.esc_attr($g_vimeo['width']).'x'.esc_attr($g_vimeo['height']).'"><img src="'.esc_url($vimeo_img_url).'" width="'.esc_attr($g_vimeo['width']).'" height="'.esc_attr($g_vimeo['height']).'" alt="'.esc_attr($g_vimeo['caption']).'" title="'.esc_attr($g_vimeo['caption']).'" /></a></div>';
}
Code file location:
gallery-box/gallery-box/includes/other-shortcode.phpConclusion
Now that you’ve learned how to embed the Gallery Box Plugin shortcodes, 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.
Leave a Reply