Search bar changes on CSM

[SNEnthu]

Hi guys, i want to change the search bar to rounded corners. 

As per my understanding i need to makes changes on the border-radius. 

Can anyone please tell me how i can achieve that? 

[Sid_Takali · Accepted solution]

Hi @SNEnthu You don't need to Clone/Customize widget for this kind of requirement. Just CSS override will work.

Follow below steps 

1. Ctrl + right Click 

2. Edit page properties

3. Add below CSS code in Page Specific CSS field 

#homepage-search input{
border-radius:24px !important
}

4. Save and verify the result

Please mark my response Correct/Helpful

Regards,

Sid

[SNEnthu]

Hi @MehakS , it does work you just need to find the appropriate class in order to apply the border-radius. incase it doesn't apply just give "important !; " in the end. that should do your job. Just inspect the search bar and play around see in which class does it start working on!