Support » Plugin: Options for Twenty Twenty-One » Width Values

  • Resolved Andy Beard

    (@andybeard)


    It was recommended elsewhere that this plugin is the ideal solution for changing content width.
    It does work… but it is really hard to do.

    There isn’t any numerical output of what the slider position refers to.

    After any slight movement I had to wait for the screen to redraw, then refresh Chrome dev tools, only to discover the tiny movement I though I had made didn’t change any values, or went too far the other way.

    Please add some visual value and maybe a way to also increment manually.

Viewing 13 replies - 1 through 13 (of 13 total)
  • Plugin Author Oliver Campion

    (@domainsupport)

    Hi Andy,

    There is a method to the madness here …

    The WordPress Customizer allows for changes to be applied with a page refresh or immediately (without a page refresh).

    To do it without a page refresh, the changes have to be applied via JavaScript. Which is fine for everything except anything that requires CSS media queries.

    And as I’m sure you are aware, the content width is determined via media queries which therefore have to be re-created with a page refresh.

    The range selector is used because the value has to be an integer within a specific range. Unfortunately, the WordPress Customizer Range Control does not have the capacity for value input.

    There may well be, however, some Javascript we can develop to add an additional input to allow valid values manually.

    We’ll work out what can be done and update this thread when we have a solution.

    Oliver

    Thread Starter Andy Beard

    (@andybeard)

    Just displaying the integer value of the slider would help.

    It doesn’t have to be a calculated value, just an indication that when you moved the slider it was actually to a new integer.

    Plugin Author Oliver Campion

    (@domainsupport)

    Understood … will sort something out and get back to you when we have something for you to test.

    Oliver

    I experienced a similar issue with the logo size slider today. Whilst I get the reasoning above it was frustrating having to play around for ages with the slider when I knew the px value I wanted to enter!

    So any option which could allow for either entering an integer, or using up/down controls (etc) to manipulate the integer value whilst being able to see its’ current value onscreen, would be really helpful.

    Plugin Author Oliver Campion

    (@domainsupport)

    We are still working on this. It’s not nearly as straight forward as it sounds and not just for the afore mentioned problems. At the very least we should be able to allow the sliders to reveal their integer value when the change requires the page to be refreshed and will update this thread when we have something for you to see.

    Oliver

    Plugin Author Oliver Campion

    (@domainsupport)

    OK, we’ve added solution to this as mentioned above. Please check out the latest update and see if the visual representation of the slider value is sufficient.

    Thanks,

    Oliver

    The update is great, thanks @domainsupport, and provides just the info we were after.

    Looks like it’s only present on some sliders (for example I don’t see any values on the font size or letter spacing sliders), any chance it could be added to the rest?

    Also I note the value is only visible once you change the slider. Thus to check its current value you need to change it a bit and change it back again to exactly where it was, and in a slider with a lot of options (eg max width) this is harder than it sounds! Is it possible to display the value at the outset? Or possibly, as a middle ground, with some kind of “show values” button or something, if a calculation is required.

    Plugin Author Oliver Campion

    (@domainsupport)

    Yes, I only added it to the sliders in question in this thread to begin with. I’ll look at adding the rest but, and here’s yet another problem with this, the way that range sliders work is that they cannot be floating values, only positive integers. This means that for font sizes like 1.125rem, the slider thinks it’s 1125. So to display this as a value that makes sense to the user, we’d need to find a way to tell the front end what the value really means before it displays it!

    Also, currently the postfix on the value is “px” so we’d also have to find a way to tell the front end that the postfix is “rem” or whatever.

    This thread has opened up a can of worms that will have to be dealt with next year 🙂

    But I’m glad it works … sort of 😀

    HNY!

    Oliver

    Plugin Author Oliver Campion

    (@domainsupport)

    Right, just pushed another version of the plugin.

    The initial values are now shown without having to slide the slider (this may only work if a value has actually been set already).

    We have not added this feature to any sliders that do not require the page to be refreshed in the customizer because there is no delay with those sliders and you can see the result immediately.

    If the values of the range sliders that have immediate visible results really require the values to be shown then we will of course do so but we feel that this isn’t required for the majority of users who would just find this information confusing and un-necessary.

    We’ll go with the consensus on this one 🙂

    Oliver

    Plugin Author Oliver Campion

    (@domainsupport)

    Marking this as “resolved” now.

    Oliver

    Looks good Oliver, thanks for that. Will see how we go with the font size sliders that have immediate results, just a different way of working vs setting a precise value as we’re used to but that doesn’t mean it’s not a good thing 🙂

    Plugin Author Oliver Campion

    (@domainsupport)

    Haha, yes, I too like to enter exact values but … I realised recently how ridiculous this was when using a GUI where you can choose what looks best rather than our favourite number 🙂

    Like never letting your television be on an odd number for the volume level!

    Plugin Author Oliver Campion

    (@domainsupport)

    Just to update this thread, all range sliders in the Customizer now show their values as we have had more requests for this.

    Oliver

Viewing 13 replies - 1 through 13 (of 13 total)
  • The topic ‘Width Values’ is closed to new replies.