hobbeshunter

<h4>EN:</h4>
This plugin provides 3 shortcodes:
[zeitstrahler_wrapper style=”grey/greyRedRound”][/zeitstrahler wrapper]
The frame of our timeline. The other shortcodes belong inside of them. You can choose an style. It’s also easy to add a new one through custom css. Do something like:
<pre><code>.zeitstrahler_wrapper.greyRedRound::before {
 background-color: rgb(76,76,76);
}

.zeitstrahler_wrapper.greyRedRound .zeitstrahler_element {
 background-color: transparent;
 border-radius: 5px;
 box-shadow: 0 0 5px 2px rgb(76,76,76);
}

.zeitstrahler_wrapper.greyRedRound .zeitstrahler_element::before {
 border-color: rgb(76,76,76);
 background-color: rgb(240,76,76);
}

.zeitstrahler_wrapper.greyRedRound .zeitstrahler_element_date {
 font-weight: bold;
 color: rgb(240,76,76);
}

.zeitstrahler_wrapper.greyRedRound .zeitstrahler_element_heading {
 margin-top: 0 !important;
}

.zeitstrahler_wrapper.greyRedRound .zeitstrahler_arrow::before {
 border-color: rgb(240,76,76);
}

.zeitstrahler_wrapper.greyRedRound .zeitstrahler_date span {
 background-color: rgb(240,76,76);
 color: #FFF;
 display: inline-block;
 border-radius: .2em;
 padding-left: .4em;
 padding-right: .4em;
 font-weight: bold;
}
</code></pre>
[zeitstrahler_element date=”1.1.1900″ heading=”Birthday”]your content[/zeitstrahler_element]
An timeline element.
[zeitstrahler_date]1900[zeitstrahler_date]
An big date, placed central at the timeline.
<h4>DE:</h4>
Dieses Plugin stellt 3 Shortcodes zu Verfügung:
[zeitstrahler_wrapper style=”grey/greyRedRound”][/zeitstrahler wrapper]
Der Rahmenshortcodes des Ganzen. Die anderen Shortcodes sollten sich in diesem befinden. Hier kann man auch zwischen diversen Designs wählen. Durch custom css kann man auch einfach ein neues schreiben.
[zeitstrahler_element date=”1.1.1900″ heading=”Geburtstag”]ihr Inhalt[/zeitstrahler_element]
Ein Zeitstrahlelement.
[zeitstrahler_date]1900[zeitstrahler_date]
Ein hervorgehobenes Datum.

zeitstrahler

A simple plugin to style your content as a timeline with a few shortcodes.

poetaster

<h4>EN:</h4>
A simple wordpress plugin to parse shortcodes and produce a nice html/css only timeline.
This plugin provides 4 shortcodes:
<ul>
<li>[ctimeline] – a wrapper for the entire timeline</li>
<li>[ctentry] – a date label with an entry and option content</li>
<li>[ctspace] – a simple spacer</li>
<li>[ctdate] – not implemented yet.</li>
</ul>
Take a look at the screenshots to see what rendering looks like. CSS3 
transitions and html supply minimal animations. Most markup can be used within 
the shortcodes to achieve formatting and, for instance, embed images. The 
following example demonstrates,
<ul>
<li>‘fake’ super/sub sections, not using the ‘date’ param of ctentry </li>
<li>embed a picture</li>
<li>format a label</li>
</ul>
[ctimeline]
[ctentry date=”” label=”2015″] Wasn’t much going on in 2015.[/ctentry]
[ctentry date=”11 May 2015 ” label=”The title of this entry reflects the needs of verbose headline copy editors.”]
amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. 
[/ctentry]
[ctspace][/ctspace]
[ctspace][/ctspace]
[ctentry date=”” label=”2016″] A bit more going on in 2016.[/ctentry]
[ctentry date=”12 May 2016″ label=”12th cool”] 
Curabitur tortor. Pellentesque nibh. Aenean quam. In scelerisque sem at dolor. Maecenas mattis. Sed convallis tristique sem. Proin ut ligula vel nunc egestas porttitor. Morbi lectus risus, iaculis vel, suscipit quis, luctus non, massa. Fusce ac turpis quis ligula lacinia aliquet. Mauris ipsum. Nulla metus metus, ullamcorper vel, tincidunt sed, euismod in, nibh. Quisque volutpat condimentum velit. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Nam nec ante. 
[/ctentry]
[ctentry date=”13 May 2016″ label=”13th cool”] 
In scelerisque sem at dolor. Maecenas mattis. Sed convallis tristique sem. Proin ut ligula vel nunc egestas porttitor. Morbi lectus risus, iaculis vel, suscipit quis, luctus non, massa. Fusce ac turpis quis ligula lacinia aliquet. Mauris ipsum. Nulla metus metus, ullamcorper vel, tincidunt sed, euismod in, nibh. Quisque volutpat condimentum velit. Curabitur tortor. Pellentesque nibh. Aenean quam. In scelerisque sem at dolor. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Nam nec ante. Curabitur tortor. Pellentesque nibh. Aenean quam. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. 
[/ctentry]
[/ctimeline]

zeitstrahler vs csstimeline