Support Forum
I have made a custom slider block, unfortunately it does not execute in gutenberg for preview.
$meta_boxes[] = [
'title' => 'Slider',
'id' => 'slider',
'description' => 'Flexibler Slider',
'type' => 'block',
'icon' => 'images-alt',
'category' => 'common',
//'context' => 'side',
'render_template' => get_template_directory() . '/blocks/slider/template.php',
'enqueue_style' => get_template_directory_uri() . '/blocks/slider/style.css',
'enqueue_script' => get_template_directory_uri() . '/blocks/slider/slick.min.js',
'supports' => [
//'align' => ['wide', 'full'],
'customClassName' => true,
'anchor' => true,
],
// Block fields.
'fields' => [
[
'id' => 'slider_group',
'type' => 'group',
'name' => 'Slides',
'default_state' => 'expanded',
'clone' => true,
// Drag and drop clones to reorder them?
'sort_clone' => true,
'fields' =>
[
array (
'id' => 'slide_image',
'type' => 'single_image',
'name' => 'Hintergrundbild',
'required' => true,
),
array (
'id' => 'slide_text',
'type' => 'wysiwyg',
'name' => 'Text',
'raw' => true,
'required' => false,
'options' => array(
'textarea_rows' => 4,
'media_buttons' => false,
'wpautop' => false,
'teeny' => false,
),
),
]
]
],
];
( function( $ ) {
function initSlider() {
console.log("initSlider!");
$('.slider').slick({
lazyLoad: 'ondemand',
dots: true,
infinite: true,
speed: 500,
fade: true,
cssEase: 'linear',
slidesToScroll: 1,
autoplay: true,
autoplaySpeed: 9000,
});
}
// Run when a document ready on the front end.
$( document ).ready( initSlider );
// Run when a block preview is done loading.
$( document ).on( 'mb_blocks_preview/slider', initSlider );
} )( jQuery );
Is there more information about the mb_blocks_preview event?
Script is executed fine in frontend.
Okay the script is working if I include it directly to the enqueue_script JS.
But it's not working from the template.php with <script> tag.
Hi SG,
The reason for this behavior is that the script should not be triggered when document ready. It should be triggered using a custom event: mb_blocks_preview/block_name
. For details, please see the docs:
https://docs.metabox.io/extensions/mb-blocks/#enqueue_script