Skydancer

Store Templateson April 18th, 20115 Kommentare

Ein Business Template der Extra Klasse mit Slider und jede Menge tolle CSS Einstellungen. Natürlich ist beim Kauf, wie bei allen combosa Templates eine Demo in html dabei. Überschriften werden mit der Cufon Java Script Technik generiert, die aber von Suchmaschinen gefunden werden.

Skydancer

Sie können diesen Quellcode in eine eigens angelegte Seite kopieren um zu sehen was das Template kann. Stellen Sie diese Seite auf versteckt!

<h1>Text, ul, li, Formatierungen</h1>
<p>Text mit Link.</p>
<p>Consectetuer adipiscing elit.  Maecenas feugiat consequat diam. Maecenas metus. Vivamus diam purus, cursus a, Hover Tooltip commodo non, facilisis vitae, nulla.  Aenean dictum lacinia tortor. Nunc iaculis, nibh non iaculis aliquam, orci felis euismod neque, sed ornare massa mauris sed velit.</p>
<hr />



<pre>
&lt;ul class=&quot;sidelist&quot;&gt;

</pre>
<ul class="sidelist">
    <li><a href="#">Maece feugiat Toledo </a></li>
    <li><a href="#">Massa mauris sed vel</a></li>
    <li><a href="#">Aenean dictum lacinia</a></li>
</ul>
<p>&nbsp;</p>
<pre>
&lt;div class=&quot;line&quot;&lt;/div&gt;

</pre>
<p>&nbsp;</p>
<div class="line">&nbsp;</div>
<p>&nbsp;</p>
<pre>
&lt;div class=&quot;go-to-top&quot;&gt;&lt;a href=&quot;#container&quot;&gt;nach oben&lt;/a&gt;&lt;/div&gt;
</pre>
<div class="go-to-top"><a href="#container">nach oben</a></div>
<h1>Darstellungen</h1>

<p>&nbsp;</p>
<pre>
&lt;div class=&quot;col-290&quot;&gt; und &lt;div class=&quot;col-290-last&quot;&gt;
</pre>
<p>&nbsp;</p>
<div class="col-290">
<h2>Col 290</h2>
<p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy  eirmod tempor invidunt ut <a href="#">labore</a> 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.  Lorem ipsum dolor sit amet.</p>

</div>
<div class="col-290">
<h2>Col 290</h2>
<p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy  eirmod tempor invidunt ut <a href="#">labore</a> 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.  Lorem ipsum dolor sit amet.</p>
</div>
<div class="col-290-last">
<h2>Col 290-last</h2>
<p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy  eirmod tempor invidunt ut <a href="#">labore</a> 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.  Lorem ipsum dolor sit amet.</p>

</div>

<div class="clear">&nbsp;</div>
<div class="go-to-top"><a href="#container">nach oben</a></div>

<p>&nbsp;</p>



<h1>Blockquote</h1>

<blockquote>
<p>Proin metus tortor, consectetur sit amet mattis id, lobortis sed leo. Vivamus sem ligula, eleifend nec rutrum ac, vehicula at massa. Quisque fermentum velit ac nibh hendrerit ultricies eget nec tortor. Quisque fermentum velit ac nibh hendrerit ultricies eget nec tortor.</p>
</blockquote>


<p>&nbsp;</p>
<h1>Table Sample</h1>
<table>
    <thead>
        <tr>
            <th scope="col">Feature</th>
            <th scope="col">Easy</th>
            <th scope="col">Business</th>
            <th scope="col">Premium</th>
        </tr>
    </thead>
    <tfoot>
    <tr>

        <td>&nbsp;</td>
        <td><strong><a href="#">jetzt bestellen<br />
        </a></strong></td>
        <td><strong><a href="#">jetzt bestellen</a></strong></td>
        <td><strong><a href="#">jetzt bestellen</a></strong></td>
    </tr>
    </tfoot>

    <tbody>
        <tr class="odd">
            <td class="cellfeat">Webspace</td>
            <td>100 MB</td>
            <td>500 MB</td>
            <td>1000 MB</td>
        </tr>

        <tr>
            <td class="cellfeat">24H Support</td>
            <td><img src="media/images/icon_20.png" alt="No" /></td>
            <td><img src="media/images/icon_9.png" alt="Yes" /></td>
            <td><img src="media/images/icon_9.png" alt="Yes" /></td>
        </tr>
        <tr class="odd">
            <td class="cellfeat">Free Lifetime Update</td>

            <td><img src="media/images/icon_20.png" alt="No" /></td>
            <td><img src="media/images/icon_9.png" alt="Yes" /></td>
            <td><img src="media/images/icon_9.png" alt="Yes" /></td>
        </tr>
        <tr>
            <td class="cellfeat">Email Address</td>
            <td><img src="media/images/icon_9.png" alt="Yes" /></td>
            <td><img src="media/images/icon_9.png" alt="Yes" /></td>

            <td><img src="media/images/icon_9.png" alt="Yes" /></td>
        </tr>
        <tr class="odd">
            <td class="cellfeat">Search Engine Optimisation</td>
            <td><img src="media/images/icon_20.png" alt="No" /></td>
            <td><img src="media/images/icon_9.png" alt="Yes" /></td>
            <td><img src="media/images/icon_9.png" alt="Yes" /></td>
        </tr>

        <tr>
            <td class="cellfeat">24H Support</td>
            <td><img src="media/images/icon_20.png" alt="No" /></td>
            <td><img src="media/images/icon_9.png" alt="Yes" /></td>
            <td><img src="media/images/icon_9.png" alt="Yes" /></td>
        </tr>
        <tr class="odd">
            <td class="cellfeat">Free Lifetime Update</td>

            <td><img src="media/images/icon_20.png" alt="No" /></td>
            <td><img src="media/images/icon_9.png" alt="Yes" /></td>
            <td><img src="media/images/icon_9.png" alt="Yes" /></td>
        </tr>
        <tr>
            <td class="cellfeat">Email Address</td>
            <td><img src="media/images/icon_9.png" alt="Yes" /></td>
            <td><img src="media/images/icon_9.png" alt="Yes" /></td>

            <td><img src="media/images/icon_9.png" alt="Yes" /></td>
        </tr>
        <tr class="odd">
            <td class="cellfeat">Search Engine Optimisation</td>
            <td><img src="media/images/icon_20.png" alt="No" /></td>
            <td><img src="media/images/icon_9.png" alt="Yes" /></td>
            <td><img src="media/images/icon_9.png" alt="Yes" /></td>
        </tr>

        <tr>
            <td class="cellfeat">Email Address</td>

            <td><img src="media/images/icon_9.png" alt="Yes" /></td>
            <td><img src="media/images/icon_9.png" alt="Yes" /></td>
            <td><img src="media/images/icon_9.png" alt="Yes" /></td>
        </tr>
        <tr class="odd">
            <td class="cellfeat">Price</td>

            <td><strong>3.99 &euro;<br />
            </strong></td>
            <td><strong>6.99 &euro;<br />
            </strong></td>
            <td><strong>10.00 &euro;<br />
            </strong></td>
        </tr>

    </tbody>
</table>
<p>&nbsp;</p>
<h1>Heading 1</h1>
<p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam   nonumy eirmod tempor invidunt dolore magna aliquyam erat, sed diam   voluptua. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam    nonumy eirmod tempor invidunt dolore magna aliquyam erat, sed diam    voluptua. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam    nonumy eirmod tempor invidunt dolore magna aliquyam erat, sed diam    voluptua. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam    nonumy eirmod tempor invidunt dolore magna aliquyam erat, sed diam    voluptua. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam    nonumy eirmod tempor invidunt dolore magna aliquyam erat, sed diam    voluptua.</p>
<h2>This is the heading 2</h2>
<p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam   nonumy eirmod tempor invidunt dolore magna aliquyam erat, sed diam   voluptua.</p>
<h3>This is the heading 3</h3>
<p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam   nonumy eirmod tempor invidunt dolore magna aliquyam erat, sed diam   voluptua.</p>
<h4>Heading 4</h4>

<p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam   nonumy eirmod tempor invidunt dolore magna aliquyam erat, sed diam   voluptua.</p>
<h5>Heading 5</h5>
<p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam   nonumy eirmod tempor invidunt dolore magna aliquyam erat, sed diam   voluptua.</p>
<h6>Heading 6</h6>
<p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam   nonumy eirmod tempor invidunt dolore magna aliquyam erat, sed diam   voluptua.</p>
<h2>Meldungen</h2>
<div class="noti_warning">Maecenas feugiat consequat diam. Maecenas metus.!</div>
<div class="noti_note">Maecenas feugiat consequat diam. Maecenas metus..</div>
<div class="noti_info">Maecenas feugiat consequat diam. Maecenas metus..</div>

<div class="noti_success">Maecenas feugiat consequat diam. Maecenas metus.!</div>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<h1>Kontaktformular</h1>
<p>&nbsp;</p>
<table width="98%" cellspacing="0" cellpadding="2" border="0">
    <tbody>
        <tr>
            <td class="field_title"><label for="field2">Name</label>:</td>

            <td><input type="text" class="textfield" id="field2" name="field2" /></td>
        </tr>
        <tr>
            <td class="field_title"><label for="field3">Email</label>:</td>
            <td><input type="text" class="textfield" value="" maxlength="" id="field3" name="field3" /></td>
        </tr>
        <tr>
            <td class="field_title"><label for="field4">Website</label>:</td>

            <td><input type="text" class="textfield" value="" maxlength="" id="field4" name="field4" /></td>
        </tr>
        <tr>
            <td class="field_title"><label for="field5">Message</label>:</td>
            <td><textarea rows="5" cols="25" class="textarea" id="field5" name="field5"></textarea></td>
        </tr>
        <tr>

            <td class="field_title">&nbsp;</td>
        </tr>
        <tr>
            <td>&nbsp;</td>
            <td><input type="submit" value="Absenden" name="submit" /></td>
        </tr>
    </tbody>
</table>
<p>&nbsp;</p>
<p>&nbsp;</p>

<h1>Address:</h1>
<address>Address Morbi in sem quis dui placerat ornare. Pellentesque odio nisi,  euismod in, pharetra a, ultricies in, diam. Sed</address>
<p>&nbsp;</p>


<h1>Blockquote</h1>
<div class="line">&nbsp;</div>


<blockquote>
<p>Maecenas metus. Vivamus diam purus, cursus a, commodo non, facilisis vitae, nulla. Aenean dictum lacinia tortor. Nunc iaculis, nibh non iaculis aliquam, orci felis euismod neque, sed ornare massa mauris sed velit.</p>
<cite>Mehr informationen: <a href="#"> zum Thema</a></cite> 						

</blockquote>




<h1>Code (pre)</h1>


<pre>
pre {
	background: #f3f3f3 url(img/pre.png) no-repeat 5px 5px;
	padding: 1em 1em 0 40px;
	border: 1px solid #dcdcdc;
	margin-left: 0;
	overflow:auto;
}
</pre> 



  • StumbleUpon
  • Digg
  • Delicious
  • Technorati
  • Yahoo! Bookmarks
  • Twitter
  • MySpace
  • Google Bookmarks
  • Facebook
  • E-Mail

5 Antworten zu “Skydancer”

  1. admin says:

    Texte können auch mit class in Form gebracht werden, in der css wurde

    .linksbuendig
    .rechtsbuendig
    .zentriert
    .blocksatz 
    

    festgelegt.

    Wenn Sie texte schreiben kann man also:
    h1 class=“zentriert“
    oder
    p class=“blocksatz“ schreiben.

    Um die drei Bereiche zu erstellen wird div class=“col-290″ verwendet. Im Demo ist alles zu sehen. Im Editor von WebsiteBaker muss dann unter Quellcode, die div class festgelegt werden.

  2. Fabian says:

    Klasse Template!
    Mit eines der schönsten die du jeh gemacht hast! mit deinem Support dazu ist das Ganze eine runde Sache. Ich freu mich immer mal hier in deinem Blog vorbei zu schauen und deine neusten Templates zu bewundern.

    LG Fabian

  3. Werner says:

    Hallo,
    wie kann ich das Template Installieren?
    Im Admin Menü unter Einstellungen kann das Template nicht erfolgreich Installiert werden.
    Habe die Datei (PHP Manuell via ftp hochgeladen.
    Nach dem Upload kann das Design nicht in den Optionen Ausgewählt werden.

    Verwendet wird Website Baker Version Version 2.8.3 Revision 1611

    Danke Werner