Skip to content

Instantly share code, notes, and snippets.

@pavelthq
Last active February 4, 2025 18:33

Revisions

  1. pavelthq revised this gist Nov 22, 2017. 2 changed files with 24 additions and 22 deletions.
    12 changes: 7 additions & 5 deletions custom_view.js
    Original file line number Diff line number Diff line change
    @@ -1,9 +1,10 @@
    window.VcCustomElementView = vc.shortcode_view.extend( {
    (function($) {
    window.VcCustomElementView = vc.shortcode_view.extend( {
    elementTemplate: false,
    $wrapper: false,
    changeShortcodeParams: function ( model ) {
    var params;

    window.VcCustomElementView.__super__.changeShortcodeParams.call( this, model );
    params = _.extend( {}, model.get( 'params' ) );
    if ( ! this.elementTemplate ) {
    @@ -13,8 +14,9 @@ window.VcCustomElementView = vc.shortcode_view.extend( {
    this.$wrapper = this.$el.find( '.wpb_element_wrapper' );
    }
    if ( _.isObject( params ) ) {
    var $element = $( _.template( this.elementTemplate, { params: params }, vc.templateOptions.custom ) );
    this.$wrapper.find( '.vc_custom-element-container' ).html( $element );
    var template = vc.template( this.elementTemplate, vc.templateOptions.custom );
    this.$wrapper.find( '.vc_custom-element-container' ).html( template( { params: params } ) );
    }
    }
    } );
    } );
    })(window.jQuery)
    34 changes: 17 additions & 17 deletions mapping
    Original file line number Diff line number Diff line change
    @@ -1,28 +1,28 @@
    <?php
    vc_map(array(
    'name' => __( 'Custom Markup', 'js_composer' ),
    'base' => 'vc_custom_markup',
    'category' => array(
    __( 'Content', 'js_composer' ),
    ),
    'description' => __( 'Custom markup element', 'js_composer' ),
    'params' => array(
    array(
    'type' => 'textfield',
    'name' => 'style',
    'value' => 'custom style!'
    'name' => __( 'Custom Markup', 'js_composer' ),
    'base' => 'vc_custom_markup',
    'category' => array(
    __( 'Content', 'js_composer' ),
    ),
    'description' => __( 'Custom markup element', 'js_composer' ),
    'params' => array(
    array(
    'type' => 'textfield',
    'param_name' => 'style',
    'value' => 'custom style!',
    'heading' => 'Style',
    ),
    array(
    'type' => 'textfield',
    'name' => 'color',
    'value' => 'custom color!'
    'type' => 'textfield',
    'param_name' => 'color',
    'value' => 'custom color!',
    'heading' => 'Color',
    ),
    array(
    'type' => 'textfield',
    'name' => 'title',
    'value' => 'custom title!'
    'type' => 'textfield',
    'param_name' => 'title',
    'value' => 'custom title!',
    'heading' => 'Title',
    ),
    ),
  2. pavelthq created this gist Feb 16, 2016.
    20 changes: 20 additions & 0 deletions custom_view.js
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,20 @@
    window.VcCustomElementView = vc.shortcode_view.extend( {
    elementTemplate: false,
    $wrapper: false,
    changeShortcodeParams: function ( model ) {
    var params;

    window.VcCustomElementView.__super__.changeShortcodeParams.call( this, model );
    params = _.extend( {}, model.get( 'params' ) );
    if ( ! this.elementTemplate ) {
    this.elementTemplate = this.$el.find( '.vc_custom-element-container' ).html();
    }
    if ( ! this.$wrapper ) {
    this.$wrapper = this.$el.find( '.wpb_element_wrapper' );
    }
    if ( _.isObject( params ) ) {
    var $element = $( _.template( this.elementTemplate, { params: params }, vc.templateOptions.custom ) );
    this.$wrapper.find( '.vc_custom-element-container' ).html( $element );
    }
    }
    } );
    32 changes: 32 additions & 0 deletions mapping
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,32 @@
    <?php
    vc_map(array(
    'name' => __( 'Custom Markup', 'js_composer' ),
    'base' => 'vc_custom_markup',
    'category' => array(
    __( 'Content', 'js_composer' ),
    ),
    'description' => __( 'Custom markup element', 'js_composer' ),
    'params' => array(
    array(
    'type' => 'textfield',
    'name' => 'style',
    'value' => 'custom style!'
    'heading' => 'Style',
    ),
    array(
    'type' => 'textfield',
    'name' => 'color',
    'value' => 'custom color!'
    'heading' => 'Color',
    ),
    array(
    'type' => 'textfield',
    'name' => 'title',
    'value' => 'custom title!'
    'heading' => 'Title',
    ),
    ),
    'js_view' => 'VcCustomElementView',
    'custom_markup' => '<div class="vc_custom-element-container">Style: "{{ params.style }}", Color: "{{ params.color }}", Title: "{{{ params.title }}}"</div>',
    )
    );