Hello there. . .
I took my clean header template and fiddled around with the examples above, the code I have looks like this. . .
The relevant lines are in red.
Code:
<div class="site-logo header-edit-box">
<a href="{vb:raw baseurl}/"><img src="{vb:stylevar titleimage}" data-orig-src="{vb:stylevar titleimage}" alt="{vb:phrase logo}" title="{vb:phrase powered_by_vbulletin_title}" /></a>
</div>
</div>
<vb:comment><div class="toolbar">
<ul class="h-right">
{vb:hook 'header_toolbar'}
{vb:data searchperm, user, hasPermissions, forumpermissions, cansearch}
<vb:if condition="$searchperm AND $vboptions['enablesearches']">
<li class="search-container">
<form id="searchForm" action="{vb:url 'search'}" class="h-left" method="GET">
<div class="h-left">
<div class="search-box search-btn-inside-box">
<input type="text" name="q" id="q" placeholder="{vb:phrase search}" class="textbox search-term" autocomplete="off" />
<button type="submit" id="btnSearch" class="search-btn" title="{vb:phrase search}"><span class="vb-icon vb-icon-search"></span></button>
<div class="vertical-divider-left"></div>
<div id="searchPopupControl" title="{vb:phrase filter_search}"><span class="vb-icon vb-icon-arrow-down-small"></span></div>
<div id="searchPopupContent">{vb:template search_popup, page={vb:raw page}, user={vb:raw user}}</div>
</div>
</div>
</form>
</li>
</vb:if>
</ul>
</div>
<vb:if condition="$useSitebuilder">
<div class="disable-overlay"></div>
/</vb:if></vb:comment>
</div>
<div id="channel-tabbar" class="h-clearfix noselect">
<ul class="h-left">
<vb:comment>responsive:markup:move and rebuild search</vb:comment>
<li id="mobile-main-menu" class="mobile sections">
<div id="mobile-main-menu-sections">
<div class="main-menu-control-sections collapsed">
<span class="sections-menu-icon"><span class="icon h-left collapsed" ></span></span>
<span class="sections-title collapsed">{vb:phrase sections}</span>
<span class="sections-icon"><span class="icon h-left collapsed"></span></span>
</div>
</div>
<div id="mobile-main-menu-search"></div>
<span class="mobile-search"><span class="icon h-right"></span></span>
</li>
<vb:if condition="!empty($page['channelid'])">
{vb:set navbarCurrentChannelId, {vb:var page.channelid}}
<vb:elseif condition="!empty($page['nodeid'])" />
{vb:set navbarCurrentChannelId, {vb:var page.nodeid}}
<vb:else />
{vb:set navbarCurrentChannelId, 0}
</vb:if>
{vb:data navbarItems, 'site', 'loadHeaderNavbar', '1', {vb:raw _SERVER.REQUEST_URI}, 0, {vb:var navbarCurrentChannelId}}
<vb:each from="navbarItems" value="navbarItem">
{vb:set navbarTitle, {vb:raw navbarItem.title}}
{vb:set normalizedUrl, {vb:raw navbarItem.normalizedUrl}}
<vb:if condition="$targetAttr = !empty($navbarItem['newWindow']) ? ' target=\'_blank\'' : ''"></vb:if>
<vb:if condition="!empty($navbarItem['attr'])">
{vb:strcat targetAttr, ' '}
{vb:strcat targetAttr, {vb:raw navbarItem.attr}}
</vb:if>
<vb:if condition="$itemUrl = $navbarItem['isAbsoluteUrl'] ? $normalizedUrl : ($baseurl . '/' . $normalizedUrl)"></vb:if>
<vb:if condition="$atCurrentItem = !empty($navbarItem['current'])"></vb:if>
<vb:if condition="$currentClass = $atCurrentItem ? 'current' : ''"></vb:if>
<vb:if condition="$atCurrentItem">{vb:set subnavItems, {vb:raw navbarItem.subnav}}</vb:if>
<li class="{vb:raw currentClass} section-item">
<a{vb:raw targetAttr} href="{vb:raw itemUrl}" class="h-left {vb:var navbarTitle}">{vb:phrase {vb:raw navbarTitle}}</a>
<span class="mobile dropdown-icon"><span class="icon h-right"></span></span>
</li>
</vb:each>
{vb:hook 'header_tabbar'}
</ul>
<div id="navigationbar">
<ul class="h-right">
{vb:hook 'header_toolbar'}
{vb:data searchperm, user, hasPermissions, forumpermissions, cansearch}
<vb:if condition="$searchperm AND $vboptions['enablesearches']">
<li class="search-container">
<form id="searchForm" action="{vb:url 'search'}" class="h-left" method="GET">
<div class="h-left">
<div class="search-box search-btn-inside-box">
<input type="text" name="q" id="q" placeholder="{vb:phrase search}" class="textbox search-term" autocomplete="off" />
<button type="submit" id="btnSearch" class="search-btn" title="{vb:phrase search}"><span class="vb-icon vb-icon-search"></span></button>
<div class="vertical-divider-left"></div>
<div id="searchPopupControl" title="{vb:phrase filter_search}"><span class="vb-icon vb-icon-arrow-down-small"></span></div>
<div id="searchPopupContent">{vb:template search_popup, page={vb:raw page}, user={vb:raw user}}</div>
</div>
</div>
</form>
</li>
</vb:if>
</ul>
</div>
</div>
<vb:if condition="$useSitebuilder">
<div class="disable-overlay"></div>
/</vb:if>
</div>
<div id="channel-subtabbar" class="h-clearfix {vb:if empty($subnavItems), h-hide}">
<ul class="h-left">
To comply with the rule of my permitted 20000 characters, I had to remove the text above and below the affected area. Otherwise, this is my header template complete.
The result of this has put the search box in the navigation bar where I think it is intended.
However.
Should the screen of the computer be fully zoomed in,
https://vborg.vbsupport.ru/attachmen...1&d=1447141209
You can see there are now 2 search box options and the nav bar search returns a warning.
https://vborg.vbsupport.ru/attachmen...1&d=1447141209
Perhaps this is the result? Or perhaps I went wrong somewhere?
And why would anybody want to fully zoom in?
I have no idea how this behaves on a mobile device.
Thanks. . .