Hi everyone,
Can I add a search field like this to my site?
And I want to remove the search button from the right side
Thank you ![]()
![]()
![]()
In a Dev category thread titled âSearch section like on Reddit?â, ogulcan1787 asks how to add a Reddit-style search bar to their Discourse site and remove the default search button. pfaffman suggests checking the Search Banner topic, while Moin links to header-search. ogulcan1787 later requests help styling the search box with rounded edges and hover effects, referencing a Reddit screenshot. Moin advises using CSS and links to a guide, but ogulcan1787 admits difficulty implementing CSS. Lilly recommends learning theme basics or hiring help via Marketplace, providing several beginner guides. Heliosurge shares theme components for rounded borders and button styles. ogulcan1787 confesses to being a non-coder and requests ready-to-use code. After experimenting, ogulcan1787 shares working CSS for rounded corners and hover colors, but notes alignment issues on their site pvpfarm.com [13]. They also seek to vertically expand the search box [14]. JammyDodger notes that basic CSS questions may be out of scope, prompting ogulcan1787 to confirm theyâre using MDN for research. Lilly responds with a screenshot showing what appears correct, and links to MDN and W3Schools for centering elements.
Hi everyone,
Can I add a search field like this to my site?
And I want to remove the search button from the right side
Thank you ![]()
![]()
![]()
Search Banner, maybe? But searching could be a good way to find some potential solutions. ![]()
Thank you so much.
Can we ovalize the edges of the box?
@Moin
Like here.
And can we paint the inside?
With hover like on reddit
![]()
You can customize it with css.
@Moin thank you Moin but I canât do this, so Iâm asking for your help.
I watched his videos, I tried many times and it doesnât work.
I tried it on Firefox and Chrome.
If you are trying to learn to customize your forum, please take some time to learn some basics of themes, components and CSS. Alternatively, you can always post in Marketplace for paid help to customize your forum.
This Customization > Theme component might help
This one for button styles
Hello friends, I see you are trying to help me but I cannot write code.
If there is ready code I can only fix it.
If there is anyone who can help, Iâll wait.
Thank you.
What seems easy for you is difficult for me, the codes are too complicated for me.
Im a coder now
![]()
.floating-search-input .search-banner-inner.wrap .search-menu .search-input {
border-radius: 10px;
background-color: #3e3e58;
border: 0px solid;
}
.floating-search-input .search-banner-inner.wrap .search-menu .search-input:hover {
background-color: #4c4c6b;
}
Hi everyone!
.search-menu.menu-panel-results, .search-menu-container.menu-panel-results {
width: 600px;
left: 150px;
}
.floating-search-input .search-banner-inner.wrap .search-menu .search-icon {
left: 150px;
}
I wrote these codes, when I add them to the css field, it looks the way I want, but it doesnât look like that in others.
Can you help me pls ?
https://pvpfarm.com
![]()
And I want to expand the size of the search box slightly upwards. I couldnât find it, can anyone find it?
Just an FYI @ogulcan1787, this feels like it may be bordering on:
Have you been doing some research for these issues outside of this forum? I believe there are a lot resources available.
Yes, Iâm searching but I canât find it.
https://developer.mozilla.org/ I use that site