Award

» Anmelden » Abstimmen » Hall Of fame » Gewinne » Teilnehmer » Vote Banner

Neuigkeiten

Aktuelles

Updates folgen...

Partner

» Project-4sp » Hpbk bundesliga » Mrquirinho » Serienanschauen » Omba

» Partner Banner

Blue Candy

Design Übersicht

» Dieses Design darfst du kostenlos auf deine Homepage einfügen und verwenden. Unter "Und so geht´s" findest du eine kurze Anleitung, wie du dieses Design im Homepage-Baukasten einfügst. Mit einem Klick auf das Bild des Designs vergrößert du die Vorschau.

» Bitte beachte:
Die Copyright Informationen im Footer des Designs dürfen auf keinen Fall entfernt oder geändert werden, da du sonst gegen die Lizenz- und Nutzungsrechte des Designs verstößt. Natürlich darfst du Bilder und Grafiken (Header, etc.) verändern und beschriften und auch das Design anders gestalten.

Blue Candy

» Echt ausgefallen
Das Design "Blue Candy" besitzt einen großen Header, in dem sowohl der Titel als auch eine große News-Schlagzeile ihren Platz finden. Der Content besteht aus 2 Hälften, auf der linken Seite steht der Text des Contents und auf der rechten Seite gibt es jede Menge Platz für News und weitere Infos. Auch ein großer Footer Bereich ist vorhanden. Der Content wächst mit dem Inhalt eurer Seite mit.

» Bewertung des Designs:

Der Design Code

"Text über dem Design" » Code in einem separaten Fenster anzeigen

<div  id="templatemo_main_wrapper"> <div id="templatemo_wrapper"> <div id="templatemo_header"> <div id="site_title"><a target="_parent"  href="http://www.templatemo.com/preview/templatemo_286_blue_candy">Dein  Titel<span>Hier dein Slogan</span></a></div>  <div id="header_right"> <div id="twitter"><a  href="http://www.facebook.com/templatemo">Follow us on  Twitter</a></div> <div class="cleaner"> </div> <h1>Deine News-Schlagzeile</h1> <p>Nam suscipit porta aliquam. Sed eget sem lorem, facilisis  suscipit lectus. Lorem ipsum dolor sit amet, consectetur.</p> <div class="btn_more image_fr"><a href="#">Mehr  lesen<span> »</span></a></div> </div> <div class="cleaner"> </div> </div> <div id="templatemo_menu"> <ul> 	<li><a href="index.html">Home</a></li> 	<li><a href="index.html">Company</a></li> 	<li><a href="products.html">Products</a></li> 	<li><a href="news.html">News</a></li> 	<li><a href="contact.html">Contact</a></li> </ul> </div>  <div id="content_wrapper"> <div id="content_left">

"Text unter dem Design" » Code in einem separaten Fenster anzeigen

<div class="content_box cb_last"> </div> <div class="content_box cb_last"> </div> </div> <div id="content_right"> <div class="content_box"> <h2><br> News</h2> <p><em>Nullam at erat ipsum, quis tincidunt mauris. Nunc sit  amet sapien eget eros iaculis hendrerit quis a enim. Vestibulum at leo  ante, vel auctor velit.</em></p> <ul class="tmo_list"> 	<li>Sed nec eros egestas nisl</li> 	<li>Morbi sed nulla ac est cursus</li> 	<li>Curabitur ullamcorper nibh</li> 	<li>Pellentesque adipiscing</li> </ul> <div class="btn_more image_fr"><a href="#">More  <span>»</span></a></div> <div class="cleaner"> </div> </div> <div class="content_box cb_last"> <h2>Background</h2> <blockquote> <p>Aenean eu aliquam erat. Ut commodo, nulla eu pellentesque  mollis, odio ante condimentum augue, eget facilisis dui magna ut ligula.  Quisque sit amet adipiscing libero. Donec et tellus vitae velit  pharetra lobortis.</p> </blockquote> <div class="btn_more image_fr"><a href="#">More  <span>»</span></a></div> <div class="cleaner"> </div> </div> </div> <div class="cleaner"> </div> </div> <div id="templatemo_footer"> <div class="col_w300"> <h4>Our Pages</h4> <ul> 	<li><a href="index.html">Home</a></li> 	<li><a href="company.html">Company</a></li> 	<li><a href="products.html">Products</a></li> 	<li><a href="news.html">News</a></li> 	<li><a href="contact.html">Contact</a></li> </ul> </div> <div class="col_w300"> <h4>Partner</h4> <ul> 	<li><a href="http://www.flashmo.com">Flash  Templates</a></li> 	<li><a href="http://www.templatemo.com">CSS  Templates</a></li> 	<li><a href="http://www.koflash.com">Flash Websites  Gallery</a></li> 	<li><a href="http://www.templatemo.com/page/1">Free Web  Templates</a></li> </ul> </div> <div class="col_w300"> <h4>Über uns</h4> <p>Integer consectetur enim eget diam tincidunt vehicula. Aenean  scelerisque tellus vitae tortor placerat egestas. Ut volutpat erat nec  mauris vestibulum sit amet pharetra urna faucibus.</p> <div class="btn_more"><a href="company.html">Read more  <span>»</span></a></div> </div> <div class="cleaner"> </div> </div>  <div id="templatemo_copyright">Copyright © 2048 <a  href="#">Your Company Name</a> | <a target="_parent"  href="http://www.iwebsitetemplate.com">Website Templates</a> by  <a target="_parent" href="http://www.templatemo.com">CSS  Templates</a> | Coding: <a  href="http://HpBk-TemplateWorld.de.tl">HpBk-TemplateWorld</a></div> <div  class="cleaner"> </div> </div> </div>

"CSS Code ohne Style Tags" » Code in einem separaten Fenster anzeigen

#extraDiv1  {display: none;} #extraDiv2 {display: none;} #extraDiv3 {display:  none;} #extraDiv4 {display: none;} #extraDiv5 {display: none;}  #extraDiv6 {display: none;} #pre_header {display: none;} #post_header  {display: none;} #pre_content {display: none;} #nav_heading{display:  none;} #nav{display: none;} div.header{display: none;} h1#title{display:  none;} h2#title span {display: none;}  /* Credit: http://www.templatemo.com */  body { 	margin: 0px; 	padding: 0px; 	color: #afbec5; 	font-family: Georgia, "Times New Roman", Times, serif; 	font-size: 13px; 	line-height: 1.5em;  	background-color: #242424; 	background-image: url(http://www.loaditup.de/files/586884.jpg); 	background-repeat: repeat-x; 	background-position: top; }  a, a:link, a:visited { color: #0eb4fa; text-decoration: underline; } a:hover { color: #FFFFFF; text-decoration: none; }  p { margin: 0px; padding: 0; } img { border: none; }  ul { margin: 0; padding: 0; } ul li { margin: 0; padding: 0; }  h1, h2, h3, h4, h5, h6 { color: #fff; } h1 { font-size: 40px; font-weight: normal; margin: 0 0 20px 0; padding:  5px 0; } h2 { font-size: 28px; font-weight: normal; margin: 0 0 20px 0; padding:  10px 0 15px 0; } h3 { font-size: 21px; font-weight: normal; margin: 0 0 15px 0; padding:  0; padding: 0 0 10px 0; } h4 { font-size: 18px; margin: 0 0 20px 0; padding: 0 0 10px 0; color:  #fff; } h5 { font-size: 16px; margin: 0 0 10px 0; padding: 0; color: #fff; } h6 { font-size: 14px; margin: 0 0 5px 0; padding: 0; color: #fff; }  .cleaner { clear: both; width: 100%; height: 0px; font-size: 0px;  } .cleaner_h10 { clear: both; width:100%; height: 10px; } .cleaner_h20 { clear: both; width:100%; height: 20px; } .cleaner_h30 { clear: both; width:100%; height: 30px; } .cleaner_h40 { clear: both; width:100%; height: 40px; } .cleaner_h50 { clear: both; width:100%; height: 50px; } .cleaner_h60 { clear: both; width:100%; height: 60px; }  .hr_divider { background: url(http://www.loaditup.de/files/586885.jpg)  bottom repeat-x; }  .float_l { float: left; } .float_r { float: right; }  .image_wrapper { display: inline-block; padding: 4px; border: 1px solid  #353c3f; background: #000; margin-bottom: 10px; } .image_fl { float: left; margin: 3px 15px 0 0; } .image_fr { float: right; margin: 3px 0 0 15px; }  blockquote { font-style: italic; margin-left: 10px;} cite { font-weight: bold; color:#fff; } cite span { color: #7b949f; } em { color: #fff; }  .tmo_list { margin: 20px 0 20px 20px; padding: 0; list-style: none; } .tmo_list li { background: url(../images/templatemo_list.png) no-repeat  scroll 0 0px; margin: 0 0 20px; padding: 2px 0 3px 25px;line-height:  1em; color: #08b1f7; } .tmo_list li a { color: #08b1f7; text-decoration: none; } .tmo_list li a:hover { color: #fff; text-decoration: none; }   .btn_more a { 	color: #a5e224; 	font-size: 14px; 	font-weight: bold; 	text-decoration: none; }  .btn_more a span { font-size: 18px; }  #templatemo_main_wrapper { 	background: url(http://www.loaditup.de/files/586886.jpg) center bottom  no-repeat; }  #templatemo_wrapper { 	width: 980px; 	margin: 0 auto; }  #templatemo_header { 	width: 940px; 	height: 250px; 	overflow: hidden; 	padding: 0 20px; 	background: url(http://www.loaditup.de/files/586887.jpg) no-repeat; }  #site_title { 	float: left; 	width: 250px; 	margin: 65px 0 0 50px; 	text-align: left; }  #site_title a { 	margin: 0px; 	padding: 0px; 	font-size: 36px; 	color: #252b2d; 	font-weight: bold; 	text-decoration: none; }  #site_title a span { 	display: block; 	font-size: 12px; 	color: #333; 	margin-top: 10px; }  #header_right { 	float: right; 	width: 500px; 	padding: 20px 30px 0; 	height: 190px; }  #header_right h1 { 	color: #000; 	font-size: 28px; 	margin: 0 0 15px 0; 	font-weight: bold; 	/* text-shadow: 1px 1px 3px #fff; */ 	text-align: right; }  #header_right p { 	color: #000; 	text-align: right; 	font-size: 18px; 	margin-bottom: 15px; }  #header_right a { font-size: 14px; font-weight: bold; text-decoration:  none; color: #000; } #header_right a span { font-size: 20px; }  #twitter a { 	display: block; 	float: right; 	padding: 25px 0 0 50px; 	color: #99eafc; 	height: 25px; 	font-size: 16px; 	margin-bottom: 35px; 	background: url(http://www.loaditup.de/files/586888.png) no-repeat  left; }  #twitter a:hover { 	color: #000; }  /* menu */  #templatemo_menu { 	clear: both; 	width: 940px; 	height: 80px; 	padding: 0 20px; 	background: url(http://www.loaditup.de/files/586889.jpg) no-repeat; }  #templatemo_menu ul { 	float: right; 	margin: 0; 	padding: 6px 35px; 	list-style: none; 	display: inline-block; }  #templatemo_menu ul li { 	padding: 0; 	margin: 0; 	display: inline-block; }  #templatemo_menu ul li a { 	float: left; 	display: block; 	font-size: 16px; 	width: 125px; 	height: 33px; 	padding-top: 12px; 	color: #99eafc;	 	text-decoration: none; 	font-weight: bold; 	text-align: center; 	outline: none; }  #templatemo_menu ul li a:hover, #templatemo_menu ul .current { 	color: #333; 	background: url(http://www.loaditup.de/files/586890.png) no-repeat  center top; }  /* end of menu */  /* content */  #content_wrapper { 	clear: both; 	width: 940px; 	padding: 20px; 	background: url(http://www.loaditup.de/files/586891.jpg) no-repeat top  center; }  #content_wrapper p { margin-bottom: 10px; }  #content_left { 	float: left; 	width: 440px; 	padding-right: 30px; 	background: url(http://www.loaditup.de/files/586892.jpg) repeat-y  right; }  #content_right { 	float: right; 	width: 440px; }  .content_box { 	padding-bottom: 30px; 	margin-bottom: 30px; 	background: url(http://www.loaditup.de/files/586895.jpg) bottom  repeat-x; }  .cb_last { 	padding-bottom: 0; 	margin-bottom: 0; 	background: none; }  #news_box { margin: 0; padding: 0; list-style: none; } #news_box li { margin-bottom: 10px; padding-bottom: 10px; border-bottom:  1px dashed #afbec5; } #news_box li .date { color: #a9e724; font-family: Arial, Helvetica,  sans-serif; font-size: 11px; } #news_box .last { margin-bottom: 0; padding: 0; border-bottom: none; } #news_box h6 { color: #0eb4fa; font-weight: bold; } #news_box h6:hover { text-decoration: underline; }  .news_page_box { clear: both; margin-bottom: 30px; padding-bottom: 30px;  background: url(http://www.loaditup.de/files/586896.jpg) bottom  repeat-x; } .news_page_box h2 { margin-bottom: 5px; } .news_page_box .news_meta { margin-bottom: 10px; } .news_page_box .image_wrapper img { width: 430px; height: 140px; }  #contact_form {  padding: 0; } #contact_form form { margin: 0px; padding: 0px; } #contact_form form .input_field { color: #fff; width: 300px; padding:  5px; padding: 10px; background: #141414; border: 1px solid #000000; } #contact_form form label { display: block; width: 100px; margin-right:  10px; font-size: 14px; }  #contact_form form textarea { font-family: Arial, Helvetica, sans-serif;  color: #fff; width: 428px;  height: 200px; padding: 10px; background:  #141414; border: 1px solid #000000; }  #contact_form form .submit_btn { color: #fff; padding: 10px 15px;  background: #141414; border: 1px solid #000000; }  /* end of content */  /* footer */  #templatemo_footer { 	clear: both; 	width: 900px; 	padding: 40px 30px 20px; 	color: #ccc; 	background: url(http://www.loaditup.de/files/586896.jpg) repeat-x top; }  .col_w300 { 	float: left; 	width: 260px; 	padding-right: 40px; }  #templatemo_footer h4 { 	color: #fff; 	margin-bottom: 10px; }  #templatemo_footer p { 	margin-bottom: 10px; }  #templatemo_footer ul { padding: 0; margin: 0; list-style: none; }  #templatemo_footer li { padding: 0; margin: 0 0 5px 0; }  #templatemo_footer li a { 	display: block; 	text-decoration: none; 	color: #fff; 	border-bottom: 1px dotted #ccc; }  #templatemo_footer li a:hover { 	color: #edae05; }  #templatemo_footer .last { 	padding-right: 0; }  /* end of footer*/  #templatemo_copyright { 	clear: both; 	width: 940px; 	padding: 10px 20px; 	text-align: center; 	color: #fff; }  #templatemo_copyright a { 	color: #fff; }  td[height="102"] { position:absolute; left:50%; margin-left:-384px; }

Und so geht´s

» Zuerst musst du dich in den Homepage-Baukasten einloggen.
» Dann klickst du auf "Design einstellen" und wählst dort das "CSS-Design - Nur für Profis geeignet" aus.
» Danach klickst du auf "Erweiterte Einstellungen" und fügst die Codes, die hier auf der Seite stehen, in die verschiedenen Felder "Text über dem Design" "Text unter dem Design" und "CSS-Code ohne Style Tags" ein.
» Danach speicherst du das Ganze ab und darfst dein neues Design bestaunen.

Download des Designs

» Hier kannst du das Paket des Designs kostenlos herunterladen. Darin enthalten sind die Bilder des Designs, der unbearbeitete Design-Code und die Live-Vorschau des Designs. Jetzt herunterladen.

Heute waren schon 32263 Besucher (105359 Hits) hier!

Award

Neuigkeiten

Aktuelles

Partner

» Partner Banner

jolerdi

Blue Candy