Page 1 of 1

Wie funktioniert onepage Plugin?

Posted: Thu Mar 29, 2018 9:34 am
by Tata
Ich versuche schon lange zu verstehen, wie eigentlich onepage Plugin funktioniert. Es geht darum, dass ich habe nicht geschafft korrekte Templatestrukture und Stylesheet erstellen. Logisch ist mir folgendes:

Code: Select all

...
<main>
	<div class="outer">	// Konteiner mit width: 100%;
		<div="inner"> 	// Konteiner mit width: 60rem; margin: auto; min-height: 100vh
			<?php echo onepage_content();?>
		</div>
	</div>
</main>
...
und dazu etwa im Sinn

Code: Select all

.main{}
.outer{}
.inner{}
.outer:nth-child(odd){}
.outer:nth-child(even){}
Da möchte ich verschiedene Hintergründe für die Seiten nutzen so, dass sie 100% breite nutzen. Wie sollte nun der Code im Template und Stylesheet laufen?

Re: Wie funktioniert onepage Plugin?

Posted: Thu Mar 29, 2018 10:46 am
by frase
Ausgehend vom Origanl-Plugin (unveränderte Konfiguration).

Template:

Code: Select all

<main>
    <?php echo onepage_content();?>
</main>
CSS:

Code: Select all

.onepage_page_inner {			/* Das ist der Container für den Inhalt */
	max-width: 980px;
	margin: 0 auto;
}
.onepage_page:nth-child(odd){		/* Hintergrund 1 */
	background: #f6f6f6;
}
.onepage_page:nth-child(even){		/* Hintergrund 2 */
	background: #f9f9f9;
}
Ergibt den Quellcode auf der gerenderten Seite:

Code: Select all

<main>						<!-- Haupt-Container 100% breit -->
    <div id="Start" class="onepage_page">	<!-- 1. Onepage-Seite, wenn nicht anders definiert 100% breit mit Hintergrund 1 -->
        <div class="onepage_page_inner">	<!-- Inhalts-Container 980px breit -->
            <!--XH_ml1:Start-->
            <h1>Start</h1>			<!-- 1. Inhalt -->
            <p>Congratulations on successfully installing ... </p>
        </div>
    </div>
    <div id="Content" class="onepage_page">	<!-- 2. Onepage-Seite mit Hintergrund 2 -->
        <div class="onepage_page_inner">
            <!--XH_ml1:Content-->
            <h1>Content</h1>			<!-- 2. Inhalt -->
            <p>This page demonstrates some standard content ... </p>
        </div>
    </div>
    ...
<main>

Re: Wie funktioniert onepage Plugin?

Posted: Thu Mar 29, 2018 10:53 am
by Tata
SUPER, Frank! Danke. Jetzt habe ich es verstanden. Ich meinte, dass die Klasse muss auch im Template definiert sein. So irgendwie k;nnte es auch in der Hilfedatei erklärt werden.