[Support request] Customize the search bar

Home Forums Support [Support request] Customize the search bar

Home Forums Support Customize the search bar

Viewing 8 posts - 1 through 8 (of 8 total)
  • Author
    Posts
  • #2300209
    Justin

    I want to customize the search bar.
    I added the search bar on the right sidebar by using elements.
    However, there is no function to customize the search bar.

    Therefore, I will have to change it by adding code to CSS.
    I don’t want to use any plug-in.

    Can you advise how I can modify the code for search bar?
    I want to make the search borders round on the edges and add text “Search…” inside with the color blue?

    #2300285
    Fernando
    Customer Support

    Hi Justin,

    Can you share the link to your site?

    You may use the private information field for this: https://docs.generatepress.com/article/using-the-premium-support-forum/#private-information

    #2300297
    Justin

    My site is currently in staging so I do not have a link to share

    #2300311
    Fernando
    Customer Support

    I see. What search bar are you using? Is it the one from GP or from WP?

    #2301368
    Justin

    Search bar created in GP with elements

    #2301375
    Fernando
    Customer Support

    If you’re using the WP Search Block, you can add the placeholder to the block itself.

    In terms of design, here are a couple of CSS you can try adding through Additional CSS:

    input[type="search"] {
        border: solid 3px #0000ff;
        border-radius: 20px;
        color: #0000ff;
    }
    
    input[type="search"]::placeholder{
        color: #0000ff;
    }

    You may modify theme as well to your preference.

    #2304788
    Justin

    didn’t work

    #2304971
    David
    Staff
    Customer Support

    Hi there,

    are you using a Block Element ? And is it a Search Block that you used ?

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