Page 1 of 2
How to use style for page content?
Posted: Sat Jan 21, 2017 11:54 am
by Tata
Scenario:
I have written a content of a page. It has a couple of <P>s and <DIV>s.
Now I want the whole written content pack in one DIV with a special class - to give a background, or to change the width, position, font, font-color etc.
What happens? Each <P>, <DIV> takes the class.
Is there a way - other than make this only manually in source code - to do it only by highliting the content and assign a class to the highlighted content?
I wnat to use it with onepage plugin so that each page would have the same height and an individual background scrolling always the whole screen.
With a simple HTML template file (without cmsimple scripting) it works.
Code: Select all
<div class="content">
<div class="page-1">
CONTENT 1
</div>
<div class="page-2">
CONTENT 2
</div>
<div class="page-3">
CONTENT 3
</div>
<div class="page-4">
CONTENT 4
</div>
</div>
As a template it has only one DIV for content(); so the pages still need individual class "page-x" with the same height (e.g. 100vh)
Code: Select all
<div class="content">
<?php echo onepage_content();?>
</div>
so I need to pack each page into a DIV.
Re: How to use style for oage content?
Posted: Sat Jan 21, 2017 12:06 pm
by frase
Schau dir Ludwigs OnePage-Templates an.
Zum Beispiel:
http://www.cmsimplexh.momadu.de/demos/op_ihaveadream/
Die DIVs werden unterschiedlich im CSS gestyled. Z.B.
Code: Select all
.onepage_page:nth-child(2n) {
background-color: #f4f4f4;
}
Das könnte dir weiterhelfen.
:nth-child(2n) musst du anpassen.
Re: How to use style for oage content?
Posted: Sat Jan 21, 2017 12:25 pm
by Tata
Klar, danke.
Re: How to use style for page content?
Posted: Fri Jan 27, 2017 3:53 pm
by Tata
Ich habe es angeschaut. Das ist eine Möglichkeit. Die lösst aber nicht, was ich brauche. Es geht nähmlich nicht um Formatierung einer Seite, sonder nur einer Teil der Seite. Wie oben beschrieben.
Code: Select all
<h1>Title</h1>
<p>blablabla</p>
<div class="class1">blablabla blablabla</div>
<h4>blablablabla</h4>
möchte ich als
Code: Select all
<h1>Title</h1>
<div class="class2">
<p>blablabla</p>
<div class="class1">blablabla blablabla</div>
</div>
<h4>blablablabla</h4>
Re: How to use style for page content?
Posted: Fri Jan 27, 2017 4:30 pm
by frase
Tata wrote:Es geht nähmlich nicht um Formatierung einer Seite, sonder nur einer Teil der Seite. Wie oben beschrieben.
Genau.
Möglichkeit 1:
Jedem div "direkt" Regeln geben. Das ist
nicht dynamisch.
Code: Select all
div.class1 { background-color: red; }
div.class2 { background-color: blue; }
... usw.
Möglichkeit 2:
Hintergrundfarbe abwechselnd:
HTML
Code: Select all
<div class="content">
<div class="page">
CONTENT 1
</div>
<div class="page">
CONTENT 2
</div>
<div class="page">
CONTENT 3
</div>
<div class="page">
CONTENT 4
</div>
</div>
CSS
Code: Select all
div.page:nth-child(even) {background: #CCC}
div.page:nth-child(odd) {background: #FFF}
Möglichkeit 3:
mit HTML wie in 2:
CSS
Code: Select all
div.page:nth-child(1) {background: #CCC}
div.page:nth-child(2) {background: #999}
div.page:nth-child(3) {background: #333}
...
Re: How to use style for page content?
Posted: Fri Jan 27, 2017 4:41 pm
by cmb
Wenn ich die Anfrage richtig verstehe, dann geht es nicht um HTML und CSS, sondern um den WYSIWYG-Editor, wo es nicht möglich ist ein umliegendes <div> zu erzeugen und diesem eine CSS-Klasse zuzuweisen. Wenn ich mich richtig erinnere, dann ist das aber mit dem CKEditor möglich. Wie es beim TinyMCE 4 ist, weiß ich nicht, aber da würde es im Zweifel sinnvoll sein nachzuforschen – viel Zeit in den alten TinyMCE 3 würde zumindest ich lieber nicht stecken.
Re: How to use style for page content?
Posted: Fri Jan 27, 2017 4:47 pm
by frase
cmb wrote:... sondern um den WYSIWYG-Editor, wo es nicht möglich ist ein umliegendes <div> zu erzeugen und diesem eine CSS-Klasse zuzuweisen ...
Das geht auch im Tiny3.
In Deutsch: "Zusammenhängender Bereich" = DIV
Dem kann man beliebige (sinnvolle) Klassen geben.
Re: How to use style for page content?
Posted: Fri Jan 27, 2017 4:51 pm
by frase
@Christoph
Was muss ich tun, damit mein html-code im Forum auch als solcher gestyled wird?
Re: How to use style for page content?
Posted: Fri Jan 27, 2017 5:19 pm
by cmb
frase wrote:cmb wrote:... sondern um den WYSIWYG-Editor, wo es nicht möglich ist ein umliegendes <div> zu erzeugen und diesem eine CSS-Klasse zuzuweisen ...
Das geht auch im Tiny3.
In Deutsch: "Zusammenhängender Bereich" = DIV
Dem kann man beliebige (sinnvolle) Klassen geben.
Was ich meine ist, dass man ein zusätzliches <div> erstellt; wählt man "Zusammenhängender Bereich", dann wird aus einem <p> ein <div>, aber eben kein zusätzliches Element erzeugt. Beim CKEditor gibt (oder gab) es dafür einen eigenen Button.
frase wrote:Was muss ich tun, damit mein html-code im Forum auch als solcher gestyled wird?
Das geht mit [code=php]<html>[/code]:
Re: How to use style for page content?
Posted: Fri Jan 27, 2017 5:27 pm
by frase
cmb wrote:Das geht mit [code=php]<html>[/code]:
Danke!
