Search Box Template
Hello, I'm trying to add a customized Search Box Template for the Search Widget (not results).
I keep getting an error Cannot find template "~/Controls/SearchBox.ascx". What do I have to set for this to be able to read my template. My current code looks like this in the Control.
<%@ Register Assembly="Telerik.Cms.Web.UI" Namespace="Telerik.Cms.Web.UI" TagPrefix="sfWeb" %>
<fieldset class="sf_searchBox">
<asp:TextBox ID="queryText" runat="server" CssClass="sf_searchText"></asp:TextBox>
<input type="button" id="searchButton" runat="server" class="sf_searchSubmit" alt="Search" style="background-image: url('../App_Data/Sitefinity/WebsiteTemplates/HelpTemplate/App_Themes/Help/Images/searchIcon.jpg'); width: 25px; border: none;" />
</fieldset>
The image I am looking for is a SearchIcon image, but any time I try to load this template it just gives me the above error? Can someone point me in the right direction? Maybe I am missing a setting ?
Thank you!
Hi Heather,
How did you map the search box to the template? I believe the only way to map this particular control is the ViewMap (http://www.sitefinity.com/blogs/joshmorales/posts/11-07-26/customizing_sitefinity_4_controls_with_the_viewmap.aspx)
have you done that? does the actual user control template file exist at that path (spelling correct, etc)?
Hello, Thanks for replying. I mapped it under the Controls / ViewMap /
HostType: Telerik.Sitefinity.Services.Search.Web.UI.Public.SearchBox
LayoutTemplatePath: ~/Controls/SearchBox.ascx
Do I have to set anything under the actual Search Toolbox settings ?
Toolboxes/PageControls/Sections/Search/Tools/Search - under this menu ?
I currently have default settings for this. I don't see any changes after I changed the viewmap. Does it take a while for sitefinity to recognize these settings?
Thanks,
Heather
Heather,
Setting the ViewMap is all you need to configure to map the control to a template file. You might need to restart the application (save the web.config file to force this) but that's all that is needed.
The only thing I can think of (assuming you do have a control at the path ~/Controls/SearchBox.ascx) is either a) Permissions with the Controls folder blocking access, b) the Controls folder is somehow being used for something else and intercepting the request. if this is the case try putting it in a different folder, for example ~/Templates/SearchBox.ascx
or c) there is a problem with the template itself. if this is the case try using the original template as it is out of the box (it is available in the SDK) then try customizing it
Let me know if none of these apply and I'll see what else we can try.
hope this is helpful!
How do you find where the original Search box template is? I'm trying to create my own but I can't get the submit button to work. I got it to recognize the template by uploading it in the files section where you can upload documents.
I just need the sample code to see if I can customize it myself.
Thanks!
Heather,
Currently all the widget templates are available as part of the Sitefinity SDK. It installs them in a zip file to the path:
In the meantime here is the current (4.4) version of the template. You can paste this into your control and modify it from there. Just be sure not to remove any of the actual controls or you will receive an error.
<%@ Control Language="C#" %>
<%@ Register TagPrefix="sitefinity" Assembly="Telerik.Sitefinity" Namespace="Telerik.Sitefinity.Web.UI" %>
<
fieldset
id
=
"main"
class
=
"sfsearchBox"
runat
=
"server"
>
<
asp:TextBox
ID
=
"searchTextBox"
runat
=
"server"
CssClass
=
"sfsearchTxt"
/>
<
asp:Button
id
=
"searchButton"
runat
=
"server"
Text="<%$Resources:SearchResources, Search %>" OnClientClick="return false;" CssClass="sfsearchSubmit" />
</
fieldset
>
I tried the following code as it's own web control, and added it to the tool box under the "Search" options as Customized Search.
<%@ Control Language="C#" %>
<%@ Register TagPrefix="sitefinity" Assembly="Telerik.Sitefinity" Namespace="Telerik.Sitefinity.Web.UI" %>
<fieldset id="main" class="sfsearchBox" runat="server">
<asp:TextBox ID="searchTextBox" runat="server" CssClass="sfsearchTxt" Text="help" />
<asp:Button id="searchButton" runat="server" OnClientClick="return false;" CssClass="sfsearchSubmit" />
</fieldset>
However the search button still doesn't submit. Is there something I am missing ? I am still uploading through the file system. What makes this control submit the information?
I don't want to use the "Submit" button that comes with it. I am just trying to add another image (search magnifying glass that would be used) instead of the current submit button.
Thanks,
Heather
Heather,
I just noticed that the submit button returns false onclientclick. can you remove that and see if that does anything? I'm not sure why the template does this, let me see what I can find out...
However, If you only wish to style the box it isn't necessarily required that you remap an external template. the submit button uses the class .sfsearchSubmit so you can apply classes to that directly in your stylesheet.
Here is a similar style I used in an example a while back to show an image instead of the standard search box. no external template was used:
fieldset .sfsearchSubmit
background
:
url
(../images/search.png)
no-repeat
;
width
:
32px
;
height
:
32px
;
color
:
transparent
;
border
:
none
;
padding
:
2px
10px
;
Hi Header,
I added the following settings under Administration -> Settings -> Advanced -> Controls -> ViewMap -> Create new:
HostType: Telerik.Sitefinity.Services.Search.Web.UI.Public.SearchBox
LayoutTemplatePath: ~/SearchBox.ascx
This is the contents of my ~/SearchBox.ascx -
<%@ Control Language="C#" %>
<%@ Register TagPrefix="sitefinity" Assembly="Telerik.Sitefinity" Namespace="Telerik.Sitefinity.Web.UI" %>
<
fieldset
id
=
"main"
class
=
"sfsearchBox"
runat
=
"server"
>
Custom Search
<
asp:TextBox
ID
=
"searchTextBox"
runat
=
"server"
CssClass
=
"sfsearchTxt"
/>
<
asp:Button
id
=
"searchButton"
runat
=
"server"
Text="<%$Resources:SearchResources, Search %>" OnClientClick="return false;" CssClass="sfsearchSubmit" />
</
fieldset
>