Home Forums WC Vendors Pro Support Shop header non responsive

NOTICE: We've Moved to a Ticket System for Support

As of August 31, 2017 (12am EST) our support forums will be retired (read-only), and we will be moving to a support ticket system.  This will allow us to better organize and answer support requests, and provide a more personalized experience as we assist our customers.

For the time being, we will leave our forums open for reading and learning while we work on creating a more robust Knowledge Base for everyone to use.

If you are a WC Vendors Pro customer please open a support ticket here. 

If you are a WC Vendors user please open a support ticket on the Wordpress.org forums.

The information on this forum is outdated and in most instances no longer relevant. Please be sure to check our documentation for the most up to date information.

https://docs.wcvendors.com/

Thank you to all of our customers!

 

Viewing 5 posts - 1 through 5 (of 5 total)
  • Author
    Posts
  • #50977
    Elsa Soares
    Participant

    Hi,

    The shop header (I mean the banner) is not diplaying as should be in different screen resolutions, either on my site (www.bemvestir.moda) or on your demo.

    1. Default Store Banner
    1.1 – Banner on individual vendor’s page is displaying correctly the responsive mode.
    1.2 – Banner on general vendor’s page is not displaying correctly the responsive mode.

    2. Default Store Banner overrided in user by admin or in dashboard/settings/#branding by vendor
    2.1 – Banner on general vendor’s page is not displaying correctly the responsive mode.
    2.2 – Banner on general vendor’s page is not displaying correctly the responsive mode.

    I will be waiting for your precious help.

    Regards

    #51014
    Anna
    Member

    @bemvestir
    Are the banners all nearly the same dimensions?
    Adjustments can be made in the css by using multiple media queries, and you can add styles for the banner and icon using similar settings to these following media queries:

    /* Smartphones (portrait and landscape) ----------- */
    @media only screen
    and (min-device-width : 320px)
    and (max-device-width : 480px) {
    /* Styles */
    }
    
    /* Smartphones (landscape) ----------- */
    @media only screen
    and (min-width : 321px) {
    /* Styles */
    }
    
    /* Smartphones (portrait) ----------- */
    @media only screen
    and (max-width : 320px) {
    /* Styles */
    }

    Beneath the /*styles*/ add the sizes you wish to add for the responsive styles.

    #51050
    Elsa Soares
    Participant

    Hi Anna,

    Thank you for the reply.

    I used the same banner 1250×200 (http://www.bemvestir.moda/wp-content/uploads/2016/12/duty_free_shop_muc_banner33.jpg) for the situations I described.

    However I pasted the supplied code on my Quick CSS theme(Enfold) but I think it will be missing the said styles.
    Thus, I also need you to provide me with the code for those styles.

    Note: Please understand that I am just a fashion blogger with limited knowledge in this technical area.

    Regards

    Elsa Soaees

    #51075
    Anna
    Member

    Hello Elsa,
    I gave you an idea of how you’d use media queries for responsive styling; changing these styles to meet the needs of your site is up to you.
    You’d need to add your own styles following the /*styles*/ for each screen size range.

    #51084
    Elsa Soares
    Participant

    Hi Anna,

    I have to confess to you I can not understand why you can not give me an example of style, even because there is an obvious error in your plugin, which correctly displays the banner loaded from ‘Default Store Banner’ on vendor’s individual page, but incorrectly in all other situations. And this can be confirmed either in my theme (Enfold) or in your demo.

    For all this, I think it would not be too much if you could give me an example of style code, so I could follow, just as a reference.

    Have a good night.

    Elsa Soares

Viewing 5 posts - 1 through 5 (of 5 total)
  • The forum ‘WC Vendors Pro Support’ is closed to new topics and replies.