We're merging with GenerateBlocks! Learn more here.

[Support request] How To: Responsive Elements

Please login to receive premium support.

Support for the free plugin can be found here.

Home Forums Pro Support How To: Responsive Elements

Viewing 12 posts - 1 through 12 (of 12 total)
  • Author
    Posts
  • #21315
    Chantal
    Participant

    If someone can give me some code for the following I would be eternally grateful!

    1. I have my list columns set at 3 which is how I would like it to display on the desktop, but I would like to display only 2 for Tablet and Mobile. How can I do this please?

    2. I have selected the Social Sharing buttons but I don’t want the icons to display on tablets and mobiles, only desktop. How do I hide them please?

    Thanks in advance,

    Chantal

    #21324
    elvin
    Moderator

    Hi,

    Both of your questions will need custom CSS.

    That said, can you link us to the site in question? So we could inspect and provide you the proper CSS code for your site.

    Thank you. :

    #21345
    Chantal
    Participant

    Yes of course, is there a way to send you the link privately please?

    #21392
    elvin
    Moderator

    Yes of course, is there a way to send you the link privately please?

    You can send your details here: https://wpshowposts.com/contact/

    Kindly reply here when you’ve sent it. Thanks .:)

    #21664
    Chantal
    Participant

    Thank you, have sent the link.

    #21688
    elvin
    Moderator

    You can try this CSS:

    @media (max-width: 768px) {
        #wpsp-1870.wp-show-posts-columns .wp-show-posts-single {
            width: 50%;
        }
    
        #wpsp-1870.wp-show-posts-columns {
            margin-left: -2em !important;
        }
    
        #wpsp-1870.wp-show-posts-columns .wp-show-posts-inner {
            padding-left: 2em;
        }
    }

    Reference: https://wpshowposts.com/support/topic/wp-show-posts-display-2-columns-in-mobile/#post-19436

    #29614
    Chantal
    Participant

    Sorry for the very late response but unfortunately this code isn’t working for me… on desktop it stays in 2 columns, when I want 3. Can I send the link again privately please?

    #29629
    elvin
    Moderator

    Sorry for the very late response but unfortunately this code isn’t working for me… on desktop it stays in 2 columns, when I want 3. Can I send the link again privately please?

    Sure. Let us know if you’ve sent it so I can check again. 😀

    #29649
    Chantal
    Participant

    Hello Elvin, have sent it. Thanks.

    #29670
    elvin
    Moderator

    I’ve checked the page you’ve linked us to and I don’t see any WPSP list in it.

    I see post lists but that’s from Elementor. Perhaps I missed it, can you confirm if the link sent is correct and point me to the list in question?

    Let us know.

    #29684
    Chantal
    Participant

    Oh so sorry, have resent link!!

    #29730
    elvin
    Moderator

    Hi there,

    Can you do this for now?

    Edit the WPSP list to set its columns to 3.

    Let us know when you have it applied so I can inspect again and do a writeup.

    While you can try this:

    @media(max-width:1024px){ // for tablets and small desktops - 2 columns
    #wpsp-1870.wp-show-posts-columns .wp-show-posts-single{
    width: 50%;
    }
    }

    Not sure if it works smoothly. I may have to reinspect after you’ve applied the said settings.

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