General tabs – horizontal view on mobile

This topic has 10 replies, 3 voices, and was last updated 1 years, 5 months ago ago by Rose Tyler

  • Avatar: TheOne
    TheOne
    Participant
    November 25, 2022 at 21:17

    Hello,

    I’ve imported the general tabs (sushi menu) from your demo.

    On mobile it shows the tabs verticaly. Can we display it horizontaly (like a slider) ? Or like 2-3 in the row?

    https://xstore.8theme.com/elementor/demos/sushi/our-menu/

    Thank you,

    9 Answers
    Avatar: Rose Tyler
    Rose Tyler
    Support staff
    November 26, 2022 at 06:55

    Hello,

    There is no such option, unfortunately.
    Try to use the next custom CSS code:

    @media only screen and (max-width: 767px) {
        .et-advance-tabs .et-tabs-nav>ul {
            display: inline-block;
        }
        .et-advance-tabs .et-tabs-nav>ul .et-tab-nav {
            max-width: 32.5%;
        }
    }

    Regards

    Avatar: TheOne
    TheOne
    Participant
    December 4, 2022 at 19:46

    Hello,

    This dosen’t seem to work. Does it work on all horizontal styles or only specific?

    PS: i just noticed that you can set “select type on responsive” and it came out just fine! Can you check the code just in case? (for future projects)

    Avatar: Tony Rodriguez
    Tony Rodriguez
    Support staff
    December 5, 2022 at 07:52

    Hello, @TheOne,

    Actually, the code that we shared with you will show the tabs like this: https://postimg.cc/Y4jb0Pq4 it will not make the tabs as a slider. If the code is not showing like this on your site then please share your site wp-admin URL and access in the private content area of this topic by following the below-given format

    WORDPRESS ADMIN URL:
    WORDPRESS ADMIN USERNAME:
    WORDPRESS ADMIN PASSWORD:

    So that I will check and fix your issue on your site.

    Regards 8Themes Team.

    Avatar: TheOne
    TheOne
    Participant
    December 5, 2022 at 18:37

    Hello,

    Yes – access in private. Like i said i have solved my previous problem on mobile with “select type on responsive”. Tho i saw the changes in editor but i didn’t saw them on frontend.

    I am trying to use your code to display my general tabs on Desktop view in two rows. It works in elementor editor but not on frontend.

    Please contact administrator
    for this information.
    Avatar: Tony Rodriguez
    Tony Rodriguez
    Support staff
    December 6, 2022 at 05:04

    Hello, @TheOne,

    Sorry for the inconvenience but your provided WP Admin Logins are not correct, please watch the video under the private content area and provide me the correct/tested and working Logins of the site.

    Regards 8Themes Team.

    Please contact administrator
    for this information.
    Avatar: TheOne
    TheOne
    Participant
    December 6, 2022 at 09:49

    Hello,

    I’m sorry, i forgot i changed the path.
    Correct one in private.

    Please contact administrator
    for this information.
    Avatar: Tony Rodriguez
    Tony Rodriguez
    Support staff
    December 6, 2022 at 10:23

    Hello, @TheOne,

    Thanks for the access. I have checked your site and found that you are facing a cache issue nothing else because on mobile the select type appears fine on the front-end. see the image: (Private Content)

    To show the general tabs on the desktop view in two rows simply go to the Dashboard >> XStore >> Theme Settings >> Theme Custom CSS >> Global and paste the below code at the bottom of the CSS box there.

    @media(min-width:992px){
    .elementor-3793 .elementor-element.elementor-element-6668a00c .et-tabs-horizontal .et-tabs-nav ul{display:inline-block !important;}
    .elementor-3793 .elementor-element.elementor-element-6668a00c .et-advance-tabs .et-tabs-nav > ul li{margin-bottom:10px !important;}}

    Then save settings and check back to your site after clearing the browser cache.

    Regards 8Themes Team.

    Please contact administrator
    for this information.
    Avatar: TheOne
    TheOne
    Participant
    December 6, 2022 at 13:12

    Hello,

    That did the job perfectly, thank you! Awesome support as always.
    Once again can you move the picture of the site to private?

    Avatar: Rose Tyler
    Rose Tyler
    Support staff
    December 6, 2022 at 13:16

    Hello,

    You’re welcome!

    Regards

  • Viewing 10 results - 1 through 10 (of 10 total)

You must be logged in to reply to this topic.Log in/Sign up

We're using our own and third-party cookies to improve your experience and our website. Keep on browsing to accept our cookie policy.