PluginUs.Net - Business Tools for WooCommerce and WordPress

[realize your idea - make your dreams come true]

Support Forum

You need to log-in to create request (topic) to the support

Checkbox CSS

The support doesn work on Saturdays and Sundays, so some Friday requests can be answered on Monday. If you have problems with registration ask help on contact us page please
If you not got email within 24~36 business hours, firstly check your spam box, and if no any email from the support there - back to the forum and read answer here. DO NOT ANSWER ON EMAILS [noreply@pluginus.net] FROM THE FORUM!! Emails are just for your info, all answers should be published only here.
The support doesn work on Saturdays and Sundays, so some Friday requests can be answered on Monday.

I think this might be my last question!

If checkbox names are too long, then the <input> <label> and/or <a> will wrap to a new line.

 

Here's what I've tried:

-I tried giving the label a max-width, but that wasn't a good universal solution.

-I tried creating a wrap so I could make each of the elements into a column, but I couldn't get the wrapper to grab everything.

jQuery('.woof_container_category li').each(function(){
jQuery(this).children('input, label, a').wrapAll('<div class="my_woof_checkbox_group"></div>');
});

^will only wrap the input and label, but not the link.

 

 

Hello

Use

.woof_checkbox_label {
max-width: 70%;

Close, but I tried that already..  It makes things that can be full-width look ugly; and if the sidebar width changes then it won't necessarily keep.

Hello

It makes things that can be full-width look ugly: 

.woof_childs_list_li .woof_checkbox_label:first-child {
max-width70%;
 if the sidebar width changes then it won't necessarily keep. - Sorry I did not understand you

Well, in this case, I can’t help you. It all depends on the width of the sidebar and the length of the title.

https://c2n.me/47zhHJK.png - if this is not appropriate for the size of the container, it always wraps to the next line

 

Why is the jQuery .wrapAll not wrapping the <a> element?

 

Hello

<a>  - Because it is added later

You can  add setTimeout()  to  your code

That's unreliable (and clumsy).

Here's what I ended up doing:

Created a very simple plugin (article here), and added a simple function (article here) to defer the script execution.   As an extra (currently unnecessary) measure, I changed the order of plugin execution to make sure my plugin loaded after WOOF (using this plugin).

The code of the main custom plugin php file looked something like the following:

<?php
/**
Plugin Name: My Footer Scripts
*/
$my_foot_script_plugin_path =
   '/wp-content/plugins/my_footer_script/';
wp_enqueue_script('my_foot', $my_foot_script_plugin_path . 'my_foot_script.js', array('jquery') );
//Following function allows any scripts with their handle in the $defer array to be loaded as deferred (as distinct from async, etc)
function my_defer_scripts( $tag, $handle, $src ) {
  $defer = array(
     'my_foot'
  );
if ( in_array( $handle, $defer ) ) {
   return'<script src="' . $src . '" defer="defer" ></script>' ."\n";
}
return$tag;
}
add_filter( 'script_loader_tag', 'my_defer_scripts', 10, 3 );
?>
And the code of the 'my_foot_script.js' file looked something like this:
<script>
jQuery('.woof_container_category li').each(function(){
    jQuery(this).children('input, label, a').wrapAll('<div class="my_woof_checkbox_group"></div>');
});
</script>
NOW it works and I can add the css needed to fix the problem.

(I take it back - even after all that, those links are still loading AFTER my script)

"if (woof_supports_html5_storage()) {
//test mode from 06.11.2017
//console.log(jQuery(ul).closest('li').attr("class"));
// var preulstate = localStorage.getItem(jQuery(ul).closest('li').find('label').first().text());
var preulstate = localStorage.getItem(jQuery(ul).closest('li').attr("class"));
if (preulstate && preulstate == 'woof_is_opened') {
var span_class = 'woof_is_opened';
jQuery(ul).show();
}
jQuery(ul).before('<a href="javascript:void(0);" class="woof_childs_list_opener"><span class="' + span_class + '"></span></a>');
//++"

Why are you using local storage for this?

Hello

To remember the state of elements (open or closed)