Return to previous page

Search results regular price and sale price one below the other on desktop

This topic has 6 replies, 2 voices, and was last updated 5 months ago ago by Luca Rossi

  • Avatar: Anas
    Anas
    Participant
    September 16, 2024 at 11:23

    Hello team,

    Desktop: I need to adjust the price display on the dropdown search results. It should be one after the other as per the screenshot given.

    Mobile: and the both the prices in one line after the title and stock on mobile version (check screenshot) also stock amount doesnt show on mobile, can we keep it showing like on the desktop version.

    thanks

    Please, contact administrator
    for this information.
    Files is visible for topic creator and
    support staff only.
    #414517 Copied
    5 Answers
    Avatar: Justin
    Luca Rossi
    Support staff
    September 17, 2024 at 04:46

    Hi @Anas,

    1. Desktop: do you want to hide the original black price? Please add this custom CSS:

    
.price.etheme-search-form-item-price del {
    display: none;
}

.price.etheme-search-form-item-price ins .amount {
    color: #000;
}

    2. Mobile: we’ve added the product stock on mobile for you. Please also add this custom CSS codes:

    
@media (max-width: 480px){
    .etheme-search-form .price.etheme-search-form-item-price {
        flex-basis: 100%;
        margin-left: calc(52px + 1.5rem);
    }
    .etheme-search-form .autocomplete-suggestion>a {
        flex-wrap: wrap;
    }
    .etheme-search-form .etheme-search-form-item-info {
        flex-basis: 70%
    }
}

    https://prnt.sc/Fe6qDcstB9Oo

    Hope it helps!

    #414619 Copied
    Avatar: Anas
    Anas
    Participant
    September 17, 2024 at 04:52

    hi, nope i dont want to hide the original black price, i need both the prices one below the other and not inline

    #414620 Copied
    Avatar: Justin
    Luca Rossi
    Support staff
    September 17, 2024 at 10:59

    Hi @Anas,

    Please remove this custom CSS:

    
.price.etheme-search-form-item-price del {
    display: none;
}

.price.etheme-search-form-item-price ins .amount {
    color: #000;
}

    And add this custom CSS instead:

    
.etheme-search-form-item-price {
    display: flex;
    flex-direction: column;
}

    Hope it helps!

    #414701 Copied
    Avatar: Anas
    Anas
    Participant
    September 17, 2024 at 15:01

    thanks

    #414755 Copied
    Avatar: Justin
    Luca Rossi
    Support staff
    September 18, 2024 at 04:37

    Hi @Anas,

    In the spirit of gratitude, we want to express our appreciation for your trust in our products. As a valued customer, your experience matters greatly. Would you consider sharing it by giving our theme a deserving 5-star rating on ThemeForest?

    Click here to share your thoughts: https://themeforest.net/downloads

    Being part of our community means a lot, and your feedback contributes immensely.

    Best Regards,
    The 8Theme Team

    #414799 Copied

  • Tagged: , , , , , ,

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

The issue related to '‘Search results regular price and sale price one below the other on desktop’' has been successfully resolved, and the topic is now closed for further responses

Useful links WooCommerce & WordPress

Unleash your online potential

Explore our best WordPress WooCommerce Themes collection

lazy-placeholder
Artmaxy Store – WordPress WooCommerce Theme
lazy-placeholder
Coffee Store – WordPress WooCommerce Theme
lazy-placeholder
Carwash – WordPress WooCommerce Theme
lazy-placeholder
Hotel – WordPress Theme
lazy-placeholder
WooPress – WooCommerce WordPress Theme
lazy-placeholder
Beauty – WooCommerce Theme
lazy-placeholder
Baby Shop – WordPress WooCommerce Theme
lazy-placeholder
Furniture Store – WordPress WooCommerce Theme
lazy-placeholder
Organic Store – WordPress WooCommerce Theme
lazy-placeholder
Wedding Store – WordPress WooCommerce Theme

See All Templates

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