Dummy Quick Search div for Guest users

[WebCMS]

When Quick Search is disabled for Guest users, it does not render the Search input field as expected. However, this might result in making non-savvy guest users thinking that the site does not have a search feature.

Instead, display a dummy div similar to the search input that cannot be edited and has a placeholder text and "not-allowed" cursor to indicate its availability to logged-in users only which may encourage guests to sign up. It's not a readonly input that could be manipulated in the inspector to submit. This will also ensure positional integrity. You can see this implemented on our site.

 

Here is the (quick-n-dirty) code that went into the quickSearch template as its {{else}} part at its bottom - we applied our site's color #dae1e8 as its background to blend with the Default theme (you can use lightgray, etc):

{{else}}{{// Your comment}}
    <div id="elSearchWrapper">
        <div id='elSearch' style="background-color:#dae1e8;cursor:not-allowed">
            <span class="ipsApp input" style="text-align:center;vertical-align:middle;line-height:2.5;font-size:13px;font-style:italic;padding:0px 16px">Login to Search...</span>
        </div>
    </div>
{{endif}}

Please make the above chunk as part of the IC core (with CSS ID selectors for the div and span) so do not have to tweak templates.