[3.2] [erledigt] prosilver: search-box: rechts oben: in die navbar_header.html verschieben

[ZNC]

[3.2] prosilver: search-box: rechts oben: in die navbar_header.html verschieben

Die forenweite Suche ist rechts oben in der overall_header.html platziert (verkürzte Darstellung):

Code: Alles auswählen

<!-- Alle Foren durchsuchen -->
<!-- id: wrap > id: page-header > class: headerbar > class: inner > id: search-box -->
<div id="wrap" class="wrap">
	<div id="page-header">
		<div class="headerbar" role="banner">
			<div class="inner">
				<!-- IF S_DISPLAY_SEARCH and not S_IN_SEARCH -->
				<div id="search-box" class="search-box search-header" role="search">
					<form action="./search.php" method="get" id="search">
						<fieldset>
							<input name="keywords" id="keywords" type="search" maxlength="128" title="Suche nach Wörtern" class="inputbox search tiny" size="20" value="" placeholder="Suche…" />
							<button class="button button-search" type="submit" title="Suche">
								<i class="icon fa-search fa-fw" aria-hidden="true"></i>
								<span class="sr-only">Suche</span>
							</button>
							<a href="./search.php" class="button button-search-end" title="Erweiterte Suche">
								<i class="icon fa-cog fa-fw" aria-hidden="true"></i>
								<span class="sr-only">Erweiterte Suche</span>
							</a>
						</fieldset>
					</form>
				</div>
				<!-- ENDIF -->
			</div>
		</div>
	</div>
</div>

Nunmehr möchte ich diesen Bereich rechts auf die Zeile Forenübersicht in die navbar_header.html verschieben. Diese ist bereits dort mit einer Lupe verankert und wird sichtbar, sobald man den Viewport verkleinert. Hierzu habe ich folgende Frage: Welche Bewandtnis hat es mit der If-Klausel "IF S_DISPLAY_SEARCH and not S_IN_SEARCH"?

[Kirk]

Hallo
Für sowas gibt es eine Extension: https://www.phpbb.com/community/viewtop ... &t=2414701

[ZNC]

Danke Kirk, ich möchte die Anzahl der Extensions so gering als möglich halten. Da dies das Layout betrifft und ich einige Änderungen an meinem prosilver-Style sowieso vornehme, kann ich dies genauso in einem Rutsch selber (dokumentiert, so das es später nachvollzogen werden kann) händisch anpassen.

Kann die If-Clause mir irgendwie dazwischen funken? Wofür steht diese bzw. wann greift die?

[Dr.Death]

Hi,

das heißt kurz übersetzt:

S_DISPLAY_SEARCH and not S_IN_SEARCH

Wenn du als Betrachter die Berechtigung zur Suche hast (S_DISPLAY_SEARCH) und Du dich nicht innerhalb der Suche befindest (and not S_IN_SEARCH), dann zeige das Suchfeld an.

[ZNC]

Danke mein Workaround sieht folgendermaßen aus:

Ziel: Suchformular auf der Homepage von oben rechts neben dem Logo auf die Zeile "Foren-Übersicht" umsetzen:

Aus dem overall_header.html unterhalb der Bereiche id: wrap > id: page-header > class: headerbar > class: inner folgenden Inhalt komplett auschneiden und somit löschen:

Code: Alles auswählen

<!-- IF S_DISPLAY_SEARCH and not S_IN_SEARCH -->
<div id="search-box" class="search-box search-header" role="search">
	<form action="{U_SEARCH}" method="get" id="search">
		<fieldset>
			<input name="keywords" id="keywords" type="search" maxlength="128" 
			title="{L_SEARCH_KEYWORDS}" class="inputbox search tiny" size="20" 
			value="{SEARCH_WORDS}" placeholder="{L_SEARCH_MINI}" />
			<button class="button button-search" type="submit" title="{L_SEARCH}">
				<i class="icon fa-search fa-fw" aria-hidden="true"></i>
				<span class="sr-only">{L_SEARCH}</span>
			</button>
			<a href="{U_SEARCH}" class="button button-search-end" title="{L_SEARCH_ADV}">
				<i class="icon fa-cog fa-fw" aria-hidden="true"></i>
				<span class="sr-only">{L_SEARCH_ADV}</span>
			</a>
			{S_SEARCH_HIDDEN_FIELDS}
		</fieldset>
	</form>
</div>
<!—ENDIF -->

Den ausgeschnittenen Bereich in die Datei navbar_header.html innerhalb <ul id="nav-breadcrumbs" class="nav-breadcrumbs linklist navlinks" role="menubar"> hinter <!-- EVENT overall_header_breadcrumbs_after --> einfügen:

Code: Alles auswählen

<!-- IF S_DISPLAY_SEARCH and not S_IN_SEARCH -->
<li id="search-box" class="rightside search-box search-header" role="search">
	<form action="{U_SEARCH}" method="get" id="search">
		<fieldset>
			<input name="keywords" id="keywords" type="search" maxlength="128" 
			title="{L_SEARCH_KEYWORDS}" class="inputbox search tiny" size="20" 
			value="{SEARCH_WORDS}" placeholder="{L_SEARCH_MINI}" />
			<button class="button button-search" type="submit" title="{L_SEARCH}">
				<i class="icon fa-search fa-fw" aria-hidden="true"></i>
				<span class="sr-only">{L_SEARCH}</span>
			</button>
			<a href="{U_SEARCH}" class="button button-search-end" 
			title="{L_SEARCH_ADV}">
				<i class="icon fa-cog fa-fw" aria-hidden="true"></i>
				<span class="sr-only">{L_SEARCH_ADV}</span>
			</a>
			{S_SEARCH_HIDDEN_FIELDS}
		</fieldset>
	</form>
</li>
<!-- ENDIF -->

Bitte beachten: das DIV mit der ID search-box zu einem LI und auch das DIV-Endetag zum LI-Endetag ändern. Die class-Angabe mit rightside ergänzen.

Das Layout dann mit CSS auf die eigenen Bedürfnisse glatt ziehen. Tipp: .search-header {margin:0;}