[Resolved] How to customize the default WP search form on prime to match the template demo

Home Forums Support How to customize the default WP search form on prime to match the template demo

Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • #1394369
    adriendemonta

    Dear Generatepress Team,

    First of all thank you so much for the new update. It’s incredible!!!

    I need your help. I’m using prime template and since i don’t use Woocommerce for this site, I’d just like to use the default WP search form that I have added into element to replace Prime Woocommerce ajax search form.
    This is the code I’m now using :

    Here is the styling I have now:

    .wp-search {
    margin-left: 30px;
    margin-right: 30px;
    -webkit-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
    }

    #masthead .site-branding,
    .wp-search {
    margin-bottom: 20px;
    }

    I am trying to style it to get as close as possible to your Prime template but i’m stuck.
    I would really appreciate if you could help me there.

    Here are two screenshots to give you more details:
    https://tinyurl.com/yxghjj9w
    https://tinyurl.com/yxfwfe8s

    Thank you so much in advance for your help and time. Best, Adrien

    #1394436
    Tom
    Lead Developer
    Lead Developer

    Hi there,

    Give this CSS a shot:

    .wp-search form.search-form {
        display: flex;
    }
    
    .wp-search form.search-form label {
        flex-grow: 1;
        padding-right: 5px;
    }
    
    .wp-search input[type=search] {
        width: 100%;
        box-sizing: border-box;
    }
    #1395232
    adriendemonta

    Dear Tom,

    It worked perfectly!
    Thank you so much for taking the time to help me. I really appreciate it.
    Best, Adrien.

    #1395783
    Tom
    Lead Developer
    Lead Developer
Viewing 4 posts - 1 through 4 (of 4 total)
  • You must be logged in to reply to this topic.