3

I want to add a option to the "Gallery settings" (when you insert a gallery into a post).

I once found some code on how to do this, but unfortunately I can't find it anymore. I can't even remenber if it was a hook, but I think it was some hackish stuff ;-)

Thx

6
  • How about those questions/answers?
    – kaiser
    Sep 21, 2012 at 12:47
  • Nope...the first question is the only one that is looking for the same thing. But the answer to it There is no way to alter the gallery settings. is just wrong. I have done it, but dumped the code =(
    – xsonic
    Sep 21, 2012 at 13:14
  • And this one is also one of the results. Sorry, but you're not specific enough. Anyway: Dig in core, get the ~/wp-admin/*.php file for that request and search for apply_filters/do_action.
    – kaiser
    Sep 21, 2012 at 14:08
  • this only sets image sizes. I need another option. As I said, it was a hackish solution, there is no hook as I can see. The option was added via JS, but I can't get it to work that option integrates in the shortcode when inserted into the editor.
    – xsonic
    Sep 21, 2012 at 14:11
  • "Sorry, but you're not specific enough.". Please rework your question and be more specific/add more details. Thanks.
    – kaiser
    Sep 21, 2012 at 14:25

2 Answers 2

5

Thanks to the hint with the multiple galleries plugin from Niall Campbell and thanks to this question How to Add a Custom Colum on Thickbox Media Gallery Tab? (where I got the hook admin_head-media-upload-popup from), I was able to complete the task.

I've added an option to add a style attribute to the gallery shortcode.

option to select the style of the gallery

Here is the complete code:

add_action( 'admin_head-media-upload-popup', 'wpse_53803_script_enqueuer' );

function wpse_53803_script_enqueuer() 
{
    if( $_GET['tab'] == 'gallery' ) 
    {
        ?>
        <script type="text/javascript">
        jQuery(document).ready( function($) {

            // append the table row
            $('#gallery-settings table#basic tbody').append('<tr><th scope="row" class="label"><label><span class="alignleft">Style:</span></label></th><td class="field"><select id="style" name="style"><option value="standard">Standard</option><option value="slideshow">Slideshow</option></select></td></tr>');

            // set our vars
            var $style = '', $is_update = false;

            // Select parent editor, read existing gallery data 
            w = wpgallery.getWin();
            editor = w.tinymce.EditorManager.activeEditor;

            if (editor !== null) {
                gal = editor.selection.getNode();

                if (editor.dom.hasClass(gal, 'wpGallery')) {
                    $style = editor.dom.getAttrib(gal, 'title').match(/style=['"]([^'"]+)['"]/i);
                    var $is_update = true;
                    if ($style != null) {
                        $style = $style[1];
                        $('table#basic #style').find('option[value="' + $style + '"]').attr('selected','selected');
                    }
                } else {
                    $('#insert-gallery').show();
                    $('#update-gallery').hide();
                }
            }

            // remove standard onmousedown action
            $('#insert-gallery').attr('onmousedown', '');

            // Insert or update the actual shortcode
            $('#update-gallery, #insert-gallery, #save-all').mousedown(function() {
                var $styleAdd = '';
                if (editor !== null)
                    var orig_gallery = editor.dom.decode(editor.dom.getAttrib(gal, 'title'));
                else
                    var orig_gallery = '';

                // Check which which style is selected
                if($('table#basic #style').val() != 'standard') {
                    $styleAdd = ' style="slideshow"';
                }

                if ($(this).attr('id') == 'insert-gallery') {
                    w.send_to_editor('[gallery' + wpgallery.getSettings() + $styleAdd + ']');
                }

                // Update existing shortcode
                if ($is_update) {
                    if ($styleAdd != '' && orig_gallery.indexOf(' style=') == -1)
                        editor.dom.setAttrib(gal, 'title', orig_gallery + $styleAdd);
                    else if (orig_gallery.indexOf(' style=') != -1)
                        editor.dom.setAttrib(gal, 'title', orig_gallery.replace(' style="slideshow"', $styleAdd));
                    else
                        editor.dom.setAttrib(gal, 'title', orig_gallery.replace(' style="slideshow"', ''));
                }
            });

        });
        </script>
        <?php
    }
}

It adds style="slideshow" if the slideshow style is selected, otherwise it doesn't add anything. And it recognizes the set style if you update the gallery, so that the right option is selected.

Thank you!

1
  • 1
    Does it still work in 4.9?
    – Runnick
    Dec 10, 2017 at 16:24
4

hmmm check out the code to Mutliple Galleries plugin, it uses a javascript workaround due to the absence of a wordpress hook for the media_upload_gallery_form function (in wp-admin/includes). It then outputs a modified gallery shortcode to the editor (with some extra attributes).

If you're adding in additional attributes that aren't covered by the gallery shortcode, you'll need to write your own function for it, but there's alot of information available to do that out there so I won't go into that.

1
  • 1
    Welcome to our site. Please add the solution to your answer, so it can stand for itself. Thanks.
    – fuxia
    Oct 7, 2012 at 23:37

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

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