Create custom field

HI Alex,

I tried to do as you told me but I have a problem.
I cannot retrieve what I entered in the fields of my widget when displaying the passage of my variables to the template in the get_template_variables function.
I have the name of my field in the instances but it is empty whereas if I open the widget in the BO, my information is saved.

Do you have an idea?
thank you so much

Hi Alex

The first widget :

<?php
/*
Widget Name: Background
Description: Bloc background
Author: Michaël DUBOIS
*/

class MD_S0Widget_BlocBackground_Widget extends SiteOrigin_Widget {
	function __construct() {
		parent::__construct(
			'mdsow-blocbackground',
			'Background',
			array(
				'description' => 'Bloc background',
				'help' => ''
			),
			array(

			),
			false,
			plugin_dir_path(__FILE__)
		);
	}

	function get_widget_form() {
		return array(
            'bck2prc' => array(
                'type' => 'select',
                'label' =>  'Size background 2',
                'default' => '',
                'options' => array(
                    '' => '',
                    'prc5' =>  'prc5',
                    'prc10' =>  'prc10',
                    'prc15' =>  'prc15',
                    'prc20' =>  'prc20',
                    'prc25' =>  'prc25',
                    'prc30' =>  'prc30',
                    'prc35' =>  'prc35',
                    'prc40' =>  'prc40',
                    'prc45' =>  'prc45',
                    'prc50' =>  'prc50',
                    'prc55' =>  'prc55',
                    'prc60' =>  'prc55',
                    'prc65' =>  'prc65',
                    'prc70' =>  'prc70',
                    'prc75' =>  'prc75',
                    'prc80' =>  'prc80',
                    'prc85' =>  'prc85',
                    'prc90' =>  'prc90',
                    'prc95' =>  'prc95',


                )
            ),
		);
	}

	function get_style_hash($instance) {
		return substr( md5( serialize( $this->get_less_variables( $instance ) ) ), 0, 12 );
	}
}

siteorigin_widget_register('mdsow-blocbackground', __FILE__, 'MD_S0Widget_BlocBackground_Widget');
add_action('siteorigin_widgets_enqueue_admin_scripts_mdsow-blocbackground', function (  ){
    $dirAssets = dirname(__FILE__) . DIRECTORY_SEPARATOR . 'assets' . DIRECTORY_SEPARATOR;

    $file = $dirAssets . 'css' . DIRECTORY_SEPARATOR . 'admin.css';
    if(is_file($file)) {
        $name = preg_replace('|\.php$|', '', basename(__file__));
        $url = get_template_directory_uri().'/widgets/so-page-builder/'.$name.'/assets/css/admin.css';
        $vers = date("YmdGis", filemtime($file));
        $id = strtolower($name) . '-css';
        wp_enqueue_style( $id, $url, array(), $vers );
    }

    $file = $dirAssets . 'js' . DIRECTORY_SEPARATOR . 'admin.js';
    if(is_file($file)) {
        $name = preg_replace('|\.php$|', '', basename(__file__));
        $url = get_template_directory_uri().'/widgets/so-page-builder/'.$name.'/assets/js/admin.js';
        $vers = date("YmdGis", filemtime($file));
        $id = strtolower($name) . '-js';
        wp_enqueue_script( $id, $url, array(), $vers, true );
    }
}, 10, 2);

The widget who include the first :

<?php
/*
Widget Name: Pictos
Description: Bloc Pictos
Author: Michaël DUBOIS
*/

class MD_S0Widget_BlocPictos_Widget extends SiteOrigin_Widget {
	function __construct() {

		parent::__construct(
			'mdsow-blocpictos',
			'Pictos',
			array(
				'description' => 'Bloc Pictos',
				'help' => ''
			),
			array(

			),
			false,
			plugin_dir_path(__FILE__)
		);
	}

	function get_widget_form() {


		return array(
            'backgroundwidget' => array(
                'type' => 'widget',
                'label' =>  'Background',
                'class' => 'MD_S0Widget_BlocBackground_Widget',
                //'hide' => true
            ),

            'type' => array(
                'type' => 'select',
                'prompt' =>  'Type',
                'options' => array(
                    'columns3' =>  '3 columns',
                    'columns4' =>  '4 colomns',
                )
            ),
            'title' => array(
                'type' => 'text',
                'label' => 'Title',
            ),
            'text' => array(
                'type' => 'textarea',
                'label' => 'Text',
            ),

            'pictos' => array(
                'type' => 'repeater',
                'label' => 'Pictos',
                'item_name'  => 'Picto',
                'item_label' => array(
                    'selector'     => "[id*='pictotitle']",
                    'update_event' => 'change',
                    'value_method' => 'val'
                ),
                'fields' => array(
                    'picture' => array(
                        'type' => 'media',
                        'label' => 'Picture',
                        'choose' => 'Choose picture',
                        'update' => 'Set',
                        'library' => 'image',
                        //'fallback' => true
                    ),
                    'pictotitle' => array(
                        'type' => 'textarea',
                        'label' => 'Title',
                    ),
                    'pictotext' => array(
                        'type' => 'textarea',
                        'label' => 'Text',
                    ),
                )
            ),

            'cta' => array(
                'type' => 'text',
                'label' => 'CTA',
            ),
            'url' => array(
                'type' => 'text',
                'label' => 'URL',
            ),
		);
	}

	function get_style_hash($instance) {
		return substr( md5( serialize( $this->get_less_variables( $instance ) ) ), 0, 12 );
	}



	public function get_template_variables( $instance, $args ) {
	    if(isset($_GET['test-md'])) {
	        echo('<pre>');
	        print_r($instance);
	        echo('</pre>');
	        exit();
        }

        $bckImage  = '';
        $bckClass  = '';//($instance['background'] == 'image') ? '' : $instance['background'];

        $pictos = array();
        if( ! empty( $instance['pictos'] ) ) {
            foreach ( $instance['pictos'] as $picto ) {
                $pictos[] = array(
                    'pictotitle' => trim($picto['pictotitle']),
                    'pictotext' => trim($picto['pictotext']),
                    'pictoimg'  => wp_get_attachment_url($picto['picture'], 'full'),
                );
            }
        }

		return array(
            'type'       => $instance['type'],
            'title'      => trim($instance['title']),
            'text'       => trim($instance['text']),
            'pictos'     => $pictos,
		    'bckClass'   => $bckClass,
		    'cta'       => trim($instance['cta']),
		    'url'       => trim($instance['url']),
            'preview'    => ( !empty( $instance[ 'is_preview' ] ) ) ? true : false,
		);
	}

	function get_less_variables($instance){
		if ( empty( $instance ) ) {
			return array();
		}
		return array();
	}
}

siteorigin_widget_register('mdsow-blocpictos', __FILE__, 'MD_S0Widget_BlocPictos_Widget');
/*add_action('siteorigin_widgets_enqueue_admin_scripts_mdsow-blocpictos', function (  ){
    $dirAssets = dirname(__FILE__) . DIRECTORY_SEPARATOR . 'assets' . DIRECTORY_SEPARATOR;

    $file = $dirAssets . 'css' . DIRECTORY_SEPARATOR . 'admin.css';
    if(is_file($file)) {
        $name = preg_replace('|\.php$|', '', basename(__file__));
        $url = get_template_directory_uri().'/widgets/so-page-builder/'.$name.'/assets/css/admin.css';
        $vers = date("YmdGis", filemtime($file));
        $id = strtolower($name) . '-css';
        wp_enqueue_style( $id, $url, array(), $vers );
    }

    $file = $dirAssets . 'js' . DIRECTORY_SEPARATOR . 'admin.js';
    if(is_file($file)) {
        $name = preg_replace('|\.php$|', '', basename(__file__));
        $url = get_template_directory_uri().'/widgets/so-page-builder/'.$name.'/assets/js/admin.js';
        $vers = date("YmdGis", filemtime($file));
        $id = strtolower($name) . '-js';
        wp_enqueue_script( $id, $url, array(), $vers, true );
    }
}, 10, 2);*/

For test, I use argument “test-md=1” in the URL for the page where is integrated the widget and in the printf we so that “backgroundwidget” value is empty.

Thank’s for your help

Michaël

Hi Alex,

I just put in backgroundwidget one select to send you. In my complete widget I have many fields.
I select an option and I save the page in admin. When I open the page in admin, my option is selected but if I saw in front page, the value is empty.

In your test, you can show the value in the front page ?

Michaël

Alex,

in print_r, I saw empty.

I have update for send you all files and now I saw the values.

I don’t know why.

You can see the files here :

In the two widget, I want load javascript when the widget window is open in admin. I find sample code in forum but it’s not working.
My script is in assets/js/admin.js

Have you an idea why it’s not working ?

Thank’s