NAVIGATION
This shows you the differences between two versions of the page.
deutsch:phpwcms-system:artikel:scripte:cp-tabs [2011/03/23 14:53] Knut Heermann (flip-flop) |
deutsch:phpwcms-system:artikel:scripte:cp-tabs [2018/06/03 18:08] (current) |
||
---|---|---|---|
Line 6: | Line 6: | ||
Seit der Version r409 ist es möglich ContentParts für das FE zu gruppieren. Z.B. können mit dieser Funktion CPs in Tab´s gefasst werden. | Seit der Version r409 ist es möglich ContentParts für das FE zu gruppieren. Z.B. können mit dieser Funktion CPs in Tab´s gefasst werden. | ||
- | Hier am Beispiel der einfachen MGFX Tabs für MooTools gezeigt. | + | Hier am Beispiel der einfachen [[http://mootools.net/forge/p/mgfx_tabs|MGFX.Tabs]] //(mit fester Höhe)// für MooTools gezeigt. |
\\ | \\ | ||
Line 92: | Line 92: | ||
**4.** Im Gebrauch: | **4.** Im Gebrauch: | ||
- | * Erstelle mehrere CPs unterhalb eines Artikel mit dem selben Abschnitt: [1] und unterschiedlichen Register: [Tab-Name] | + | * Erstelle mehrere CPs unterhalb eines Artikel mit dem selben **Abschnitt: [1]** und unterschiedlichen **Register: [Tab-Name]** |
* Sichern und das Ergebnis im FE ansehen :-) | * Sichern und das Ergebnis im FE ansehen :-) | ||
Line 271: | Line 271: | ||
==== PHP ==== | ==== PHP ==== | ||
- | Dieses kleine Script ist notwendig um den vom CMS autom. generierten Quelltext an die Erfordernisse des hier verwendeten TAB-Scripts anzupassen. In erster Linie wird jede Registerkarte um die Klasse ".tab-it" erweitert. Dazu kommt noch der alle Registerkarten umschließende Container %%<div class="tab-regcard"> ... </div>%%. \\ | + | Dieses kleine Script ist notwendig um den vom CMS autom. generierten Quelltext an die Erfordernisse des hier verwendeten TAB-Scripts anzupassen. In erster Linie wird jede Registerkarte um die Klasse "**.tab-it**" erweitert. Dazu kommt noch der alle Registerkarten umschließende Container **%%<div class="tab-regcard"> ... </div>%%**. \\ |
Zudem wird das JS in den HEAD-Bereich geladen. | Zudem wird das JS in den HEAD-Bereich geladen. | ||
- | **Options** | + | **Optionen** für das JavaScript Version 1.3.0 //(im PHP-Script einstellbar)//: |
- | Version 1.3.0 | + | |
* **slideInterval:** (int) Time in milliseconds to remain on each slide. Default: 5 seconds. | * **slideInterval:** (int) Time in milliseconds to remain on each slide. Default: 5 seconds. | ||
Line 286: | Line 285: | ||
\\ | \\ | ||
- | **Datei:** template/inc_script/frontend_render/mootools/cp_register_tabs.php | + | **Datei:** template/inc_script/frontend_render/cp_register_tabs.php |
Line 344: | Line 343: | ||
// Insert the class tab-regcard between last </ul> and first <li> | // Insert the class tab-regcard between last </ul> and first <li> | ||
$content["all"] = preg_replace('/\<ul class="tab-navigation"\>(.*?)\<\/ul\>/s','<ul class="tab-navigation">$1</ul>'.LF.'<div class="tab-regcard">', $content["all"]); | $content["all"] = preg_replace('/\<ul class="tab-navigation"\>(.*?)\<\/ul\>/s','<ul class="tab-navigation">$1</ul>'.LF.'<div class="tab-regcard">', $content["all"]); | ||
- | // cliose the the inserted class tab-regcard | + | // close the the inserted class tab-regcard behind the last </li> |
$content["all"] = str_replace('<div class="tab-container-clear"></div>','</div>'.LF.'<div class="tab-container-clear"></div>',$content["all"]); | $content["all"] = str_replace('<div class="tab-container-clear"></div>','</div>'.LF.'<div class="tab-container-clear"></div>',$content["all"]); | ||
Line 378: | Line 377: | ||
- | Der Aufruf. Das erste Argument ist die Registerkarte, das zweite Argument ist die Registerkarte. Eine drittes optionales Argument ist ein Satz von Optionen der die Standardwerte überschreibt. | + | Der Aufruf des J-Scripts.\\ |
+ | - Das erste Argument ist der Registerreiter, das zweite Argument ist die Registerkarte. Eine drittes optionales Argument ist ein Satz von Optionen der die Standardwerte überschreibt //(siehe PHP-Script)//. | ||
##%% var tabs = new MGFX.Tabs('#tabs li a', '#home .feature'); %%## | ##%% var tabs = new MGFX.Tabs('#tabs li a', '#home .feature'); %%## | ||
Line 388: | Line 388: | ||
==== CMS generiertes HTML ==== | ==== CMS generiertes HTML ==== | ||
- | Mit der Initialisierung: ##%% var tabs = new MGFX.Tabs('.tab-it','.tab-content'); %%## //(siehe PHP-Script)// | + | Mit der Initialisierung: ##%% var tabs = new MGFX.Tabs('.tab-it','.tab-content');%%## //(siehe PHP-Script)// |