Customize DDG Search Box on Homepage?

<hidden> anonymous
Created: 4 years and 1 month ago • Updated: 4 years and 1 month ago
Hi,
I use the DuckDuckGo search box on my website and made the code with this tool: https://duckduckgo.com/search_box
Search Results can be modiefied to match the look of the website with this Params: https://duckduckgo.com/params

But is there a way to change the green icon with the white magnifier at the end of the search box on my website (can be seen at the first link)? Green does not match the theme of my website at all and I would like to have a grey or blue icon.

Right now I just cut off the icon by changing the width:
<iframe src="http://duckduckgo.com/search.html?width=150&site=fliegentoeter.eu&prefill=Search&kp=1&kn=1&kaf=1&kh=1&kj=%23222222&ky=%23e6e6e6&kx=%23357ebd&k7=%23ffffff&k8=%23444444&k9=%23357ebd"style="overflow:hidden;margin:0;padding:0;width:166px;height:40px;" frameborder="0"></iframe>

But without the "search-button" it seams like something is missing - which of course is true.

Thanks

This forum has been archived

Thank you all for the many comments, questions and suggestions. Particular thanks go to user x.15a2 for constantly monitoring, replying and helping so many users here. To continue these discussions, please head over to the DuckDuckGo subreddit.


MyUser
Hi there,

I think I've found a way, inspired by code at http://stackoverflow.com/questions/64947.... Here it is:

Code:
<iframe src="https://duckduckgo.com/search.html?prefill=Search%20DuckDuckGo" frameborder="0" id="iframe"></iframe>

<script src="sys/js/jquery.js"></script>

<script>
	//alert("hey");

$('iframe').load( function() {
    $('iframe').contents().find("head")
      .append($("<style type='text/css'>  #search_button_homepage { background-color: red; }  </style>"));
});

</script>


It's slightly messy, and will need tinkering but it should work.

Some notes to make: #search_button_homepage { * } styles the button as far as I can see. However, dive into the source of the page at https://duckduckgo.com/search.html to make sure.

To style the button, just add CSS values within the {braces} after #search_button_homepage.

Hope this makes sense,
Then, hope it works,
Cheers,
MyUser
posted by MyUser 4 years and 1 month ago Link
anonymous
So I have to add a JavaScript to change colors?
Sorry, but this is a No Go for me. Before i use JavaScript for this I just change the width to cut off the "green part". But unfortunately you have to leave some px because of the border. So there is still some green stuff or you don't have a border on the right side:
[http://s1.directupload.net/images/140805/yz9qw6np.png]
Bad enough you have to use an iframe to add the search.

Is there a chance some of the developers do find this and can add some more colors to the search box? As i can tell it is only an image and I hope it is very easy for them to add a grey, blue ... one. Or let you choose the color by rgb code entirely.
posted by <hidden> • 4 years and 1 month ago Link
vacances64
Mercie beaucoup! C'est très important tes informations même pour moi!
posted by vacances64 4 years and 1 month ago Link
This comment has been removed for violation of our forum rules.
posted by <hidden> • 4 years and 1 month ago