Below, you’ll find a detailed guide on how to add the Gallery PhotoBlocks 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 Gallery PhotoBlocks Plugin shortcode not to show or not to work correctly.
Before starting, here is an overview of the Gallery PhotoBlocks Plugin and the shortcodes it provides:
![Plugin Icon](https://ps.w.org/photoblocks-grid-gallery/assets/icon-128x128.jpg?rev=1830817)
"Gallery PhotoBlocks is a dynamic WordPress plugin that effortlessly transforms your images into stunning grid-style galleries. Enhance your website's visual appeal with photoblocks-grid-gallery."
- [photoblocks]
Gallery PhotoBlocks [photoblocks] Shortcode
The ‘photoblocks’ shortcode is used to display a specific gallery using its ID. It fetches gallery data from the database, applies default and custom settings, and enqueues necessary scripts and styles.
Shortcode: [photoblocks]
Parameters
Here is a list of all possible photoblocks shortcode parameters and attributes:
id
– Unique ID used to select a specific gallery.data
– Contains gallery settings and configurations.resize_images
– Determines whether to resize images or not.fancybox3
– A parameter that enables the FancyBox3 lightbox script.magnific-popup
– A parameter that enables the Magnific Popup lightbox script.blocks
– Contains a set of images within the gallery.shuffle
– Determines whether to randomize the order of images.compress_html
– Parameter to decide if HTML output should be compressed.
Examples and Usage
Basic example – The shortcode displays a photoblock gallery by referencing its ID.
[photoblocks id=1 /]
Advanced examples
Using the shortcode to display a photoblock gallery by referencing both ID and specifying the lightbox type. If the lightbox type is not found, it will default to the one specified in the plugin settings.
[photoblocks id=1 lightbox="fancybox" /]
Using the shortcode to display a photoblock gallery by referencing ID, specifying the lightbox type and enabling image shuffling. With ‘shuffle’ set to ‘1’, the images in the gallery will appear in a random order each time the page is loaded.
[photoblocks id=1 lightbox="magnific" shuffle="1" /]
Using the shortcode to display a photoblock gallery by referencing ID, specifying the lightbox type, enabling image shuffling and disabling image resizing. With ‘resize_images’ set to ‘0’, the images will be displayed in their original size.
[photoblocks id=1 lightbox="fancybox" shuffle="1" resize_images="0" /]
PHP Function Code
In case you have difficulties debugging what causing issues with [photoblocks]
shortcode, check below the related PHP functions code.
Shortcode line:
add_shortcode( 'photoblocks', array( $plugin_public, 'shortcode_handler' ) );
Shortcode PHP function:
function shortcode_handler( $atts )
{
global $wpdb ;
$data = $wpdb->get_row( $wpdb->prepare( 'SELECT * FROM ' . $wpdb->photoblocks . ' WHERE id=%d', intval( $atts['id'] ) ), ARRAY_A );
if ( $data == null ) {
return "<small class='pb-gallery-error'>No gallery found with ID " . $atts['id'] . '</small>';
} else {
$gallery_values = json_decode( $data['data'], true );
$gallery_values['site_url'] = get_site_url();
if ( !array_key_exists( 'resize_images', $gallery_values ) ) {
$gallery_values['resize_images'] = '1';
}
$this->values[$atts['id']] = array_merge( $this->settings->default_values(), $gallery_values );
$this->values[$atts['id']]['id'] = $atts['id'];
$gallery = $this->values[$atts['id']];
foreach ( $atts as $k => $v ) {
$this->values[$atts['id']][$k] = $v;
$gallery[$k] = $v;
}
if ( $this->lightbox( $atts['id'] ) == 'fancybox' ) {
wp_enqueue_script(
'fancybox3',
plugin_dir_url( __FILE__ ) . 'premium/jquery.fancybox.min.js',
array( 'jquery' ),
'3.5.6',
false
);
wp_enqueue_style(
'fancybox3',
plugin_dir_url( __FILE__ ) . 'premium/jquery.fancybox.min.css',
array(),
'3.5.6',
'all'
);
}
if ( $this->lightbox( $atts['id'] ) == 'magnific' ) {
wp_enqueue_script(
'magnific-popup',
plugin_dir_url( __FILE__ ) . 'js/jquery.magnific-popup.min.js',
array( 'jquery' ),
$this->version,
false
);
wp_enqueue_style(
'magnific-popup',
plugin_dir_url( __FILE__ ) . 'css/magnific-popup.css',
array(),
$this->version,
'all'
);
}
$blocks = array();
$blocks_arr = json_decode( $data['blocks'] );
$geometry = array();
if ( is_array( $blocks_arr ) ) {
if ( isset( $this->values[$atts['id']]['shuffle'] ) && $this->values[$atts['id']]['shuffle'] == '1' ) {
foreach ( $blocks_arr as $b ) {
if ( $b->type == 'image' ) {
$geometry[] = $b->geometry;
}
unset( $b );
}
shuffle( $blocks_arr );
foreach ( $blocks_arr as &$b ) {
if ( $b->type == 'image' ) {
$b->geometry = array_shift( $geometry );
}
unset( $b );
}
}
$allowed_posts = array( 'image', 'empty' );
$has_posts = false;
foreach ( $blocks_arr as $b ) {
if ( !in_array( $b->type, $allowed_posts ) ) {
$b->type = 'empty';
}
$block = new PhotoBlock( $this->values[$atts['id']], $b, $this->settings );
$blocks[] = apply_filters( 'photoblock_process_block', $block );
}
}
ob_start();
include 'partials/photoblocks-public-display.php';
$html = ob_get_clean();
if ( $gallery['compress_html'] == 1 && !isset( $_GET['debug'] ) ) {
$html = str_replace( "\n", '', $html );
$html = str_replace( "\r", '', $html );
$html = preg_replace( '/\\s+/', ' ', $html );
}
return $html;
}
}
Code file location:
photoblocks-grid-gallery/photoblocks-grid-gallery/includes/class-photoblocks.php
Conclusion
Now that you’ve learned how to embed the Gallery PhotoBlocks 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.
Leave a Reply