Teil 3 einfaches Smarty-Template anlegen

home smarty

COBOL - Altsysteme warten und erweitern. Das umfassende Praxis-Handbuch   -  Dieses Buch richtet sich an erfahrene Entwickler objektorientierter Sprachen wie C++ oder Java. Es vermittelt die Funktionsweise der Programmiersprache COBOL, um die in zahlreichen Implementierungen auf unterschiedlichen Plattformen immer noch produktiv laufenden COBOL-Programme zu verstehen, zu warten und bei Bedarf mit zusätzlichen Funktionalitäten zu erweitern. Dafür bietet es Ihnen sowohl eine grundlegende Einführung in die Programmierung mit COBOL als auch eine thematisch gegliederte Referenz der Befehle mit praktischen Beispielen.

Wir sind Mitglied im Amazon.Partnernet und können mit Affiliate-Links den Betrieb der Webseite etwas unterstützen, für Sie als Leser ist das natürlich vollkommen kostenlos.

Legen Sie ein erstes sehr einfaches TPL Template für die Template-Engine Smarty an und lassen den Inhalt eines Artikels und Beitrags laden und rendern.

Teil 3 - des Template-Workshops in dem Sie ein erstes Template anlegen und Daten anzeigen lassen können - die erste Webseite zeigt sich.

index.php anlegen

Nachdem Sie die Template Engine Smarty heruntergeladen und installiert haben, wird es Zeit ein erstes Template zu erstellen. Legen Sie als erstes eine neue leere Datei mit dem Namen index.php in der root an, diese wird zukünftig als Einsprung für Ihre Damain dienen bzw. wird ausgeführt, um die Template Engine zu starten.

+-- radelle.de
   |
   +-- libs
   |
   +-- templates
   |      |
   |      artikel.tpl
   |
   +-- templates_c
   |
   index.php

Im Ordner templates legen Sie bitte eine Datei vorlage.tpl an. Diese Datei wird das HTML-Template aufnehmen das Smarty zur Laufzeit läd und befüllt.

index.php

Öffnen Sie die Datei index.php mit einem Editor Ihrer wahl und legen Sie die folgenden Programmzeilen an oder kopieren sie heraus:

01  <?php
02    require_once('libs/Smarty.class.php');
03    $smarty = new Smarty();
04
05    $smarty->assign('titel_tmpl',   'Titel der Webseite');
06    $smarty->assign('inhalt_tmpl',  'Der Beitragstext der Seite muss hier hin');
07    $smarty->assign('autor_tmpl',   'Oliver Lohse');
08    $smarty->assign('footer_tmpl',  'Impressum - Datenschutz - Copyright');
09  
10    $smarty->display('artikel.tpl');
11  ?>

Code

Zeile 02 läd die Smarty Engine in das Index-Script und ist pflicht, ohne läuft es nicht. In Zeile 03 erzeugen Sie eine Instance bzw. ein neues Smarty-Objekt das Sie fortan nutzen können um Ihre Templateoperation darauf ausführen zu können.

Zeile 05 erzeugen Sie einen Platzhalter mit dem Namen titel_tmpl, dem Sie den Inhalt Titel der Webseite zuweisen (dazu später mehr). Die darauffolgenden Zeilen machen genau das gleiche, lediglich mit anderen Variablen und anderen Inhalten.

Das Laden des Templates artikel.tpl erfolgt am Ende des Scripts in Zeile 10. Da Smarty das Verzeichnis templates als Default kennt, ist es nicht nötig ihm dies vorher zu deklarieren, Smarty sucht automatisch in diesem Verzeichnis nach dem angegebenen Template.

Am Beginn und am Ende des Scriptes befinden sich die öffnenden und schließenden PHP-Statements <?php ... ?> die dem Browser signalisieren, das es sich um PHP-Code handelt.

artikel.tpl

Die Magie des Templatings passiert in der Datei artikel.tpl die Sie zuvor dort leer angelegt haben und auf die Sie im index.php Script referenzieren. Öffnen Sie diese Datei und fügen die folgenden Zeilen ein:

01  <html>
02    <head>
03
04      <title> {$titel_tmpl} </title>
05
06    </head>
07
08    <body>
09            
10      <h1> {$titel_tmpl}  </h1>
11      <p>  {$autor_tmpl}  </p>
12      <p>  {$inhalt_tmpl} </p>
13      <p>  {$footer_tmpl} </p>
14
15    </body>
16  </html>

Code

Die Templatevariablen (rot) dürften Ihnen bereits aus der index.php Datei bekannt vorkommen, jetzt haben sie jedoch noch das typische Dollarzeichen vorangestellt, um als echte PHP-Variablen von Smarty interpretiert werden zu können. Führen Sie nun das Script aus indem Sie einfach Ihre Domain im Browser aufrufen z.B.: http://Radelle.de.

Der Browser zeigt Ihnen eine Webseite mit dem Inhalt aus der index.php an.

Zugegeben, interessantes Templating ist das noch nicht aber Sie haben eine rudimentäre HTML-Vorlage erzeugt welches von der Template Engine Smarty mit realen Werten zur Laufzeit geladen wird. Wenn der grundlegende Wirkmechanismus klar ist, dann können Sie sich daran setzen komplexe Templates und interessante CSS-Layouts zu kreieren.

Zwar schreibt das Smarty-Projekt die Extension TPL für seine Templates vor, ich würde jedoch TXT empfehlen. Durch die Änderung auf TXT kann Ihr Host-Editor die Dateien besser erkennen und ggf. zur Bearbeitung öffnen.


 28.01.2024    Kontakt@Oliver-Lohse.de    Template

JavaScript das umfassende Handbuch. JavaScript objektorientiert lernen und verstehen   -  Ein umfassender Einstieg in JavaScript, viele praktische Beispiele und eine Darstellung auch professioneller Techniken - all das zeichnet dieses unverzichtbare Handbuch aus. Es eignet sich sowohl für Anfänger, die JavaScript von Grund auf lernen, als auch für Fortgeschrittene und Profis, die wissen wollen, wie man moderne, dynamische Webanwendungen entwickelt. Hier finden Sie alle wichtigen Techniken - Ajax, jQuery, Node.js, DOM und mehr. Entdecken Sie die neuesten Trends, Techniken und Entwicklungen bis hin zur Steuerung von Microcontrollern. Machen Sie sich mit Objektorientierung, ECMAScript 21 und funktionaler Programmierung vertraut und profitieren Sie von zahlreichen praxisnahen Beispielen für den sofortigen Einsatz. Das perfekte Lehrbuch für moderne Webentwickler!

Wir sind Mitglied im Amazon.Partnernet und können mit Affiliate-Links den Betrieb der Webseite etwas unterstützen, für Sie als Leser ist das natürlich vollkommen kostenlos.

Weitere passende Beiträge

Template ohne Code mit Smarty

 smarty  Template


Erstellen Sie ein Webseite mit der Template-Engine Smarty ohne aufwändigen Programm Code. Ein trivialer Beitragsloop wiederholt sich in festen Strukturen.

Teil 3 einfaches Layout für GetSimple

 get-simple  Layout Template Design


Teil 3 - Ein GetSimple Template erstellen. In Verbindung mit dem freien und beliebten CSS-Framework Bootstrap eine leichte Sache auf dem Weg zum eigenen Blog.

Teil 1 funktionfähiges Template für GS

 get-simple  Template Layout Design


Teil 1 - Der Einstieg in das Templating mit dem freien CMS GetSimple - der Name ist Programm, denn dieses CMS ist klar und leicht beherrschbar strukturiert.

Kleinste PHP Template-Engine

 php  Template Parser klein


Das ist die kleinste PHP Template-Engine, bzw. das kleinste PHP-CMS der Welt, erstellt mit der Programmiersprache PHP und 7 Zeilen Code.

Fehlerausgaben in Smarty unterdrücken

 smarty  Fehler Template


So verhindern Sie die Ausgabe von Warnungen und Meldungen in der Template Engine Smarty. Besonder hilfreich während der Entwicklung in kleinen Projekten.

Democode für Handlebars.JS

 handlebarsjs  Demo Template


Dieser Beitrag zeigt ein einfaches Demo Template für die JavaScript basierte Template Engine Handlebars. Dieses Template ist sogar offline funktionsfähig.

Impressum


CMSWorkbench.de ist eine reine Entwickler-Webseite und dient vorwiegend als Wissensspeicher für die Entwicklung von CMS

Datenschutz


Die Webseite verwendet keinerlei Tracking- oder Speicher-Mechanismen, die Rückschlüsse auf Ihre IP oder das Leseverhalten zulassen

Affiliate


Wir sind Mitglied im Amazon Partnernet und können mit Affiliate-Links (* den Betrieb der Seite etwas unterstützen, für Sie ist das natürlich kostenlos

Kontakt


Sie können mit uns über eMail Kontakt aufnehmen, schreiben Sie an Kontakt@Oliver-Lohse.de