Template "Under the bridge", Stand Überleger ändern

[Eliquas]

Hallo CMSimple-Profis.

Ich arbeite mich gerade in CMSimple_XH ein. Das klappt auch schon sehr gut. Jetzt habe ich aber ein paar Probleme, bei denen ich Hilfe benötige. Ich habe die Seite aufgebaut und das Template "Under the Bridge" von "momadu.de" installiert. Im Originaltemplate war die Trennung zwischen dem oberen (dem Bild) und unteren Teil (dem Inhalt) ungefähr in der Mitte des Bildschirms. Oben in der Bildhälfte befanden sich eine Searchbox und ein Menu. Da ich Beides nicht benötigte, habe ich es im CSS des Templates deaktiviert. Nun ist aber leider die Trennung zwischen Bid und Inhalt nach oben gerutscht.

1. Frage: Was muss ich wo einstellen, damit die "Trennlinie" wieder in die Mitte des Bildschirmes rückt? Auch bei der Betrachtung auf dem Handy ist vom Bild nur ein schaler Streifen zu sehen. Was muss ich wo einstellen, damit vom Bild mehr zu sehen ist?

2. Frage: Die Höhe der Buttons im Menu würde ich gerne etwas niedriger einstellen. Wo mache ich das?

3. Frage: Ist es möglich, die Titelzeile ((Timeoutplus) etwas höher zu setzen? Wo und wie geht das?

4. Frage: Auf jeder Seite wird im Ihnalt oben rechts der Titel des Buttons angezeigt (Start, Werdegang, usw.) Das möchte ich ausblenden. Wo und Wie?

Im voraus vielen Dank für Eure Hilfe.

Hier der Link zur Seite: http://www.elias-webdesign.de/flamme_ti ... /index.php

[lck]

1. Frage: Was muss ich wo einstellen, damit die "Trennlinie" wieder in die Mitte des Bildschirmes rückt? Auch bei der Betrachtung auf dem Handy ist vom Bild nur ein schaler Streifen zu sehen. Was muss ich wo einstellen, damit vom Bild mehr zu sehen ist?

Einfachste Möglichkeit.
Lass die template.htm so wie sie im Original ist und ändere in der stylesheet.css folgendes:
Zeile 187

Code: Select all

.tpllck_headnav {
	border: 0px solid red;
	line-height: 3em;
	margin: 0 auto;
	max-width: 1170px;
	padding: 2em 2em 0;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	display: none; /* <<<--- das hinzufügen */
}

Zeile 469

Code: Select all

@media only screen and (min-width: 801px) and (max-width: 1024px) {
.tpllck_head {
	height: 20vh; /* <<<--- war voher auto */
}

und Zeile 489

Code: Select all

.tpllck_head {
	background: none;
	background-color: rgba(0, 0, 0, 0);
	height: 10vh; /* <<<--- war voher auto */
}

2. Frage: Die Höhe der Buttons im Menu würde ich gerne etwas niedriger einstellen. Wo mache ich das?

lck_ddmenu.css Zeile 69

Code: Select all

.tpllck_nav .menulevel1 > li {
	font-size: 1rem;
	font-weight: 500;
	height: 4rem; /* <<<--- ändern zu Beispiel 3rem */
	line-height: 0;
	width: 15rem;
}

3. Frage: Ist es möglich, die Titelzeile ((Timeoutplus) etwas höher zu setzen? Wo und wie geht das?

Müsste sich durch den Workaround zur "1. Frage" erledigt haben. Lediglich bei kleineren Viewports kann eine Anpassung noch nötig sein.

4. Frage: Auf jeder Seite wird im Ihnalt oben rechts der Titel des Buttons angezeigt (Start, Werdegang, usw.) Das möchte ich ausblenden. Wo und Wie?

Du meinst oben links die Brotkrümmelnavigation.
stylesheet.css 276

Code: Select all

.tpllck_locator {
	margin-bottom: 1em;
	display: none; /* <<<--- das hinzu */
}

[Tata]

Wenn ich nicht irre, dann gibt es zwei möglichkeiten ein element unsichtbar zu machen:
1. display:none; - das nimt den Element total weg auch mit den physischen DImensionen.
2. visibility: hidden - ausblendet ein Element, ohne die Platz abyunehmen. G.h. Die Fläche des ausgeblendeten Element bleibt unberührt.
Versuch es.

[Eliquas]

Vielen Dank an Ick.

Meine Fragen 2 und 4 konnte ich dank Deiner Hilfe klären. Leider klappt die Änderung bei Frage 1, demStand des Überlegers nicht, obwohl ich denke, dass ich die Änderungen korrekt ausgeführt habe. Kannst Du da noch mal schauen?

Noch eine Frage. Kann man das Menu auf mobilen Geräten auch in "Hamburgerform" anzeigen lassen?

Vielen Dank

[lck]

Leider klappt die Änderung bei Frage 1, demStand des Überlegers nicht, obwohl ich denke, dass ich die Änderungen korrekt ausgeführt habe. Kannst Du da noch mal schauen?

In der template.htm hast du den Bereich "Head Navigation" nicht in den Originalzustand versetzt wie im meinem ersten Post weiter oben bereits beschrieben, ist immer noch auskommentiert (BTW: und das auch noch unvollständig und die Pluginaufrufe nicht richtig auskommentiert).

Code: Select all

<!-- ************************* Head Navigation ************************* -->
	<!-- <div id="tpllck_head" class="tpllck_head">
		<div class="tpllck_headnav">
		...

Mach das mal und dann sehen wir weiter .

[Eliquas]

Hallo Ick.

Danke! So klappt es. Eine Frage noch: Ist es möglich, den Text, der nun unterhalb der Buttonzeile steht undso nicht sofort sichbar ist, nach oben zu verschieben, dass er oberhalb der Buttonleiste steht? Dazu müsste allerdings auch der Sitename höher rutschen.

Auf meinem Handy wird das Bild mit dem Sitenamen nur im oberen Viertel angezeigt. Darunter ist über den Rest der Seite meine Startseite zu sehen. Drehe ich das Handy in Querformat, erscheinen die Buttons und "decken" den Text zu. Geht das auch anders?

Danke für Deine Tipps.

[lck]

Danke! So klappt es. Eine Frage noch: Ist es möglich, den Text, der nun unterhalb der Buttonzeile steht undso nicht sofort sichbar ist, nach oben zu verschieben, dass er oberhalb der Buttonleiste steht? Dazu müsste allerdings auch der Sitename höher rutschen.

Auf meinem Handy wird das Bild mit dem Sitenamen nur im oberen Viertel angezeigt. Darunter ist über den Rest der Seite meine Startseite zu sehen. Drehe ich das Handy in Querformat, erscheinen die Buttons und "decken" den Text zu. Geht das auch anders?

Siehe dazu meine Antwort von hier.

[Eliquas]

Vielen Dank fürDeine Hilfe.

Nur Eines noch: Bei Deiner Vorschau im Netz steht der Sitename im obeen Drittel und die Menueleiste in der Höhe in der Mitte der Seite.

Bei mir ist Beides nach unten "gerutscht" und "klebt" am unteren Bildrand. Wo muss ich noch dran dehen, mat der Stand so wird, wie bei Deiner Vorlage?

[lck]

Bei mir ist Beides nach unten "gerutscht" und "klebt" am unteren Bildrand. Wo muss ich noch dran dehen, mat der Stand so wird, wie bei Deiner Vorlage?

Bei dir ist der div-Block <div id="tpllck_header_box">...</div> ausserhalb des umschließenden <div id="tpllck_head" class="tpllck_head">...</div>.
Prüfe mal folgenden Code in der template.htm, so sollte das aussehen:

Code: Select all

<!-- ************************* Head Navigation ************************* -->
	<div id="tpllck_head" class="tpllck_head">
		<div class="tpllck_headnav">
			<?php echo searchbox();?>
			<p>
			<?php echo mailformlink();?> &nbsp;
			<span class="tpllck_sitemap"><?php echo sitemaplink();?> &nbsp;</span>
			<?php echo printlink();?> &nbsp;
			<?php echo languagemenu();?>
			</p>
			<div style="clear:both"></div>
		</div>
		
		<!-- ************************* Sitename ************************* -->	
		<div id="tpllck_header_box">
			<div class="tpllck_header">
				<h1><?php echo sitename();?></h1>
			</div>
		</div>
	</div>	

[Eliquas]

WOW! Das war der Fehler. Es waren zwei <div>-Tags eingetragen. Nach dem Löschen wardie Seite so, wie gewünscht. Kann mir zwar nicht erklären, woher die kommen. Ich hatte extra, um alle meine Fehler auszuschließen, noch einmal das Template aus dem Originaldownload neu installiert.

Aber jetzt ist alles schön.

Vielen Dank für Deine Geduld mit meinen vielen Fragen und Deiner netten Hilfe!