Alpha-Kristall: HTML Code durch einen kleinen Code ersetzen?

Hallo liebe Forengemeinde,

ich komme gleich zu meinem Problem.
Ist es möglich, einen HTML Code durch einen kleineren Code zu ersetzen?
So, das man z.B. statt

<p align="center">Willkommen auf der Seite Test.</p>

nur

[Willkommen]

etc. schreiben muss?
Ich meine das man beim programmieren einer Seite ein kleinen Code eingibt, der dann durch den HTML Code ersetzt wird.

Wäre ziemlich hilfreich, wenn so etwas gehen würde.

Danke schonmal im Vorraus für Antworten!

  1. Ist es möglich, einen HTML Code durch einen kleineren Code zu ersetzen?
    So, das man z.B. statt
    <p align="center">Willkommen auf der Seite Test.</p>
    nur
    [Willkommen]
    etc. schreiben muss?
    Ich meine das man beim programmieren einer Seite ein kleinen Code eingibt, der dann durch den HTML Code ersetzt wird.

    Ja, im Prinzip geht das. Am Ehesten bieten sich dabei serverseitige Techniken an ggf. sog. "Templates" für ContentManagementSysteme.
    Grundsätzlich darfst du dir das so vorstellen, dass du deine Seite schreibst, in der du solche Platzhalter wie [Willkommen] einsetzt. Wenn der Benutzer nun die Seite aufruft schaut der Server nochmal drüber ob solche Platzhalter drin stehen und führt eine Art "suchen und ersetzen" darauf aus. Ersetzt die entsprechenden Platzhalter und liefert das Ergebnis an den Browser aus.

    Ähnliches ist aber auch mit JavaScript oder lokal in deinem Editor denkbar.

    Die Gegenfrage, die man stellen muss ist: Was bezweckst du damit?
    Also geht es dir dabei nur darum den Schreibaufwand zu reduzieren oder möchtest du die Platzhalter möglicherweise später auch durch andere Texte ersetzen können oder sollen sie sich dynamisch ändern lassen oder...
    Naja, wozu möchtest du das?

    Falls du das weißt: Stehen dir serverseitige Sprachen zur Verfügung und welche?

    --
    sh:( fo:| ch:? rl:( br:& n4:& ie:{ mo:} va:) de:µ_de:] zu:) fl:( ss:| ls:[ js:(
    1. Ja, im Prinzip geht das. Am Ehesten bieten sich dabei serverseitige Techniken an ggf. sog. "Templates" für ContentManagementSysteme.
      Grundsätzlich darfst du dir das so vorstellen, dass du deine Seite schreibst, in der du solche Platzhalter wie [Willkommen] einsetzt. Wenn der Benutzer nun die Seite aufruft schaut der Server nochmal drüber ob solche Platzhalter drin stehen und führt eine Art "suchen und ersetzen" darauf aus. Ersetzt die entsprechenden Platzhalter und liefert das Ergebnis an den Browser aus.

      Ähnliches ist aber auch mit JavaScript oder lokal in deinem Editor denkbar.

      Die Gegenfrage, die man stellen muss ist: Was bezweckst du damit?
      Also geht es dir dabei nur darum den Schreibaufwand zu reduzieren oder möchtest du die Platzhalter möglicherweise später auch durch andere Texte ersetzen können oder sollen sie sich dynamisch ändern lassen oder...
      Naja, wozu möchtest du das?

      Falls du das weißt: Stehen dir serverseitige Sprachen zur Verfügung und welche?

      Danke für die schnelle Antwort =)
      Also, die serverseitgen Sprachen sind MySQL5-Datenbank, und PHP 5.2, falls du diese meinst.
      Damit bezwecke ich, dass dann die Seite im Editor um einiges übersichtlicher wird, so muss man sich nicht durch den ganzen Code kämpfen, wenn man z.B. eine News schreibt.

      Da ich leider absolut gar keine Ahnung habe, wie das funktionieren soll, kannst du mir das bitte erklären? Wäre sehr dankbar.

      1. Hi!

        Damit bezwecke ich, dass dann die Seite im Editor um einiges übersichtlicher wird, so muss man sich nicht durch den ganzen Code kämpfen, wenn man z.B. eine News schreibt.

        Eine Vereinfachung auf der einen Seite bringt oftmals auf der anderen Seite eine Erhöhung der Komplexität mit sich. Gerade in deinem Fall ist das so, denn die Vereinfachung kann nicht generell angewendet werden, sondern muss für den Browser wieder nach HTML aufgedröselt werden. Die Komplexität und Fehleranfälligkeit steckt also in diesem Aufdröselungsteil. Und je mehr Features du in deine eigenen Syntax einbaust, je flexibler du damit am Ende Ergebnisse erzeugen kannst, desto umfangreicher und komplexer wird dieser Teil.

        Solche "Vereinfachungs"systeme existieren bereits. Ein sehr prominentes Beispiel dürfte die Wiki-Syntax sein (egal wie sie nun in den eizelnen Systemem konkret aussieht). Auch CMSe bringen mitunter solche eigenen Syntaxen mit. Wenn es dir einfach nur um das Veröffentlichen und nicht um die Technik dahinter geht, kannst du dir also auch ein fertiges System suchen, das deine Wünsche zu erfüllen verspricht.

        Lo!

  2. Moin!

    Hallo liebe Forengemeinde,

    ich komme gleich zu meinem Problem.
    Ist es möglich, einen HTML Code durch einen kleineren Code zu ersetzen?
    So, das man z.B. statt

    <p align="center">Willkommen auf der Seite Test.</p>

    nur

    [Willkommen]

    etc. schreiben muss?
    Ich meine das man beim programmieren einer Seite ein kleinen Code eingibt, der dann durch den HTML Code ersetzt wird.

    Wäre ziemlich hilfreich, wenn so etwas gehen würde.

    Es gibt diverse alternative Auszeichnungsmethoden für Text, die am Ende wieder in HTML gewandelt werden können.

    BBCode ist ein Vertreter davon, Textile wäre ein anderer.

    In BBCode sind die HTML-Winkel alle irgendwie durch eckige Klammern ersetzt - das bringt dir also nicht so viel.

    Textile geht etwas subtiler vor, da sind Textblöcke automatisch erstmal ein P, und werden durch eine Leerzeile getrennt. Besondere Dinge wie Überschriften, Fettschrift o.ä. werden durch relativ unaufwendig einzugebende Zeichen realisiert.

    Dein Textabsatz oben, zentriert, wäre damit:

    =. Willkommen auf der Seite Test

    http://de.wikipedia.org/wiki/Textile enthält Links zur Originaldoku von Textile, und zu anderen derartigen Systemen. Vermutlich ist was für dich dabei.

    - Sven Rautenberg

    1. Moin!

      Es gibt diverse alternative Auszeichnungsmethoden für Text, die am Ende wieder in HTML gewandelt werden können.

      BBCode ist ein Vertreter davon, Textile wäre ein anderer.

      In BBCode sind die HTML-Winkel alle irgendwie durch eckige Klammern ersetzt - das bringt dir also nicht so viel.

      Textile geht etwas subtiler vor, da sind Textblöcke automatisch erstmal ein P, und werden durch eine Leerzeile getrennt. Besondere Dinge wie Überschriften, Fettschrift o.ä. werden durch relativ unaufwendig einzugebende Zeichen realisiert.

      Dein Textabsatz oben, zentriert, wäre damit:

      =. Willkommen auf der Seite Test

      http://de.wikipedia.org/wiki/Textile enthält Links zur Originaldoku von Textile, und zu anderen derartigen Systemen. Vermutlich ist was für dich dabei.

      • Sven Rautenberg

      Nee, das ist es nicht.
      Ich möchte selber Codes definieren, die dann in HTMl umgewandelt werden.
      Denn ich brauche keine Codes für ein, oder zwei Zeilen, sondern insgesamt für über 150 Zeilen.
      Da wäre natürlich ein Code Schnipsel der ein Wort in 150 Zeilen umwandelt hilfreich, nicht?
      Ich hoffe du verstehst was ich meine.
      Trotzdem danke für die Antwort.

  3. @@Alpha-Kristall:

    nuqneH

    Ich meine das man beim programmieren einer Seite ein kleinen Code eingibt, der dann durch den HTML Code ersetzt wird.

    Wenn du PHP verwendest, könntest du alle derartigen Stings in eine Datei strings.php packen

    <?php

    $willkommen = '<p id="willkommen">Willkommen auf der Seite Test.</p>';  
    $tschuess   = '<p id="tschuess">Und tschuess!</p>';

    und diese einbinden:

    <? [code lang=php]include_onde 'strings.php'; ?>

      <body>
        <?php echo $willkommen; ?>
        <p>Lorem ipsum dolor sit amet.</p>
        ︙
        <?php echo $tschuess; ?>
      </body>
    </html>[/code]

    'align="center"' hat im MArkup nichts zu suchen, alle Dartstellungsangaben gehören ins Stylesheet:

    #willkommen { text-align: center }

    Qapla'

    --
    Gut sein ist edel. Andere lehren, gut zu sein, ist noch edler. Und einfacher.
    (Mark Twain)
    1. Das sieht schon eher nach dem aus, was ich meinte.
      Scheint aber kompliziert zu sein.

      <?php
       $willkommen = '<p id="willkommen">Willkommen auf der Seite Test.</p>';
       $tschuess   = '<p id="tschuess">Und tschuess!</p>';
       >

      Und wenn ich zwei Zeilen (bzw. Dinge) einbinden will?
      Geht das dann alá

      <?php
       $Anfang = '<p>Hallo!</p>';
                 '<img src=Bildadresse>';
       >

      Was mir auch gerade einfällt: Ist die id bei p notwendig?

      Und beim eigentlichen Dokument kann ich dann HTML anwenden, oder? Ich muss nur am Anfang das PHP-Dokument einbinden, richtig?

      1. @@Alpha-Kristall:

        nuqneH

        Das sieht schon eher nach dem aus, was ich meinte.
        Scheint aber kompliziert zu sein.

        Nicht wirklich.

        Und wenn ich zwei Zeilen (bzw. Dinge) einbinden will?
        Geht das dann alá

        <?php
        $Anfang = '<p>Hallo!</p>';
                   '<img src=Bildadresse>';

        Nein, das muss ein String sein:

        <?php

        $Anfang = '<p>Hallo!</p>  
                    <img src=Bildadresse>';
        

        Was mir auch gerade einfällt: Ist die id bei p notwendig?

        Kommt drauf an. Ich hatte sie vorgesehen, damit du dieses spezielle 'p'-Element im Stylesheet selektieren kannst und die Zentrierung nur für den Willkommen-Text gilt, nicht für alle Textabsätze.

        Und beim eigentlichen Dokument kann ich dann HTML anwenden, oder? Ich muss nur am Anfang das PHP-Dokument einbinden, richtig?

        ?? Was meinst du damit?

        Qapla'

        --
        Gut sein ist edel. Andere lehren, gut zu sein, ist noch edler. Und einfacher.
        (Mark Twain)
        1. Danke für die Antwort.

          <?php

          $Anfang = '<p>Hallo!</p>
                      <img src=Bildadresse>';

          Achso. Scheint dann ja gar nicht so kompliziert zu sein.

          Kommt drauf an. Ich hatte sie vorgesehen, damit du dieses spezielle 'p'-Element im Stylesheet selektieren kannst und die Zentrierung nur für den Willkommen-Text gilt, nicht für alle Textabsätze.

          Okay.

          ?? Was meinst du damit?

          Eben am Anfang

          <? include_onde 'strings.php'; ?>

          einfügen, und an den gewünschten Stellen

          <?php echo $Irgendwas; ?>

          einfügen. Sonst kann ich in HTML schreiben, oder?
          Ach ja, und noch eine Frage: Wie kann man auf der Tastatur diese Drei Punkte einfügen. Oder sind die überhaupt notwendig?
          Danke im Vorraus für Antworten!

          1. 'ǝɯɐu$ ıɥ

            Eben am Anfang

            <? include_onde 'strings.php'; ?>

            <? include_once 'strings.php'; ?> wäre besser :-)

            einfügen, und an den gewünschten Stellen

            <?php echo $Irgendwas; ?>

            einfügen. Sonst kann ich in HTML schreiben, oder?

            Ja, du kannst PHP und HTML mischen.

            Ach ja, und noch eine Frage: Wie kann man auf der Tastatur diese Drei Punkte einfügen. Oder sind die überhaupt notwendig?

            Welche Punkte?

            ssnɹƃ
            ʍopɐɥs

            --
            I like children. If they're properly cooked.
            - W.C. Fields
            1. Hey, coole Begrüßung^^

              Auf jeden Fall danke für die zwei Antworten.
              Die drei Punkte findest du hier:

              http://forum.de.selfhtml.org/?t=199445&m=1342014

              Aber ich denke, die sind nicht notwendig.

              Vielen Dank euch allen, jetzt weiß ich endlich, wie es funktioniert, und das vereinfacht es mir um ein Vielfaches.

              1. 'ǝɯɐu$ ıɥ

                Hey, coole Begrüßung^^

                *g*

                Die drei Punkte findest du hier:

                http://forum.de.selfhtml.org/?t=199445&m=1342014

                Aber ich denke, die sind nicht notwendig.

                Ja die Auslassungszeichen kannst du auslassen ;-))

                ssnɹƃ
                ʍopɐɥs

                --
                I like children. If they're properly cooked.
                - W.C. Fields
  4. Moin!

    So, das man z.B. statt

    <p align="center">Willkommen auf der Seite Test.</p>

    nur

    [Willkommen]

    etc. schreiben muss?

    Derlei ist eigentlich gang und gebe. Stichwort Templates.

    Im einfachsten Fall ist ein Template eine HTML-Datei mit Platzhaltern, die können auch aussehen wie bei Dir: (./templates/template.html)

      
    <html>  
    <head>  
    [HtmlTitle]  
    </head>  
    <body>  
    [Title]  
    [Inhalt]  
    [Menue]  
    </body>  
    </html>
    

    Diese kann z.B. mit PHP eingelesen werden, danach werden die Platzhalter ersetzt, dabei lassen sich auch eigene Funktionen verwenden:

    <?php  
      
    /* Daten: */  
    $arDocument['HtmlTitle']='Tolle Seite';  
    $arDocument['Title'] = toTag('h1, '', 'Tolle Seite';  
    $arDocument['Inhalt']= toTag('p', 'style="text-align:center"', 'Willkommen auf der tollen Seite!');  
    $arDocument['Menue']=  toTag('a', 'href="/"', 'Startseite');  
      
    /* Einlesen des Templates: */  
    $strOutout=file_get_contents('./templates/template.html');  
      
    /* Ersetzen der Platzhalter und Ausgabe: */  
    print replacePlaceholders($strOutout, $arDocument);  
      
    /* The End: */  
    exit;  
      
    /*  
         Eigene Funktionen:  
    */  
      
    function replacePlaceholders($str, $ar) {  
         /*  
         # Funktion: replacePlaceholders  
         # $str: Erwartet als String HTML-Template mit Patzhaltern in der Form [Document:BEZEICHNER]  
         # $ar:  Erwartet ein Hash mit dem BEZEICHNER als Key einem String als Wert  
         */  
      
         $arKeys=keys($ar);  
         $arSearch=array();  
         $arReplace=array();  
         foreach ($arKeys as $key) {  
             $arSearch[]  = '['.$key.']';  
             $arReplace[] = $arDocument[$key];  
         }  
         return str_replace($arSearch, $arReplace, $str);  
    }  
      
      
    function toTag($tag, $extra, $str) {  
         /*  
         # Funktion: toTag  
         # $tag:   Erwartet: Name des HTML-Tags: h1, a, ...  
         # $extra: Erwartet: leer oder String wie z.B. 'class="Klasse"'  oder 'style="display:block"'  
         # $str:   Erwartet: als String den Text, der vom Tag umschlossen werden soll  
         */  
         return '<'.$tag.' '.$extra.'>'.$str.'<'.$tag.'>';  
    }  
    ?>
    

    Wenn Du jetzt noch eine Lösung findest woher die Daten für $arDocument kommen (Datenbank, Files) und wie diese auf den Server kommen, dann kannst Du ein kleines CMS "stricken". Nur erfordert das einiges Lernen.

    MFFG (Mit freundlich- friedfertigem Grinsen)

    fastix

    1. Hi!

      $arDocument['Title'] = toTag('h1, '', 'Tolle Seite');
      $arDocument['Inhalt']= toTag('p', 'style="text-align:center"', 'Willkommen auf der tollen Seite!');
      $arDocument['Menue']=  toTag('a', 'href="/"', 'Startseite');

      Wenn ich ein solche System aufsetzen wollte, würde ich hier einiges anders machen.

      Die Reihenfolge der Parameter 2 und 3 sind ausgetauscht einfacher zu handhaben, denn Attribute sind im HTML-Start-Tag oftmals optional. Wenn man da also den Attribut-Parameter nach den Pflichtparametern (hier Elementname und Content) platziert und ihn mit einem Defaultwert im Funktionskopf als optional gestaltet, kann man sich den Leerstring in Fällen wie der ersten Zeile sparen.

      Ansonsten ist das Prinzip der Attributhinzufügung einfach. Zu einfach für meinen Geschmack, denn eigentlich will man sich ja das Notieren von HTML sparen und konsequenterweise dann auch, die Notwendigkeit der korrekten Formulierung der Atttribute - inklusive der Berücksichtigung des Kontextwechsels beim Einfügen von Werten zuzüglich der von der PHP-Syntax geforderten Notationsweise von Anführungs- und Steuerzeichen.

      Deshalb würde ich statt dem fertig ausformulierten Attribut ein Array übergeben, mit den Attributnamen als Key. Die Attributwerte sollten in Rohform übergeben werden, ansonsten ist an der Stelle nur die PHP-Syntax zu beachten. Die Funktion toTag() setzt selbständig aus dem Array den Attributstring zusammen - bei Beachtung des Kontextwechsels, also mit Anwendung von htmlspecialchars().

      Unabhängig von der Frage ob CSS in style-Attributen sinnvoll ist oder nicht, müsste man für das style-Attribut konsequenterweise auch eine Trennung nach CSS-Eigenschaftsnamen und -Wert vornehmen. style bekommt im oben genannten Array eine Sonderbehandlung. Wenn (inkonsequenterweise) ein String übergeben wird, kommt der so in die Ausgabe, ein Array mit Eigenschaftennamen als Keys wird erst noch zusammengebaut.

      Für den Inhalt (ex 3., neu 2. Paramter) kann neben reinem Text, der von der Funktion kontextgerecht zu behandeln wäre, auch HTML-Code notwendig sein, der nicht mehr behandelt werden darf (und andererseits dessen Inhalte bereits behandelt sein müssen). Um das zu unterschieden bedarf es eines Kriteriums. Der Datentyp ist beides Mal String, ist also ungeeignet. Ein weiterer Parameter $contentIsHtml wäre eine einfache Lösung, aber keine besonders hübsche. Hier kommt man dann langsam an den Punkt, an dem OOP sinnvoll wird, denn da kann man sich beliebig neue Typen durch Definieren von Klassen schaffen und auf die man Parameterwerte dann prüfen kann.

      Zu guter Letzt würde ich neben der allgemeinen toTag()-Funktion noch spezialisierte Funktionen für die am meisten verwendeten Elemente schaffen, beispielsweise toPTag(), toATag(), toImgTag() und so weiter, bei denen man sich die Übergabe des Elementnamens spart, stattdessen aber oft verwendete Attribute als eigenständige Parameter vorsieht, damit man nicht immer selbst das Attribut-Array erstellen muss.

      Und dabei (bei img) fällt mir ein, dass toTag() derzeit leere Elemente nicht berücksichtigt. Da würde sich anbieten, den Content-Parameter ebenfalls optional zu machen, ihn mit null als Defaultwert zu belegen und dieses null auswertend Elemente mit schließenden Tag zu erzeugen <img.../>. Für leere Elemente mit Start- und Endtag (<p></p>) fällt mir zwar grad kein Anwendungsfall ein, der nicht stattdessen mit CSS zu lösen ginge, aber hier müsste man dann explizit einen Leerstring übergeben. (Hmm, Platzhalter für Javascript-Spielereien wäre ein Fall.)

      Lo!