Hiding widgets

This topic is: Resolved

This is a PRIVATE forum for verified users only, to view the replies/answers, you must be logged in!

This topic contains 22 replies, has 4 voices, and was last updated by  Erick 1 year ago.

  • Author
    Posts
  • #10292

    Erick
    Member
    Post count: 1018

    Whats the best way of hiding widgets of the sidebar in mobile devices and vice-versa. I know there are a couple of plugins that could do this, but I was wondering if this could be done just using css and without installing another plugin.

    Thank you.

  • #10309

    Jacob
    Staff
    Post count: 2323

    Hey there, You must be logged in to view this reply!

    Login | Register | Forgot Password?

  • #10348

    Erick
    Member
    Post count: 1018

    Alright ill do just that, any good plugin that you have used before that you recommend?

  • #10349

    Fabylr
    Member
    Post count: 92

    Eric,

    I am using Dynamic Widgets Plugin to hide widgets in Mobile devices. Its working great, you can try it.

  • #10353

    Erick
    Member
    Post count: 1018

    Hey Fabylr, thank you so much for your input, I checked the plugin and it looks very promising, and the fact that you used it with sparkles theme and works great its definitely a good sing. I will give it a go and report back 🙂 thank you

  • #10357

    Erick
    Member
    Post count: 1018

    WOOOOOW that plugin its beast! thank you so much Fabylr for the tip! thats what I been looking for a long time! Thank you!

  • #10359

    Fabylr
    Member
    Post count: 92

    wc 🙂

  • #10378

    Max
    Staff
    Post count: 3150

    Hey there, You must be logged in to view this reply!

    Login | Register | Forgot Password?

  • #11850

    Erick
    Member
    Post count: 1018

    although the plugin works sometimes. I will try using css class to manage widgets.

  • #11868

    Max
    Staff
    Post count: 3150

    Hey there, You must be logged in to view this reply!

    Login | Register | Forgot Password?

  • #11887

    Erick
    Member
    Post count: 1018

    aaaaaaaaaaaaaaaaa!! you are right maxxi. You know a way to fix this issue?

  • #11893

    Erick
    Member
    Post count: 1018

    I find a way using css classes to hide the widgets and its working really well except that it leaves a white space where the widget is.

    this is the code I am using

    @media (min-width: 992px) {
    .widget-1 {
        display: none;
        }
    }

    and this is the space it leaves

    https://goo.gl/photos/eW6anFKKefxVsV9A7

    When using the plugin to hide widgets this was never the issue. The problem with the plugins is that they sometimes worked and other times did not.

    This is how it looks with the plugin:
    https://goo.gl/photos/umZM33gsYVGPdmPz8

    see the difference?

    Is there a way to do the same with css or php. Thank you.

    • This reply was modified 1 year, 1 month ago by  Erick.
    • This reply was modified 1 year, 1 month ago by  Erick.
  • #11950

    Erick
    Member
    Post count: 1018

    BUMP

  • #11978

    Max
    Staff
    Post count: 3150

    Hey there, You must be logged in to view this reply!

    Login | Register | Forgot Password?

  • #12019

    Erick
    Member
    Post count: 1018

    that didnt work. Is there not an easier way? more like using css? so that I can add conditionals?

  • #12029

    Jacob
    Staff
    Post count: 2323

    Hey there, You must be logged in to view this reply!

    Login | Register | Forgot Password?

  • #12226

    Erick
    Member
    Post count: 1018

    Yes This is what I have but it didnt work

    <script>
    	;(function($) {
    		$(document).ready(function(){
    			if( $(window).width() > 992 ){
    				id= "yt-adsfull-widget-12"
    				$('#text-16').remove();
    			}
    		});
    	})(jQuery);
    </script>
  • #12260

    Jacob
    Staff
    Post count: 2323

    Hey there, You must be logged in to view this reply!

    Login | Register | Forgot Password?

  • #12375

    Erick
    Member
    Post count: 1018

    Nope, I tried both header and footer and nothing changed.

  • #12381

    Erick
    Member
    Post count: 1018

    Oh my bad I didnt realized it was > higher, but yes It is working now, thank you

    Also quick question, does this JavaScript has the potential to slow my website?

  • #12383

    Erick
    Member
    Post count: 1018

    I was using this code

    <script>
    	;(function($) {
    		$(document).ready(function(){
    			if( $(window).width() < 991 ){
    				$('#yt-adsfull-widget-12').remove();
    				$('#yt-posts-with-thumnail-widget-17').remove();
    			}
    		});
    
        $(document).ready(function(){
    			if( $(window).width() > 992 ){
    				$('#yt-adsfull-widget-15').remove();
    				$('#yt-posts-with-thumnail-widget-24').remove();
    			}
    		});
    
    	})(jQuery);
    </script>

    but it stopped working when I removed some plugins I was not using

  • #12384

    Erick
    Member
    Post count: 1018

    i know why stopped working. Because I am using a sticky widget (q2w3) why would this happen?

  • #12400

    Erick
    Member
    Post count: 1018

    gotcha! I was able to solve the problem using css and with the help of jacob.

You must be logged in to reply to this topic.

This is a PRIVATE forum for verified users only, to view the replies/answers, you must be logged in!