maddisondesigns / customizer-custom-controls

WordPress Customizer Custom Controls
403 stars 120 forks source link

Has anyone successfully used this in Wordpress? #2

Closed gitgit2019 closed 6 years ago

gitgit2019 commented 6 years ago

No matter what I do this flat out does not work even copying everything exactly the same. It breaks the customizer and there is a warning about this block

<b>Warning</b>: Invalid argument supplied for foreach() in <b>.../customizer-custom-controls\inc\custom-controls.php</b> on line <b>713</b><br />

        /**
         * Find the index of the saved font in our multidimensional array of Google Fonts
         */
        public function getFontIndex( $haystack, $needle ) {
            foreach( $haystack as $key => $value ) {
                if( $value->family == $needle ) {
                    return $key;
                }
            }
            return false;
        }

I mostly would just like the drag and drop field but I can't figure out why this isn't working.

maddisondesigns commented 6 years ago

I'm presuming that you want to use the control in a similar manner to the example that I mentioned (i.e. save a list social urls). I'm doing this exact thing in my latest theme that I released on .org.

I would suggest downloading my latest theme and check out out how I've used it - https://wordpress.org/themes/ephemeris/

My Ephemeris theme makes use of my Sortable Repeater to display a row of social icons. You can view a demo of the theme here - http://demo.skyrocketthemes.com/ephemeris/

If you have a look around line 1533 in functions.php, you can see how I generate the unordered list of social icons using the urls saved in the Customizer.

https://github.com/maddisondesigns/ephemeris/blob/master/functions.php#L1533

(Please note, the version on Github has a few extra changes that I haven't pushed to .org yet. Just wanted to mention it in case you noticed that they're sllightly different)

relosmot commented 6 years ago

Works great for me.

My guess is that the location of the google-fonts-alphabetical.json file, and google-fonts-popularity.json file are not mapping out properly within the getGoogleFonts method.

Take a look at getGoogleFonts. That is likely where you'll find your answer to clear up the "Invalid argument supplied for foreach()" warning.

ghost commented 6 years ago

I have problem with implementing multi-select dropdown, after clicking on label list gets focus, i can see one selected default value, but dropdown list with other choices never shows up, and i already checked paths for scripts and everything else few times... another classes for my customizer works just fine...and i deactivated all plugins... Can't extract code for this one control that i need the most :(

maddisondesigns commented 6 years ago

@gwgw I found an issue with the z-index on the Select2 controls. I've just tweaked the customizer.css styles, so that should hopefully fix your issue. Sorry about that.

ghost commented 6 years ago

Hello,i propobly found another issue with multi-select dropdown list. I'm adding css classes to the body tag with: add_filter( 'body_class', 'mytheme_body_classes' ); Now, when i select few values from list and save changes i get the classes that i want. But when i open customizer again,and remove all selected classes from dropdown list after saving i got one css class added to the body tag, that was last unselected(?) Its like empty selection from dropdown-list wont save properly, i re-opened customizer again after saving empty list, and it still showing me one value, and i get css class from this value on body tag Also when i'm removing the only one value that is inside the list it wont trigger change on "Publish Button" Its like nothing happens, i remove last and only one value and i cant publish changes until i change something else inside customizer.

ghost commented 6 years ago

Also, when minify customizer.js file inside my IDE with gulp + uglify + pump i get error: GulpUglifyError: unable to minify JavaScript Caused by: SyntaxError: Unexpected token operator «=», expected punc «,» Here is the invalid line: function skyrocketAppendRow($element, defaultValue = '') { After commenting out this whole function minify works fine, but for someone who needs to work with this custom control something may goes wrong while minifing scripts.

maddisondesigns commented 6 years ago

@gwgw Can you please open a separate issue for that problem with clearing the multi-select. I'm not sure why yet, but Select2 doesn't seem to be triggering a change when that last item is cleared. I'll need to look into that.

As for your minimisation error, I would say that's a problem with GulpUglify. Specifying a default value like I have, is valid JavaScript. From doing a quick google, it looks like GulpUglify doesn't support ES6. See - https://stackoverflow.com/questions/44958216/how-to-minify-es6-functions-with-gulp-uglify