nk-o
commented
4 years ago Hi @lanewaterman-em
Could you provide an exported code, so I can reproduce the bug on the test server?
Open lanewaterman-em opened 4 years ago
nk-o
commented
4 years ago Hi @lanewaterman-em
Could you provide an exported code, so I can reproduce the bug on the test server?
lanewaterman-em
commented
4 years ago Absolutely. Here's what I'm trying to use.
if ( function_exists( 'lazyblocks' ) ) :
lazyblocks()->add_block( array(
'id' => 1918,
'title' => 'Page Navigation',
'icon' => 'dashicons dashicons-arrow-right-alt2',
'keywords' => array(
),
'slug' => 'lazyblock/page-navigation',
'description' => 'This block automatically makes links to the previous and next pages.',
'category' => 'common',
'category_label' => 'common',
'supports' => array(
'customClassName' => true,
'anchor' => false,
'align' => array(
0 => 'wide',
1 => 'full',
),
'html' => false,
'multiple' => false,
'inserter' => true,
),
'ghostkit' => array(
'supports' => array(
'spacings' => false,
'display' => false,
'scrollReveal' => false,
),
),
'controls' => array(
),
'code' => array(
'editor_html' => '<div class="page-navigation">
<div class="link-prev">
<a href="#">Previous Page Name <span></span></a>
</div>
<div class="link-next">
<a href="#">Next Page Name <span></span></a>
</div>
</div>',
'editor_callback' => '',
'editor_css' => '',
'frontend_html' => '<?php /* Functions come from plugin: https://wordpress.org/plugins/next-page-not-next-post/ */ ?>
<?php if( function_exists(\'next_page_not_post\') && function_exists( \'previous_page_not_post\' ) ) : ?>
<div class="page-navigation row">
<div class="link-prev">
<?php echo do_shortcode( \'[previous_page anchor="<span></span> %title" loop="true" getPagesQuery="hierarchical=0"]\' ) ?>
<?php //echo previous_page_not_post( \'<span class="fa fa-chevron-left"></span> %title\', true, \'hierarchical=1&sort_column=menu_order\' ) ?>
</div>
<div class="link-next">
<?php echo do_shortcode( \'[next_page anchor="%title <span></span>" loop="true" getPagesQuery="hierarchical=0"]\' ) ?>
<?php //echo next_page_not_post( \'%title <span class="fa fa-chevron-right"></span>\', true, array( \'hierarchical\'=> 0, \'sort_column\' => \'menu_order\', \'exclude\' => array( 9,10,11,13 ) ) ) ?>
</div>
</div>
<?php endif; ?>',
'frontend_callback' => '',
'frontend_css' => '',
'show_preview' => 'always',
'single_output' => false,
'use_php' => true,
),
'condition' => array(
0 => 'page',
),
) );
lazyblocks()->add_block( array(
'id' => 1906,
'title' => 'featured image',
'icon' => 'dashicons dashicons-format-image',
'keywords' => array(
),
'slug' => 'lazyblock/featured-image',
'description' => 'Use this to display the featured image where you want.',
'category' => 'common',
'category_label' => 'common',
'supports' => array(
'customClassName' => true,
'anchor' => false,
'align' => array(
0 => 'wide',
1 => 'full',
2 => 'left',
3 => 'center',
4 => 'right',
),
'html' => false,
'multiple' => true,
'inserter' => true,
),
'ghostkit' => array(
'supports' => array(
'spacings' => false,
'display' => false,
'scrollReveal' => false,
),
),
'controls' => array(
'control_9d48fb4655' => array(
'label' => 'Caption',
'name' => 'caption',
'type' => 'toggle',
'child_of' => '',
'default' => '',
'characters_limit' => '',
'placeholder' => '',
'help' => 'Show featured image caption?',
'placement' => 'both',
'hide_if_not_selected' => 'false',
'save_in_meta' => 'false',
'save_in_meta_name' => '',
'required' => 'false',
'choices' => array(
),
'checked' => 'false',
'allow_null' => 'false',
'multiple' => 'false',
'allowed_mime_types' => array(
),
'alpha' => 'false',
'min' => '',
'max' => '',
'step' => '',
'date_time_picker' => 'date_time',
'multiline' => 'false',
'rows_min' => '',
'rows_max' => '',
'rows_label' => '',
'rows_add_button_label' => '',
'rows_collapsible' => 'true',
'rows_collapsed' => 'true',
),
),
'code' => array(
'editor_html' => '',
'editor_callback' => '',
'editor_css' => '',
'frontend_html' => '<?php
if ($attributes[\'caption\']) {
?>
<div class="captioned-img">
<?php
the_post_thumbnail( \'medium\', array(
\'alt\' => the_title_attribute( array(
\'echo\' => false,
) ),
) );
echo \'<p class="entry-thumb-caption">\' . get_post(get_post_thumbnail_id())->post_excerpt . \'</p>\';
?>
</div>
<?php
}
else {
the_post_thumbnail( \'medium\', array(
\'alt\' => the_title_attribute( array(
\'echo\' => false,
) ),
) );
}
?>',
'frontend_callback' => '',
'frontend_css' => '',
'show_preview' => 'always',
'single_output' => false,
'use_php' => true,
),
'condition' => array(
),
) );
lazyblocks()->add_block( array(
'id' => 16,
'title' => 'Tabbed Carousel container',
'icon' => 'dashicons dashicons-images-alt',
'keywords' => array(
),
'slug' => 'lazyblock/tabbed-carousel',
'description' => '',
'category' => 'common',
'category_label' => 'common',
'supports' => array(
'customClassName' => true,
'anchor' => true,
'align' => array(
0 => 'wide',
1 => 'full',
),
'html' => false,
'multiple' => true,
'inserter' => true,
),
'ghostkit' => array(
'supports' => array(
'spacings' => false,
'display' => false,
'scrollReveal' => false,
),
),
'controls' => array(
'control_28fbe04c58' => array(
'label' => 'slides',
'name' => 'slides',
'type' => 'repeater',
'child_of' => '',
'default' => '',
'characters_limit' => '',
'placeholder' => '',
'help' => '',
'placement' => 'content',
'hide_if_not_selected' => 'false',
'save_in_meta' => 'false',
'save_in_meta_name' => '',
'required' => 'false',
'choices' => array(
),
'checked' => 'false',
'allow_null' => 'false',
'multiple' => 'false',
'allowed_mime_types' => array(
),
'alpha' => 'false',
'min' => '',
'max' => '',
'step' => '',
'date_time_picker' => 'date_time',
'multiline' => 'false',
'rows_min' => '',
'rows_max' => '',
'rows_label' => '',
'rows_add_button_label' => '',
'rows_collapsible' => 'true',
'rows_collapsed' => 'true',
),
'control_bae91b4d7f' => array(
'label' => 'Slide Title',
'name' => 'slide_title',
'type' => 'text',
'child_of' => 'control_28fbe04c58',
'default' => '',
'characters_limit' => '',
'placeholder' => '',
'help' => 'This text is used in the header of the slide.',
'placement' => 'content',
'hide_if_not_selected' => 'false',
'save_in_meta' => 'false',
'save_in_meta_name' => '',
'required' => 'false',
'choices' => array(
),
'checked' => 'false',
'allow_null' => 'false',
'multiple' => 'false',
'allowed_mime_types' => array(
),
'alpha' => 'false',
'min' => '',
'max' => '',
'step' => '',
'date_time_picker' => 'date_time',
'multiline' => 'false',
'rows_min' => '',
'rows_max' => '',
'rows_label' => '',
'rows_add_button_label' => '',
'rows_collapsible' => 'true',
'rows_collapsed' => 'true',
),
'control_80392240c1' => array(
'label' => 'Slide Image',
'name' => 'slide_image',
'type' => 'image',
'child_of' => 'control_28fbe04c58',
'default' => '',
'characters_limit' => '',
'placeholder' => '',
'help' => 'This is the image used in the slide.',
'placement' => 'content',
'hide_if_not_selected' => 'false',
'save_in_meta' => 'false',
'save_in_meta_name' => '',
'required' => 'false',
'choices' => array(
),
'checked' => 'false',
'allow_null' => 'false',
'multiple' => 'false',
'allowed_mime_types' => array(
),
'alpha' => 'false',
'min' => '',
'max' => '',
'step' => '',
'date_time_picker' => 'date_time',
'multiline' => 'false',
'rows_min' => '',
'rows_max' => '',
'rows_label' => '',
'rows_add_button_label' => '',
'rows_collapsible' => 'true',
'rows_collapsed' => 'true',
),
'control_867bd74e16' => array(
'label' => 'Slide Text',
'name' => 'slide_text',
'type' => 'rich_text',
'child_of' => 'control_28fbe04c58',
'default' => '',
'characters_limit' => '',
'placeholder' => '',
'help' => 'This is the text content to be displayed in the slide.',
'placement' => 'content',
'hide_if_not_selected' => 'false',
'save_in_meta' => 'false',
'save_in_meta_name' => '',
'required' => 'false',
'choices' => array(
),
'checked' => 'false',
'allow_null' => 'false',
'multiple' => 'false',
'allowed_mime_types' => array(
),
'alpha' => 'false',
'min' => '',
'max' => '',
'step' => '',
'date_time_picker' => 'date_time',
'multiline' => 'false',
'rows_min' => '',
'rows_max' => '',
'rows_label' => '',
'rows_add_button_label' => '',
'rows_collapsible' => 'true',
'rows_collapsed' => 'true',
),
'control_8858c84713' => array(
'label' => 'Button Text',
'name' => 'button_text',
'type' => 'text',
'child_of' => 'control_28fbe04c58',
'default' => '',
'characters_limit' => '',
'placeholder' => '',
'help' => 'This is the text shown on the call to action button.',
'placement' => 'content',
'hide_if_not_selected' => 'false',
'save_in_meta' => 'false',
'save_in_meta_name' => '',
'required' => 'false',
'choices' => array(
),
'checked' => 'false',
'allow_null' => 'false',
'multiple' => 'false',
'allowed_mime_types' => array(
),
'alpha' => 'false',
'min' => '',
'max' => '',
'step' => '',
'date_time_picker' => 'date_time',
'multiline' => 'false',
'rows_min' => '',
'rows_max' => '',
'rows_label' => '',
'rows_add_button_label' => '',
'rows_collapsible' => 'true',
'rows_collapsed' => 'true',
),
'control_ab097745c3' => array(
'label' => 'Button Link',
'name' => 'button_link',
'type' => 'url',
'child_of' => 'control_28fbe04c58',
'default' => '',
'characters_limit' => '',
'placeholder' => '',
'help' => 'This is where the call to action button sends the reader.',
'placement' => 'content',
'hide_if_not_selected' => 'false',
'save_in_meta' => 'false',
'save_in_meta_name' => '',
'required' => 'false',
'choices' => array(
),
'checked' => 'false',
'allow_null' => 'false',
'multiple' => 'false',
'allowed_mime_types' => array(
),
'alpha' => 'false',
'min' => '',
'max' => '',
'step' => '',
'date_time_picker' => 'date_time',
'multiline' => 'false',
'rows_min' => '',
'rows_max' => '',
'rows_label' => '',
'rows_add_button_label' => '',
'rows_collapsible' => 'true',
'rows_collapsed' => 'true',
),
'control_78aac94f4e' => array(
'label' => 'Slide Navigation Text',
'name' => 'slide_navigation_text',
'type' => 'text',
'child_of' => 'control_28fbe04c58',
'default' => '',
'characters_limit' => '',
'placeholder' => '',
'help' => 'This text is used in the slide navigation area below the slideshow. Keep it short so it fits the space.',
'placement' => 'content',
'hide_if_not_selected' => 'false',
'save_in_meta' => 'false',
'save_in_meta_name' => '',
'required' => 'false',
'choices' => array(
),
'checked' => 'false',
'allow_null' => 'false',
'multiple' => 'false',
'allowed_mime_types' => array(
),
'alpha' => 'false',
'min' => '',
'max' => '',
'step' => '',
'date_time_picker' => 'date_time',
'multiline' => 'false',
'rows_min' => '',
'rows_max' => '',
'rows_label' => '',
'rows_add_button_label' => '',
'rows_collapsible' => 'true',
'rows_collapsed' => 'true',
),
),
'code' => array(
'editor_html' => '',
'editor_callback' => '',
'editor_css' => '',
'frontend_html' => '<div class="fl-module fl-module-content-slider fl-node-56eefe4c9538f rc-content-slider" data-node="56eefe4c9538f" data-animation-delay="0.0">
<div class="fl-module-content fl-node-content">
<div class="fl-content-slider">
<div class="bx-wrapper" >
<div class="bx-viewport" aria-live="polite" >
<?php
$i = 0;
?>
<div class="carousel-tabbed splide">
<div class="splide__track">
<div class="splide__list">
<?php
foreach( $attributes[\'slides\'] as $inner ):
?>
<div class="fl-slide fl-slide-<?php echo $i; ?> fl-slide-text-left splide__slide">
<div class="fl-slide-mobile-photo">
<img class="fl-slide-mobile-photo-img" src="<?php echo esc_url( $inner[\'slide_image\'][\'url\'] ); ?>" alt="<?php echo esc_url( $inner[\'slide_image\'][\'alt\'] ); ?>" sizes="(max-width: 413px) 100vw, 413px">
</div>
<a class="fl-slide-bg-link" href="<?php echo $inner[\'button_link\']; ?>" target="_self"></a>
<div class="fl-slide-foreground clearfix">
<div class="fl-slide-content-wrap">
<div class="fl-slide-content">
<h2 class="fl-slide-title"><?php echo $inner[\'slide_title\']; ?></h2>
<div class="fl-slide-text">
<?php echo $inner[\'slide_text\']; ?>
</div>
<div class="fl-slide-cta-button">
<div class="fl-button-wrap fl-button-width-auto fl-button-has-icon">
<a href="<?php echo $inner[\'button_link\']; ?>" target="_self" class="fl-button" role="button">
<span class="fl-button-text"><?php echo $inner[\'button_text\']; ?></span>
<i class="fl-button-icon fl-button-icon-after fa fa fa-angle-right"></i>
</a>
</div>
</div>
</div>
</div>
<div class="fl-slide-photo-wrap">
<div class="fl-slide-photo">
<a href="<?php echo $inner[\'button_link\']; ?>" target="_self">
<img class="fl-slide-photo-img" src="<?php echo esc_url( $inner[\'slide_image\'][\'url\'] ); ?>" alt="<?php echo esc_url( $inner[\'slide_image\'][\'alt\'] ); ?>">
</a>
</div>
</div>
</div>
</div>
<?php
$i++;
endforeach;
?>
</div>
</div>
</div>
</div>
</div>
<div class="carousel-tabbed-controls splide fixed-six" id="secondary-slider">
<div class="splide__track">
<ul class="fl-content-slider-labels splide__list labels-<?php echo $i; ?>">
<?php
foreach( $attributes[\'slides\'] as $inner ):
?>
<li class="splide__slide"><?php echo $inner[\'slide_navigation_text\']; ?></li>
<?php
endforeach;
?>
</ul>
</div>
</div>
</div>
</div>
</div>
<script type="text/javascript">
<!--
document.addEventListener( \'DOMContentLoaded\', function () {
var secondarySlider = new Splide( \'#secondary-slider\', {
fixedWidth : 100,
//height : 60,
gap : 0,
arrows : false,
cover : true,
isNavigation: true,
pagination : false,
//focus : \'center\',
breakpoints : {
\'600\': {
fixedWidth: 66,
height : 40,
}
},
} ).mount();
var primarySlider = new Splide( \'.splide\', {
//type : \'loop\',
type : \'fade\',
// heightRatio: 0.5,
pagination : false,
arrows : false,
cover : false,
rewind : true,
autoplay : true,
} ); // do not call mount() here.
primarySlider.sync( secondarySlider ).mount();
} );
//--></script>',
'frontend_callback' => '',
'frontend_css' => '',
'show_preview' => 'always',
'single_output' => false,
'use_php' => true,
),
'condition' => array(
),
) );
endif;`
nk-o
commented
4 years ago Your blocks with your code working with no problem:
lanewaterman-em
commented
4 years ago functions.zip Can you please look at my functions.php file and make sure I'm using the export code correctly?
nk-o
commented
4 years ago I don't see any problems here. Maybe something wrong with WordPress installation. I don't know what may happen, on all our sites it works.
ledjay
commented
4 years ago Hi there, thanks for your awesome work, it makes my life so easyer !
Unfortunately I have the same issue.
I tried :
...and the blocks still refuses to show up.
I run out of ideas, can you help me ?
Thanks !
commercial-hippie
commented
4 years ago I ran into the same issue but solved it by doing the following:
add_action( 'plugins_loaded', function () {
include __DIR__ . '/includes/lazyblocks/goals.php'; // Add the block code into a file.
}, 50 ); // 50 to make sure it loads after lazy-blocks@commercial-hippie thanks for your update, unfortunately it doesn't seems to work when I put my include add_action on my function.php. Do you put it on a custom plugin or in your function.php file ?
commercial-hippie
commented
4 years ago I usually do it in a custom plugin.
lanewaterman-em
commented
4 years ago @nk-o I've tried it on a different server and I'm still not able to get it working either. Is there a way I can send you an admin login for one of the sites so you can look into it?
@commercial-hippie would you consider sharing your plugin file? I haven't played with creating custom plugins yet but I would like to see if your method helps me. I tried the add_action in my functions file like @ledjay but it didn't work for me there either.
commercial-hippie
commented
4 years ago Depends on the plugin complexity but for something small it generally looks like this:
// wp-content/plugins/my-custom-plugin/my-custom-plugin.php
// lazyblocks PHP in:
// wp-content/plugins/my-custom-plugin/includes/lazyblocks/goals.php
<?php
/*
Plugin Name: My Custom Plugin
Description: Helper plugin.
Version: 1.0.0
Author: Author
Author URI: https://mysite.com
*/
class MyCustomPluginClass
{
public function __construct()
{
add_action( 'plugins_loaded', [ $this, 'plugins_loaded' ], 50 );
}
public function plugins_loaded()
{
include __DIR__ . '/includes/lazyblocks/goals.php';
}
}
new MyCustomPluginClass();
MasterKale
commented
4 years ago I want to chime in and say that I can see my custom Lazy Blocks in the Pages editor after creating a simple custom plugin containing the exported PHP code (h/t to @commercial-hippie):
Unfortunately, the list of blocks in /wp-admin/edit.php?post_type=lazyblocks is still empty:
Is there a way to get my plugin's custom blocks to appear in the Lazy Blocks settings? If not, what's the suggested way of using version control to track changes to custom Lazy Blocks while still being able to edit them within WordPress?
janwidmer
commented
4 years ago Any news on this issue? I am having the same problem as @MasterKale, I have my blocks available in the Gutenberg Block Selector, but the List in the Menu Point Lazy Blocks is empty. @nk-o is that intended behaviour?
Using a fresh installation of Wordpress 5.5 with thw twentytwenty themen without any other plugins..
nk-o
commented
4 years ago @janwidmer when you export blocks to PHP, it will be used in your PHP code. In the admin list, you will see only registered in the database blocks (custom post types). If you want to export/import blocks, you need to export to JSON.
janwidmer
commented
4 years ago @nk-o thanks for clarifying. Since the json import / export is a manual process, it would be really nice, if there would be an automated process to create the blocks as database blocks. So either extend the PHP import to create database blocks or automate the json solution. Because as soon as I need to adjust / extend one of my base blocks for customer X, I have a problem, when I used the php import.
When having a lot of wordpress projects, every step which can be automated for new project is one less manual step.. ;-). I also wrote that into the Google Form Survey.
BR Jan
sbdgithub
commented
3 years ago Hi @nk-o ,
i have a problem with the export / import (json).
But when I want to open / edit the module, the page is white and there is an error:
Error: Minified React error #185; visit https://reactjs.org/docs/error-decoder.html?invariant=185 for the full message or use the non-minified dev environment for full errors and additional helpful warnings. at Sb (http://localhost/wei/wp/wp-includes/js/dist/vendor/react-dom.min.js:212:410) at Mg (http://localhost/wei/wp/wp-includes/js/dist/vendor/react-dom.min.js:85:80) at e (http://localhost/wei/wp/wp-includes/js/dist/data.min.js:2:27833) at http://localhost/wei/wp/wp-includes/js/dist/data.min.js:2:27917 at http://localhost/wei/wp/wp-includes/js/dist/data.min.js:2:21839 at Array.forEach (<anonymous>) at o (http://localhost/wei/wp/wp-includes/js/dist/data.min.js:2:21811) at http://localhost/wei/wp/wp-includes/js/dist/data.min.js:2:19038 at p (http://localhost/wei/wp/wp-includes/js/dist/data.min.js:2:11067) at http://localhost/wei/wp/wp-includes/js/dist/redux-routine.min.js:2:9797
LB Version 2.2.0 WP Version Version 5.5.3
Do I have to pay attention to anything else?
Many Thanks, André
nk-o
commented
3 years ago Hey @sbdgithub
I don't know actually... I have tested your file and it is working with no problems on my test server.
sbdgithub
commented
3 years ago Hi @nk-o,
I've found the problem. I have a function that only shows certain blocks (So that not all blocks are always displayed)
add_filter ('allowed_block_types', 'eaa_allowed_block_types');
function eaa_allowed_block_types ($ allowed_blocks) {
return array (
'lazyblock/hero',
'lazyblock/slider',
'lazyblock/text-media',
'lazyblock/text-slider'
);
}If I comment out this function - it works.
Hmm.
All the best André
I made some Lazy Blocks on a development site for a template that is being applied to several live sites. I copied the Export code and put it into the functions.php file. I installed and activated the theme on one of the new sites. I installed and activated the Lazy Blocks plugin. When I go to the list of Lazy Blocks it is empty and my blocks aren't showing in the Gutenberg editor.