WebSite X5Help Center

 
Bjorn Andreassen
Bjorn Andreassen
User

Search field on website  en

Author: Bjorn Andreassen
Visited 1538, Followers 3, Shared 0  

How can I create a search field on a website. Do not mean the "template customization" area, but in the content area.

Posted on the
3 ANSWERS - 2 USEFUL - 1 CORRECT
JJ. JUAG
JJ. JUAG
User

In the header and footer, you can enable page internal search function with the icon of binoculars.
For responsive presentation where these do not exist, you can create the link to

http://wwwDOMAIN.EXT/imsearch.php?search=   domain.ext = your domain


Regards JJ.

Read more
Posted on the from JJ. JUAG
Paul M.
Paul M.
Moderator

Hello Bjorn,

The following code will recreate the default WebSite X5 search field when pasted in an HTML Code Object on any page:

<form id="imSearch_0" action="imsearch.php" method="get" style="white-space: nowrap"><fieldset><input type="text" name="search" value="" style="width: 88px; line-height: 21px; font: normal normal normal 8pt Tahoma; color: #000000; background-color: #FFFFFF; background-image: url('res/imsearch.png'); background-position: 2px center; background-repeat: no-repeat; padding: 3px 3px 3px 21px; margin: 0; border: 1px solid #000000; vertical-align: middle; border-top-left-radius: 5px; border-top-right-radius: 5px; border-bottom-left-radius: 5px; border-bottom-right-radius: 5px;" /><span onclick="$('#imSearch_0').submit();" style="height: 21px; font: normal normal normal 8pt Tahoma; color: #000000; color: #000000; background-color: #D3D3D3; margin-left: 6px; padding: 3px 6px 3px 6px; border: 1px solid #000000; vertical-align: middle; cursor: pointer; border-top-left-radius: 5px; border-top-right-radius: 5px; border-bottom-left-radius: 5px; border-bottom-right-radius: 5px;">Search</span></fieldset></form>

You can customise the colours, font and size etc. to your liking by changing the appropriate values in the code.

Be aware also that it would be good practice to change the 'form id' to something unique.

Kind regards,

Paul

Read more
Posted on the from Paul M.
Bjorn Andreassen
Bjorn Andreassen
User
Author

Now it works :) Thx!

Read more
Posted on the from Bjorn Andreassen