This is an example for adding a relatively simple custom component to the component list. The following PHP code would add a new custom button to the component list.
//sample html content insertion class editus_SimpleHtmlContent { public function __construct(){ add_action('wp_enqueue_scripts', array($this,'scripts')); } function scripts() { // the following line adds the content that would be inserted add_filter('lasso_components',array($this,'add_SimpleHtmlContent_content'),10,1); // the following adds the button for the UI add_action( 'lasso_toolbar_components', array($this,'add_SimpleHtmlContent_button'), 10 ); // if you need to add extra JS or CSS files, add them here //wp_enqueue_style( ..blah blah... ); //wp_enqueue_script( ..blah blah... ); } function editus_SimpleHtmlContent_content() { return '<p><span>***</span></p>'; } function add_SimpleHtmlContent_content( $array ){ $custom = array( 'dotdotdot' => array( 'name' => __('Separator','lasso'), 'content' => self::editus_SimpleHtmlContent_content(), ) ); return array_merge( $array, $custom ); } function add_SimpleHtmlContent_button( ) { ?> <style> #lasso-toolbar--components__list .lasso-toolbar--component__SimpleHtmlContent:before { content: "\f11c"; font-family: 'dashicons' !important; } </style> <li data-type="SimpleHtmlContent" title="<?php esc_attr_e( 'Separator', 'lasso' );?>" class="quote lasso-toolbar--component__SimpleHtmlContent"></li> <?php } } new editus_SimpleHtmlContent();
The following example is similar to the above except that the content contains a shortcode:
//sample shortcode insertion class editus_shortcode1 { public function __construct(){ add_action('wp_enqueue_scripts', array($this,'scripts')); } function scripts() { // the following line adds the content that would be inserted add_filter('lasso_components',array($this,'add_shortcode1_content'),10,1); // the following adds the button for the UI add_action( 'lasso_toolbar_components', array($this,'add_shortcode1_button'), 10 ); // if you need to add extra JS or CSS files, add them here //wp_enqueue_style( ..blah blah... ); //wp_enqueue_script( ..blah blah... ); } //how to return shortcode content function editus_shortcode1_content() { $code_wrapped = lasso_wrap_shortcodes( "[shortcode1]"); return do_shortcode( $code_wrapped ); } function add_shortcode1_content( $array ){ $custom = array( 'shortcode1' => array( 'name' => __('Shortcode1','lasso'), 'content' => self::editus_shortcode1_content(), ) ); return array_merge( $array, $custom ); } function add_shortcode1_button( ) { ?> <style> #lasso-toolbar--components__list .lasso-toolbar--component__shortcode1:before { content: "SC1"; } ul.lasso-component--controls { padding-left:0; } </style> <li data-type="shortcode1" title="<?php esc_attr_e( 'Shortcode1', 'lasso' );?>" class="quote lasso-toolbar--component__shortcode1"></li> <?php } }