1

I have been working on the Custom Gallery Layout style and was wondering how do I enqueue and make the following script working without hard coded in the file. Or is there a better way of adding it via inline script wp_add_inline_script().

I tried with wp_add_inline_script() but that didn't helped. May be I was doing something wrong.

How to add the localize or enqueue the code which is nested with <script>...</script> tags in the below code.

add_action('print_media_templates', function() {
// define your backbone template;
// the "tmpl-" prefix is required,
// and your input field should have a data-setting attribute
// matching the shortcode name

$gallery_types = apply_filters('print_media_templates_gallery_settings_types',
    array(
        'justified' => esc_html__( 'Justified','textdomain' ),
        'grid'      => esc_html__( 'Grid','textdomain' ),
        'slider'    => esc_html__( 'Slider','textdomain' ),
        'default_val'    => esc_html__( 'Default','textdomain' ),
    )
);
?>
<script type="text/html" id="tmpl-custom-gallery-type-setting">
    <label class="setting">
        <span><?php esc_html_e( 'Layout Type' ); ?></span>
        <select data-setting="type">
        <?php
        foreach ( $gallery_types as $key => $value ) {
            echo "<option value=\"$key\">$value</option>";
        }
        ?>
        </select>
    </label>
</script>
<script>
jQuery(document).ready(function(){

    // add your shortcode attribute and its default value to the
    // gallery settings list; $.extend should work as well...
    _.extend(wp.media.gallery.defaults, {
        type: 'default_val'
    });

    // join default gallery settings template with yours -- store in list
    if (!wp.media.gallery.templates) wp.media.gallery.templates = ['gallery-settings'];
    wp.media.gallery.templates.push('custom-gallery-type-setting');

    // merge default gallery settings template with yours
    wp.media.view.Settings.Gallery = wp.media.view.Settings.Gallery.extend({
        template: function (view) {
            var output = '';
            for (var i in wp.media.gallery.templates) {
                output += wp.media.template(wp.media.gallery.templates[i])(view);
            }
            return output;
        }
    });
});

0
//add the JS code in a variable - without <script>
$script = "
jQuery(document).ready(function(){

// add your shortcode attribute and its default value to the
// gallery settings list; $.extend should work as well...
_.extend(wp.media.gallery.defaults, {
    type: 'default_val'
});

// join default gallery settings template with yours -- store in list
if (!wp.media.gallery.templates) wp.media.gallery.templates = ['gallery-settings'];
wp.media.gallery.templates.push('custom-gallery-type-setting');

// merge default gallery settings template with yours
wp.media.view.Settings.Gallery = wp.media.view.Settings.Gallery.extend({
    template: function (view) {
        var output = '';
        for (var i in wp.media.gallery.templates) {
            output += wp.media.template(wp.media.gallery.templates[i])(view);
        }
        return output;
    }
});
});";
//add the code to the script that is already enqueued with wp_enqueue_script() 
//use the same handle
wp_add_inline_script('handle_of_script_you_want_modified', $script);
10
  • tried with enqueue but throws an error function theme_prefix_enqueue_script() { wp_add_inline_script( 'tmpl-gallery-enqueue', $script );} add_action( 'wp_enqueue_scripts', 'theme_prefix_enqueue_script' ); – Maqk Sep 8 '17 at 16:22
  • This is the error - syntax error, unexpected 'function' (T_FUNCTION – Maqk Sep 8 '17 at 16:23
  • Put your code in Pastebin and let me take a look at it – Mihai Papuc Sep 8 '17 at 16:30
  • Here is the full file code. pastebin.com/TMsNhVtt – Maqk Sep 8 '17 at 16:34
  • Where are you using the code I suggested above? – Mihai Papuc Sep 8 '17 at 16:37

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.