Remove Search Box & add search icon to navigation

Articles and Information - phpBB 3.0 modifications and tweaks

Remove Search Box & add search icon to navigation

Postby Mick » Sun Mar 19, 2017 12:48 pm

Remove Search Box

Open styles/prosilver/template/overall_header.html

Find and remove:
Code: Select all
<!--‚ IF‚ S_DISPLAY_SEARCH‚ and‚ not‚ S_IN_SEARCH‚ -->
<
div‚ id="search-box"><form‚ action="{U_SEARCH}"‚ method="post"‚ id="search">
<
fieldset><input‚ name="keywords"‚ id="keywords"‚ type="text"‚ maxlength="128"‚ title="{L_SEARCH_KEYWORDS}"‚ class="inputbox‚ search"‚ value="<!--‚ IF‚ SEARCH_WORDS-->{SEARCH_WORDS}<!--‚ ELSE‚ -->{L_SEARCH_MINI}<!--‚ ENDIF‚ -->"‚ onclick="if(this.value=='{LA_SEARCH_MINI}')this.value='';"‚ onblur="if(this.value=='')this.value='{LA_SEARCH_MINI}';"‚ />
<
input‚ class="button2"‚ value="{L_SEARCH}"‚ type="submit"‚ /><br‚ />
<
a‚ href="{U_SEARCH}"‚ title="{L_SEARCH_ADV_EXPLAIN}">{L_SEARCH_ADV}</a>‚ {S_SEARCH_HIDDEN_FIELDS}
</
fieldset>
</
form>
</
div>
<!-- ENDIF -->  


Add search icon to navigation

Open styles/prosilver/template/overall_header.html.

Find:
Code: Select all
<li‚ class="icon-faq"><a‚ href="{U_FAQ}"‚ title="{L_FAQ_EXPLAIN}">{L_FAQ}</a></li>‚ ‚

Before add:
Code: Select all
<li‚ class="icon-search"><a‚ href="{U_SEARCH}"‚ title="{L_SEARCH_ADV_EXPLAIN}">{L_SEARCH}</a></li>‚ ‚


To centre your logo:

Make a copy of common.css and save it somewhere safe.

Open common.css and find:
Code: Select all
#logo‚ {
float:‚ left;
width:‚ auto;
padding:‚ 10px‚ 13px‚ 0‚ 10px;
}  

Replace with:
Code: Select all
#logo‚ {
width:‚ auto;
padding:‚ 0px;
}  

Find:
Code: Select all
   ‚ #site-description‚ {
float:‚ left;
width:‚ 70%;
}  

Replace with:
Code: Select all
#site-description‚ {
text-align:center;
width:100%;
}  


You may find the gap between the banner and the navbar is too big so you can edit:

Change:
Code: Select all
<h1>{SITENAME}</h1>‚ ‚

To:
Code: Select all
<h1 style="display: none;">{SITENAME}</h1>    

And or:
Code: Select all
<p>{SITE_DESCRIPTION}</p>    

To:
Code: Select all
<p style="display: none;">{SITE_DESCRIPTION}</p>    

From overall_header.html if you aren't using them. This last part basically stops the site name and site description from displaying rather than removing them altogether which can effect the SEO.

Refresh your template
"The more connected we get the more alone we become" - Kyle Broflovski
User avatar
Mick
 
Posts: 24
Joined: Wed Mar 15, 2017 9:14 am

Return to Articles and information

Who is online

Users browsing this forum: Baidu [Spider] and 2 guests

cron