Das ALLROUNDER Joomla Template

This Template was made for Joomla 1.5 !
There is an other ALLROUNDER for Joomla 1.6 / 1.7 / 2.5
 

ALLROUNDER Template Parameter

PDFDruckenE-Mail
Um Die Template Parameter des ALLROUNDER Templates anzupassen geht man wie folgt vor:
  • In das Joomla Backend einloggen
  • Erweiterungen > Templates wählen
  • ALLROUNDER anklicken
  • rechts alle Template Parameter anpassen (Siehe Bild)

Wenn Sie die Template Parameter optimieren beachten Sie die Tooltips bei den Namen der Parameter. Hier wird mittels Hilfetexten oder Bildern erklärt was die einzelnen Parameter für Auswirkungen haben.

template-parameter

Zuletzt aktualisiert am Mittwoch, den 01. September 2010 um 17:08 Uhr Geschrieben von: Webmaster Donnerstag, den 12. August 2010 um 20:24 Uhr
 

ALLROUNDER - Download

PDFDruckenE-Mail

Zum Download des ALLROUNDER Joomla Templates wählen Sie den foldenen Link zur Downloadseite von LernVid.com.

Download ALLROUNDER

Download LV Image Slider

Zuletzt aktualisiert am Donnerstag, den 19. August 2010 um 16:21 Uhr Geschrieben von: Webmaster Montag, den 19. Juli 2010 um 19:53 Uhr
   

ALLROUNDER Joomla Layouts

PDFDruckenE-Mail
Joomla bietet eine Reihe von Menütypen.  Dazu gehören die 4 Standardansichten die man in Joomla verwenden kann um seine Beiträge zu präsentieren, sowie auch andere Standardlayouts die man als Menüpunkt definieren kann.

  • Bereich als Blog
  • Bereich als Tabelle
  • Kategorie als Blog
  • Kategorie als Tabelle
  • Kontakte
  • Umfragen
  • Newsfeeds
  • Suche
  • Weblinks
  • Login

Über das Menü können Sie zwischen den verschiedenen Layouts wechseln.

Sehen Sie sich die Ansichten genau an und entscheiden Sie welche Ansichts-Details Sie gerne über das Joomla Backend einblenden oder ausblenden möchten.

Zuletzt aktualisiert am Montag, den 16. August 2010 um 09:24 Uhr Geschrieben von: Webmaster Sonntag, den 18. Juli 2010 um 21:28 Uhr
 

ALLROUNDER - Typografie und Textgestaltung

PDFDruckenE-Mail
info In folgenden Abschnitt sehen Sie die typografischen Eigenschaften des ALLROUNDER Templates im Detail. Als Typografie bezeichnet man die Gestaltung der HTML Elemente, auf welche der Betreiber der Seite später per HTML Code in Beiträgen Zugriff hat. Weiters sehen Sie hier wie Sie vorgehen müssen wenn sie die HTML Elemente ansprechen wollen um diese in Beiträgen zu verwenden. Viel Spass beim durchstöbern Ihrer Code-elemente!

Eine horizontale Linie

Der hr Tag wird wird eingesetzt um eine horizontale Linie in einen Beitrag auszugeben.

<hr>

Gibt man hier einen Klassennamen an, so verändert er sich wie folgt:

<hr class="black">
<hr class="blue">
<hr class="red">
<hr class="green">

Überschriften Ordnung eins bis sechs

<h1>

Überschrift der ersten Ordnung

<h1 class="info">

H1-Tag mit Klassennamen info

<h1 class="right">

H1-Tag mit Klassennamen right

<h1 class="alert">

H1-Tag mit Klassennamen alert

<h1 class="tell">

H1-Tag mit Klassennamen tell

<h1 class="content">

H1-Tag mit Klassennamen content

<h1 class="note">

H1-Tag mit Klassennamen note

<h2>

Überschrift der zweiten Ordnung

<h3>

Überschrift der dritten Ordnung

<h3 class="section">

H3-Tag mit Klassennamen section:

<h4>

Überschrift der vierten Ordnung

<h5>
Überschrift der fünften Ordnung
<h6>
Überschrift der sechsten Ordnung

Spezielle DIV's

<div class=info>
Div Tags eignen sich hervoragend um innerhalb von Beiträgen um die Blöcke anzugrenzen.
Sofern man dem div einen Klassennamen mitgibt, wird es so formatiert wie in dieser Demo.

<div class=right>
Div Tags eignen sich hervoragend um innerhalb von Beiträgen um die Blöcke anzugrenzen.
Sofern man dem div einen Klassennamen mitgibt, wird es so formatiert wie in dieser Demo.

<div class=alert>
Div Tags eignen sich hervoragend um innerhalb von Beiträgen um die Blöcke anzugrenzen.
Sofern man dem div einen Klassennamen mitgibt, wird es so formatiert wie in dieser Demo.

<div class=tell>
Div Tags eignen sich hervoragend um innerhalb von Beiträgen um die Blöcke anzugrenzen.
Sofern man dem div einen Klassennamen mitgibt, wird es so formatiert wie in dieser Demo.

<div class=content>
Div Tags eignen sich hervoragend um innerhalb von Beiträgen um die Blöcke anzugrenzen.
Sofern man dem div einen Klassennamen mitgibt, wird es so formatiert wie in dieser Demo.

<div class=note>
Div Tags eignen sich hervoragend um innerhalb von Beiträgen um die Blöcke anzugrenzen.
Sofern man dem div einen Klassennamen mitgibt, wird es so formatiert wie in dieser Demo.

<div class=contenthead>
Div Tags eignen sich hervoragend um innerhalb von Beiträgen um die Blöcke anzugrenzen.
Sofern man dem div einen Klassennamen mitgibt, wird es so formatiert wie in dieser Demo.
<div class=contenthead-dark>
Div Tags eignen sich hervoragend um innerhalb von Beiträgen um die Blöcke anzugrenzen.
Sofern man dem div einen Klassennamen mitgibt, wird es so formatiert wie in dieser Demo.
<div class=contenthead-blue>
Div Tags eignen sich hervoragend um innerhalb von Beiträgen um die Blöcke anzugrenzen.
Sofern man dem div einen Klassennamen mitgibt, wird es so formatiert wie in dieser Demo.
<div class=contenthead-red>
Div Tags eignen sich hervoragend um innerhalb von Beiträgen um die Blöcke anzugrenzen.
Sofern man dem div einen Klassennamen mitgibt, wird es so formatiert wie in dieser Demo.
<div class=contenthead-green>
Div Tags eignen sich hervoragend um innerhalb von Beiträgen um die Blöcke anzugrenzen.
Sofern man dem div einen Klassennamen mitgibt, wird es so formatiert wie in dieser Demo.

<div class=hot>
Div Tags eignen sich hervoragend um innerhalb von Beiträgen um die Blöcke anzugrenzen.
Sofern man dem div einen Klassennamen mitgibt, wird es so formatiert wie in dieser Demo.
<div class=new>
Div Tags eignen sich hervoragend um innerhalb von Beiträgen um die Blöcke anzugrenzen.
Sofern man dem div einen Klassennamen mitgibt, wird es so formatiert wie in dieser Demo.
<div class=top>
Div Tags eignen sich hervoragend um innerhalb von Beiträgen um die Blöcke anzugrenzen.
Sofern man dem div einen Klassennamen mitgibt, wird es so formatiert wie in dieser Demo.
<div class=cols-3>
<div>Inhalt der Spalte 1</div>
<div>Inhalt der Spalte 2</div>
<div>Inhalt der Spalte 3</div>
</div>

Spalte 1

Dies ist die erste von drei Spalten. Dieses Spaltenlayout eigent sich hervrragend zur optischen Trennung von Text, was die Lesbarkeit erhöht.

Spalte 2

Dies ist die zweite von drei Spalten. Dieses Spaltenlayout eigent sich hervrragend zur optischen Trennung von Text, was die Lesbarkeit erhöht.

Spalte 3

Dies ist die dritte von drei Spalten. Dieses Spaltenlayout eigent sich hervrragend zur optischen Trennung von Text, was die Lesbarkeit erhöht.
<div class=cols-2>
<div>Inhalt der Spalte 1</div>
<div>Inhalt der Spalte 2</div>
</div>

Spalte 1

Dies ist die erste von zwei Spalten. Dieses Spaltenlayout eigent sich hervrragend zur optischen Trennung von Text, was die Lesbarkeit erhöht.

Spalte 2

Dies ist die zweite von zwei Spalten. Dieses Spaltenlayout eigent sich hervrragend zur optischen Trennung von Text, was die Lesbarkeit erhöht.

Spezielle Absätze:

Ein Tip Text welcher dazu verwendet werden kann um spezielle gut sichtbare Tips von sich zu geben. Der Code hierfür lautet wie folgt:
<p class="tip">

Ein Alarm Text welcher dazu verwendet werden kann um spezielle gut sichtbare Alarmmeldungen von sich zu geben. Der Code hierfür lautet wie folgt:
<p class="alert">


Preformatierter Text:

<pre>
Dies ist ein preformatierter Text. Ein preformatierter
Text eignet sich hervorragend um zum Beispiel
ein Stück Code in einen Beitrag aufzunehmen und anzuzeigen. Beispiel gefällig?
<pre class="css">
#wrapper {
background: #efefef;
border-left: 1px solid #fff;
border-right: 1px solid #fff;
border-bottom: 1px solid #ccc;
}
<pre class="html">
<body style="background:#fff; color:#000;">
<!-- Content -->
</body>
<pre class="xml">
<files>
<filename>index.php</filename>
<filename>head_includes.php</filename>
<filename>index.html</filename>
<files>
<pre class="js">
var Tips3 = new Tips($$('#tip-gray'), {
className: 'gray',
showDelay: 100,
hideDelay: 400,
});

Code Text:

<code> Dies ist ein Code Text. Eigentlich gedacht um Code zu auf HTML zu posten muss man feststellen, dass sich der <pre> Tag dazu besser eignet. Preformatierter Text nimmt auch Leerstellen als ganzes und füllt diese in der Anzeige von Texten auf. So ist es möglich code zu kopieren ohne dass die Leerstellen in der Anzeige später entfernt werden und der Code verückt/einrückt.</code>


Ein Zitat Block

<blockquote>
Dies ist ein Zitat Block mit Textinhalt. Zitate bilden des öfteren eine schicke Bereicherung für eine Webseite. So kann man Zitate sehr gut nutzen um andere Quellen zu zitieren oder einfach den eigenen Beitrag etwas aufbessern indem man seinen verfassten Text mit einem blockquote Tag umschließt.

Listen

Eine unsortierte Liste

<ul>
  • Listenpunkt 1.1
  • Listenpunkt 1.2
  • Listenpunkt 1.3
    • Listenpunkt 1.3.1
    • Listenpunkt 1.3.2
    • Listenpunkt 1.3.3
      • Listenpunkt 1.3.3.1
      • Listenpunkt 1.3.3.2
      • Listenpunkt 1.3.3.3
      • Listenpunkt 1.3.3.4
      • Listenpunkt 1.3.3.5
    • Listenpunkt 1.3.4
    • Listenpunkt 1.3.5
  • Listenpunkt 1.4
  • Listenpunkt 1.5

Eine unsortierte Liste mit dem Klassennamen arrow

<ul class="arrow">
  • Listenpunkt 1.1
  • Listenpunkt 1.2
  • Listenpunkt 1.3
    • Listenpunkt 1.3.1
    • Listenpunkt 1.3.2
    • Listenpunkt 1.3.3
      • Listenpunkt 1.3.3.1
      • Listenpunkt 1.3.3.2
      • Listenpunkt 1.3.3.3
      • Listenpunkt 1.3.3.4
      • Listenpunkt 1.3.3.5
    • Listenpunkt 1.3.4
    • Listenpunkt 1.3.5
  • Listenpunkt 1.4
  • Listenpunkt 1.5

Eine unsortierte Liste mit dem Klassennamen folder

<ul class="folder">
  • Listenpunkt 1.1
  • Listenpunkt 1.2
  • Listenpunkt 1.3
    • Listenpunkt 1.3.1
    • Listenpunkt 1.3.2
    • Listenpunkt 1.3.3
      • Listenpunkt 1.3.3.1
      • Listenpunkt 1.3.3.2
      • Listenpunkt 1.3.3.3
      • Listenpunkt 1.3.3.4
      • Listenpunkt 1.3.3.5
    • Listenpunkt 1.3.4
    • Listenpunkt 1.3.5
  • Listenpunkt 1.4
  • Listenpunkt 1.5

Eine unsortierte Liste mit dem Klassennamen ok

<ul class="ok">
  • Listenpunkt 1.1
  • Listenpunkt 1.2
  • Listenpunkt 1.3
    • Listenpunkt 1.3.1
    • Listenpunkt 1.3.2
    • Listenpunkt 1.3.3
      • Listenpunkt 1.3.3.1
      • Listenpunkt 1.3.3.2
      • Listenpunkt 1.3.3.3
      • Listenpunkt 1.3.3.4
      • Listenpunkt 1.3.3.5
    • Listenpunkt 1.3.4
    • Listenpunkt 1.3.5
  • Listenpunkt 1.4
  • Listenpunkt 1.5

Eine unsortierte Liste mit dem Klassennamen star

<ul class="star">
  • Listenpunkt 1.1
  • Listenpunkt 1.2
  • Listenpunkt 1.3
    • Listenpunkt 1.3.1
    • Listenpunkt 1.3.2
    • Listenpunkt 1.3.3
      • Listenpunkt 1.3.3.1
      • Listenpunkt 1.3.3.2
      • Listenpunkt 1.3.3.3
      • Listenpunkt 1.3.3.4
      • Listenpunkt 1.3.3.5
    • Listenpunkt 1.3.4
    • Listenpunkt 1.3.5
  • Listenpunkt 1.4
  • Listenpunkt 1.5

Eine geordnete Liste

<ol>
  1. Listenpunkt 1.1
  2. Listenpunkt 1.2
  3. Listenpunkt 1.3
    1. Listenpunkt 1.3.1
    2. Listenpunkt 1.3.2
    3. Listenpunkt 1.3.3
      1. Listenpunkt 1.3.3.1
      2. Listenpunkt 1.3.3.2
      3. Listenpunkt 1.3.3.3
      4. Listenpunkt 1.3.3.4
      5. Listenpunkt 1.3.3.5
    4. Listenpunkt 1.3.4
    5. Listenpunkt 1.3.5
  4. Listenpunkt 1.4
  5. Listenpunkt 1.5

Hyperlinks

<a>

Ein normaler Hyperlink


<a class="info">

Ein info Hyperlink


<a class="extern">

Ein externer Hyperlink


<a class="www">

Ein www Hyperlink


<a class="download">

Ein Download Hyperlink


<a class="run">

Ein run Hyperlink


<a class="image">

Ein image Hyperlink


<a class="user">

Ein user Hyperlink


<a class="pdf">

Ein pdf Hyperlink


<a class="zip">

Ein zip Hyperlink


<a class="text">

Ein text Hyperlink


<a class="sound">

Ein sound Hyperlink


<a class="video">

Ein video Hyperlink


Tabellen

<table>
Tabellenplatz 1 Tabellenplatz 2
Tabellenplatz 3 Tabellenplatz 4
Tabellenplatz 5 Tabellenplatz 6
Tabellenplatz 7 Tabellenplatz 8
Tabellenplatz 9 Tabellenplatz 10

Tabelle mit dem Klassennamen gray

<table class="gray">
Tabellenplatz 1 Tabellenplatz 2
Tabellenplatz 3 Tabellenplatz 4
Tabellenplatz 5 Tabellenplatz 6
Tabellenplatz 7 Tabellenplatz 8
Tabellenplatz 9 Tabellenplatz 10

Tabelle mit dem Klassennamen blue

<table class="blue">
Tabellenplatz 1 Tabellenplatz 2
Tabellenplatz 3 Tabellenplatz 4
Tabellenplatz 5 Tabellenplatz 6
Tabellenplatz 7 Tabellenplatz 8
Tabellenplatz 9 Tabellenplatz 10


Tabelle mit dem Klassennamen red

<table class="red">
Tabellenplatz 1 Tabellenplatz 2
Tabellenplatz 3 Tabellenplatz 4
Tabellenplatz 5 Tabellenplatz 6
Tabellenplatz 7 Tabellenplatz 8
Tabellenplatz 9 Tabellenplatz 10


Tabelle mit dem Klassennamen yellow

<table class="yellow">
Tabellenplatz 1 Tabellenplatz 2
Tabellenplatz 3 Tabellenplatz 4
Tabellenplatz 5 Tabellenplatz 6
Tabellenplatz 7 Tabellenplatz 8
Tabellenplatz 9 Tabellenplatz 10


Tabelle mit dem Klassennamen white

<table class="white">
Tabellenplatz 1 Tabellenplatz 2
Tabellenplatz 3 Tabellenplatz 4
Tabellenplatz 5 Tabellenplatz 6
Tabellenplatz 7 Tabellenplatz 8
Tabellenplatz 9 Tabellenplatz 10

Tooltips via Mootools

Code

  • <a id="tip-fade" title="Tooltip Title :: Hyperlink - Tooltip - Fade !" href="#">Hyperlink - Tooltip - Fade</a>
  • <a id="tip-white" title="Tooltip Title :: Hyperlink - Tooltip - Weiss !" href="#">Hyperlink - Tooltip - Weiss</a>
  • <a id="tip-gray" title="Tooltip Title :: Hyperlink - Tooltip - Grau !" href="#">Hyperlink - Tooltip - Grau</a>
  • <a id="tip-blue" title="Tooltip Title :: Hyperlink - Tooltip - Blau !" href="#">Hyperlink - Tooltip - Blau</a>
  • <a id="tip-green" title="Tooltip Title :: Hyperlink - Tooltip - Grün!" href="#">Hyperlink - Tooltip - Grün</a>
  • <a id="tip-red" title="Tooltip Title :: Hyperlink - Tooltip - Rot!" href="#">Hyperlink - Tooltip - Rot</a>

Ergebnis


<img id="tip-white" title="Tooltip Title :: Ein Bild mit weissem Tooltip !" src="/images/stories/modulpositonen.png" />

Bilder

<img class="border-dark">
articles

<img class="border-light">
articles

Dropcap:

Das ist ein Dropcap! Dropcaps werden zur Auschschmückung von Textblöcken verwendet. Besonders ansehentlich ist ein Dropcap wenn er den Beginn eines neuen Abschnitts markiert. Um einen Dropcap zu benutzen umschließt man den Anfangsbuchstaben der ersten Wortes eines Absatzes mit einem span Tag dass den Klassennamen dropcap hat.


<span class="dropcap">D</span>as ist ein Dropcap! ...

Zuletzt aktualisiert am Donnerstag, den 23. Dezember 2010 um 16:27 Uhr Geschrieben von: Webmaster Donnerstag, den 15. Juli 2010 um 20:16 Uhr
   
© 2012 - ALLROUNDER
   
| Mittwoch, 22. Februar 2012 || Designed by: LernVid.com |