Themen

Eine Fortsetzung eines Artikels mit hilfe von JavaScript einblenden

Infos
1. Der Link erscheint nicht in einem <script> Tag was nicht HTML Konform ist.
2. ohne JavaScript ist der Text direct im anschluss ohne Lehrzeile und Link im <span> Tag
3. geht auch mit Bild für denn Link Weiter und Verstecken
4. Wenn Such Wort im Text dann Ausklappen

das als toggle.js ins Layouts Verzeichnis da wo auch die template.html liegt Kopieren

Code Auswählen Erweitern

function inhalttogglen(toggelid,showText,hideText) {
    var linkButton = "<a href="javascript:inhalttogglen('" + toggelid + "','" + showText + "','" + hideText + "');"><img src="" + showText + " alt="" id="" + toggelid + "_button" /></a>";
    var linkText = "<a href="javascript:inhalttogglen('" + toggelid + "','" + showText + "','" + hideText + "');" id="" + toggelid + "_button">" + showText + "</a>";
    var searchgefunden = false;
    if (window.location.search.search(/highlight.+/) != -1 && document.getElementById(toggelid + '_button') == undefined) {
        if (document.getElementById(toggelid).innerHTML.search(/class="highlight".+/) != -1) {
            var searchgefunden = true;
        }
    }
    if (document.getElementById(toggelid + '_link')) {
        document.getElementById(toggelid + '_link').innerHTML = linkText;
    }
    if (document.getElementById(toggelid + '_linkBild')) {
        document.getElementById(toggelid + '_linkBild').innerHTML = linkButton;
    }
    if (document.getElementById(toggelid).style.display == "none" || searchgefunden) {
        var shText = document.createTextNode(hideText);
        if (document.getElementById(toggelid + '_button').src) {
            document.getElementById(toggelid + '_button').src = hideText;
        } else {
            document.getElementById(toggelid + '_button').replaceChild(shText, document.getElementById(toggelid + '_button').firstChild);
        }
        document.getElementById(toggelid).style.display = "block";
    } else {
        var shText = document.createTextNode(showText);
        if (document.getElementById(toggelid + '_button').src) {
            document.getElementById(toggelid + '_button').src = showText;
        } else {
            document.getElementById(toggelid + '_button').replaceChild(shText, document.getElementById(toggelid + '_button').firstChild);
        }
        document.getElementById(toggelid).style.display = "none";
    }
}

Das als Benutzerdefinierte Syntaxelemte anlegen
Link als Text

Code Auswählen Erweitern

textverstecken = <span id="{DESCRIPTION}_link"></span><span id="{DESCRIPTION}">{VALUE}</span><script type="text/javascript" src="layouts/moziloCMS-nbsp~2009/toggle.js"></script><script type="text/javascript">window.onload = inhalttogglen('{DESCRIPTION}','TEXT_WEITER','TEXT_VERSTECKEN');</script>
oder Bild als Link

Code Auswählen Erweitern

textverstecken_bild = <span id="{DESCRIPTION}_linkBild"></span><span id="{DESCRIPTION}">{VALUE}</span><script type="text/javascript" src="layouts/moziloCMS-nbsp~2009/toggle.js"></script><script type="text/javascript">window.onload = inhalttogglen('{DESCRIPTION}','layouts/moziloCMS-nbsp~2009/grafiken/BILD_ZEIGEN','layouts/moziloCMS-nbsp~2009/grafiken/BILD_VERSTECKEN');</script>
beides auf einmal geht auch

Was noch angepast werden muss bei denn Benutzerdefinierten Syntaxelemten
textverstecken =
Die Beschrieftung für denn Link TEXT_WEITER und TEXT_VERSTECKEN

textverstecken_bild =
Der Pfad zum Bild als Beispiel layouts/moziloCMS-nbsp~2009/grafiken/BILD_ZEIGEN und
layouts/moziloCMS-nbsp~2009/grafiken/BILD_VERSTECKEN

Der Pfad zur toggle.js in textverstecken und textverstecken_bild
src="layouts/moziloCMS-nbsp~2009/toggle.js"

und das in einer Inhaltseite Anlegen

Code Auswählen Erweitern

Text der davor steht, Text der davor steht
[textverstecken=ID|HIER KANN ALLES REIN WAS MIT MOZILOCMS MÖGLICH IST]

Text der davor steht, Text der davor steht
[textverstecken_bild=ID|HIER KANN ALLES REIN WAS MIT MOZILOCMS MÖGLICH IST]
Die ID die vergeben wird muss einmalig sein.

aus SelfHtml:

Der Wert eines solchen Attributs muss mit einem Buchstaben A-Z oder a-z beginnen, und darf in der weiteren Zeichenkette ebenfalls nur Buchstaben A-Z und a-z, Ziffern 0-9, Bindestriche (-), Unterstriche (_), Doppelpunkte ( und Punkte (.) enthalten. Nicht erlaubt sind Sonderzeichen, Leerzeichen oder andere Interpunktionszeichen.

Alerdings nur im Fire... getestet Tester Wilkommen

Edit: 12.05.2009 Bei gefunden Such Wort wird aufgeklapt änderung betrieft nur toggle.js
Edit: 31.05.2009 aus SelfHtml

mfg. stefanbe

Das suchen in index.php

Code (php) Auswählen Erweitern


// Aktuelle Inhaltsseite als aktiven Menüpunkt anzeigen...
 und mit dem Austauschen

Code (php) Auswählen Erweitern


// Inhaltsseite mit Position "00" im Detailmenü versteken
if (substr($currentcontent,0,2) == "00")  continue;
// Aktuelle Inhaltsseite als aktiven Menüpunkt anzeigen...
 Beispiel:
00_Katogorie -> aktiv

00_Inhaltseite -> im Detailmenü versteckt im Contend aktiv

01_Inhaltseite -> ganz normal

00_Katogorie -> aktiv

01_Inhaltseite -> aktiv und im Contend

02_Inhaltseite -> ganz normal

mfg. stefanbe

[NUMMER]

In der Syntax.php das

Code (php) Auswählen Erweitern


elseif ($attribute == "tabelle") {
// Tabelleninhalt aufbauen
    $tablecontent = "";
    $j = 0;
    // Tabellenzeilen
    // preg_match_all("/<([^>]*)>/Um", $value, $tablelines);
    // preg_match_all("/(<|<<)([^>]*)(>|>>)/Um", $value, $tablelines);
    preg_match_all("/(<|<<)(.*)(>|>>)/Umsie", $value, $tablelines);
    foreach ($tablelines[0] as $tablematch) {
        // Kopfzeilen
        if (preg_match("/<<([^>]*)/Umsi", $tablematch)) {
        $linecontent = preg_replace('/|/', '</th><th class="contenttable">', $tablelines[2][$j]);
        $linecontent = preg_replace('/&#38;/', '&', $linecontent);
        $linecontent = preg_replace('/&lt;(.*)/', "$1", $linecontent);
        $tablecontent .= "<tr><th class="contenttable">$linecontent</th></tr>";
    }
    // normale Tabellenzeilen
    else {
        // CSS-Klasse immer im Wechsel
        $css = "contenttable1";
        if ($j%2 == 0)
        $css = "contenttable2";
        // Pipes durch TD-Wechsel ersetzen
        $linecontent = preg_replace('/|/', '</td><td class="'.$css.'">', $tablelines[2][$j]);
        $linecontent = preg_replace('/&#38;/', '&', $linecontent);
        $tablecontent .= "<tr><td class="$css">$linecontent</td></tr>";
        }
        $j++;
    }
$content = str_replace ("$match", "<table class="contenttable" summary="">$tablecontent</table>", $content);
}
 mit dem Ersetzen

Code (php) Auswählen Erweitern


elseif ($attribute == "tabelle" || substr($attribute,0,8) == "tabelle=") {
    // Tabelleninhalt aufbauen
    $tablecontent = "";
    $zelle_nr = 1;
    if(substr($attribute,0,8) == "tabelle=")
        $css_clase = substr($attribute,8,strlen($attribute)-8);
    else
        $css_clase = "contenttable";
    // Tabellenzeilen
    preg_match_all("/(<|<<)(.*)(>|>>)/Umsie", $value, $tablelines);
    foreach ($tablelines[2] as $tablematch) {
        if(strstr($tablematch,"<")) {
            $tablematch = str_replace("<","",$tablematch);
            $htmltag = "th";
        }
        else {
            $htmltag = "td";
        }
        $tablezelle = explode("|",$tablematch);
        $tablecontent .= "<tr>";
        foreach ($tablezelle as $zelle) {
            if($htmltag == "th")
                $css = $css_clase;
            else
                $css = $css_clase.$zelle_nr;
            $tablecontent .= "<".$htmltag." class="".$css."">$zelle</".$htmltag.">";
            $zelle_nr++;
        }
        $tablecontent .= "</tr>";
        $zelle_nr = 1;
    }
    $content = str_replace ("$match", "<table class="$css_clase" summary="">$tablecontent</table>", $content);
}
 
Für jede Spalte wird nun eine eigene Nummer erzeugt (contenttableNUMMER)
oder mit Eigener Klasse [tabelle=meinKlasse|.....] (meinKlasseNUMMER)

mfg. stefanbe

[Problem:]

Problem:
Legt man um bildlinks bzw. bildrechts einen Link...

Code Auswählen Erweitern

[link=[bildrechts|bild.jpg]|http://www.irgend.was]dann...

• ...meckert der HTML-Validator und
• ...funktioniert der Link im IE nicht.

Ursache:
bildlinks und bildrechts werden durch ein DIV dargestellt:



Ein DIV ist ein sogenanntes Blockelement. Links (<a>...</a>) dürfen aber keine Blockelemente enthalten (der IE verlinkt das auch gar nicht erst).

Lösung:
Wir machen aus den Blockelementen Inline-Elemente, denn die sind innerhalb von Links erlaubt

In Syntax.php ab Zeile 409 alles was Fett ist ändern
// ohne Untertitel
if ($subtitle == "") {
$content = str_replace ($match, "<span class="$cssclass"><img src="$imgsrc" alt="".$this->LANG->getLanguageValue1("alttext_image_1", $value)."" class="$cssclass" /></span>", $content);
}
// mit Untertitel
else {$content = str_replace ($match, "<span class="$cssclass"><img src="$imgsrc" alt="".$this->LANG->getLanguageValue1("alttext_image_1", $value)."" class="$cssclass" /><br><span class="imagesubtitle">$subtitle</span></span>", $content);
}

In style.css auch alles was Fett ist ändern
span.imagesubtitle
span.leftcontentimage
span.rightcontentimage

Link Beispiel:
[seite=[bildrechts=Test Untertitel|mozilo.jpg]|Kontakt]

mfg. stefanbe



Edit azett: Titel angepaßt und Einleitung ergänzt. Danke für den Hack, Stefan!

[Achtung]

Hallo ich Stell das mal hier rein ob das Richtig ist? 

Achtung das ist noch nicht alles getestet

Fix im Admin:
Katogorie Bearbeiten wenn die gleiche Position wird jetzt Umbenant.
und noch ein paar andere Sachen hab da zimlich rumgewühtet

Grösste änderung Links im Menue sowohl in Kategorien und Inhaltsseiten

das_kommt_nach_admin.zip
das_kommt_nach_mozilo.zip

Viel Spass beim Ausprobieren

mfg. stefanbe