Support » Plugin: WordPress Slider Block Gutenslider » Responsive height

  • Resolved dimizu


    I use the Slider with an pixel height. On Desktop I need 780px, on tablet 600px, on smartphone 400px. I solved this with a javascript hack.

    window.addEventListener("resize", setGutenslider);
    function setGutenslider() {
    	var hoehe;
    	if ($(window).width() <= 768) {
    		hoehe = "400px";
    	} else {
    		if ($(window).width() <= 992) {
    			hoehe = "600px";
    		} else {
    			hoehe = "780px";
    	var sliders = document.querySelectorAll('.wp-block-eedee-block-gutenslider');
    	sliders.forEach(function (el) {
 '--gutenslider-min-height', hoehe);
    		var bodyStyles = window.getComputedStyle(el);
    		var fooBar = bodyStyles.getPropertyValue('--gutenslider-min-height');

    This works for me.

    But perhaps you would plan in a future version a better solution e.g. with different inputs für small, medium and large screens or an other solution that solves the problem with height for different devices/screens.

Viewing 2 replies - 1 through 2 (of 2 total)
  • Plugin Author eedee


    Hey @dimizu,

    we totally agree and we are working on it. This and other features will be part of our version 3.0.0 release which will come this year.

    Thank you for sharing your code, so others can profit from it until the plugin is not updated.



    Plugin Author eedee


    Hey @dimizu,

    v3 is out with lots oft responsive setting. Closing the issue.

Viewing 2 replies - 1 through 2 (of 2 total)
  • You must be logged in to reply to this topic.