Bei dieser Seite handelt es sich um die Übersetzung der englischsprachigen Seite getting Started. Die Seite soll den Einstieg erleichtern.

Blogs Posts

Wenn man einen Blog-Post verfassen will, dann reicht es, einfach im Verzeichnis _posts eine Markdown-Datei zu verfassen, zum Beispiel die folgende in _posts/hello_world.md:

title: Hello World
date: 2012-07-20
    
## Hello World
    
This is my first blog post.
    
I like Telegram because:
    
* It's simple
* It's got nice templates
* I control my content

Wenn man Dropbox als Dateiablage benutzt, muss man zu Telegram wechseln und dort im Controllpanel "Refresh Site" drücken.

Wenn man GitHub als Dateiablage benutzt, muss man die Dateien committen (git add _posts; git commit -m "stuff") und zu GitHub pushen (git push).

Manchmal dauert es einige wenige Minuten, bis die Änderungen Online sichtbar sind.

Extra Info

Bei Extra Info handelt es sich um Informationen, mit denen Telegram Regeln für die Anzeige einer Website und zur Einpassung in allgemeine Struktur einer Website vorgegeben werden. Mehr Informationen hierzu gibt es auf Extra Info in How To…. Extra Info wird auch als Eigenschaften (Properties) oder Meta Data bezeichnet.

Die Beispieldatei _extra_info.md enthält zusätzliche globale Informationen für die Website:

---
blog_root: /blog_posts
site_title: My Blog
---
    
This file contains _Extra Info_ about your site.  You can

put information in here like which directory you want your posts in and that sort of stuff and the information will be part of every page in your site. But this page will not be part of your site.

Die blog_root Extra Info definiert das Verzeichnis, wo sich die Blogposts befinden.

Die site_title Extra Info definiert den Namen der Website.

Beachte: Da die Datei _extra_info.md mit einem '_' beginnt, wird sie nicht auf der Website angezeigt.

Das Template ändern

Wenn es kein Template gibt (ein Template ist wenigstens die Datei /templates-hidden/default.html), lädt Telegram ein externes Template.

Standardmäßig befindet sich das externe Template in der Git repository unter https://github.com/telegr-am/template-base.git. Siehe auch default template project auf GitHub.

Wenn man das Template ändern will, kann man dies tun, in dem man diese Extra Info Zeile in deine Datei oder in die _extra_info.md schreibt:

template_url: https://github.com/telegr-am/template-blue.git

Seiten hinzufügen

Um eine Seite zur Website hinzuzufügen, erstellt man eine Markdown oder HTML-Datei, speichert sie im Projektverzeichnis und führt ein Refresh Site durch.

Wenn man die Extra Info menu hinzufügt, erscheint die Seite im Menü und die Extra Info order legt die Position im Menü fest.

Inhalt zum Template hinzufügen

Standardmäßig fügt Telegram Inhalte aus der Datei /templates-hidden/include.html im Template ein. Man kann in diese Datei eigene Inhalte einfügen.

Hier sind ein paar hilfreiche Zeilen:

Footer anpassen:

<span data-lift="xform" data-css="footer *">(c) 2010-2012 David Pollak</span>

Diese Zeile nutzt den [xform-snippet](https://howto.telegr.am/snippets), der HTML nodes in der Seite auswählt und die Inhalte aus dem data-css weitergibt. Die footer * Regel sagt: finde alle <footer> Elemente und ersetzte sie.

Um ein 2-apltiges template zu erzeugen, bei dem die linke Spalte 5 Achtel und die rechte Spalte 3 Achtel der Gesamtbreite einnehmen, fügt man ein:

<span data-lift="xform" data-css="#main_content_place [class+]">row</span>
<span data-lift="xform" data-css="#left_side [class+]">span10</span>
<span data-lift="xform" data-css="#right_side [class+]">span6</span>

Die erste Zeile wählt das Element mit der id main_content_place und hängt row an das class Attribut an. Die anderen Zeilen legen die span-Breite der linken und rechten Spalte fest.

Einen Twitter Feed an der rechten Seite einfügen:

<div data-lift="xform" data-css="#right_side *+">
	<span data-lift="twitter?user=dpp"></span>
</div>

Damit wird die rechte Seite transformiert, in dem die Nodes an den Inhalt der rechten Seite angehängt werden (der *+ Operator). Das Element <span data-lift="twitter?user=dpp"></span> ruft das Twitter Snipper für den Nutzer dpp auf..

Google Analytics hinzufügen:

<div data-lift="google_analytics?id=abcdefg"></div>

Beachte, dass das Google Analytics Snippet das tail Snippet nutzt, so dass der Google Analytics Code am Ende der Seite direkt vor dem </body> Tag eingefügt wird.