KREATiV -- Text I Foto I Design

Gratis bloggdesign - Valentine (kod+grafik)

Idag är det Alla Hjärtans Dag. Klart ni ska få en Valentine's bloggdesign då. Här kommer en blogglayout i kärlekens tecken. Varsågod.

Ett fungerande exempel på designen hittar du på valentine.

Radera allt i din stilmall och klistra in följande kod istället:

body { margin: 0px; padding:0px; background: #000 url(http://farm5.static.flickr.com/4025/4355376761_a096444f97_o.jpg) repeat-x; }  img{ border:none; }  img a{ border:0 none; }  a { color: #000; background-color:ffb0b0; text-decoration:none;} a:hover { color: #000; background-color:ff7373; text-decoration:underline;}  #wrapper { clear:none; margin: 30px auto; padding: 0px; width: 760px; background: transparent url(); border: 0; }  #wrapper:after { content: ".";  display: block;  height: 0;  clear: both;  visibility: hidden; }  p { padding: 0px 0px 0px 0px; margin: 0px 0px 0px 0px; }  #header { background: #0C0C0B url(http://farm3.static.flickr.com/2764/4353053905_e86d4a8a59_o.jpg) no-repeat top center; width: 760px; height: 524px; margin-bottom:25px; }  #side { float: right; width: 140px; margin: 15px 0px 0px 0px; padding: 200px 15px 15px 15px; background:#c30000 url(http://farm5.static.flickr.com/4036/4353701200_cc25d6065a_o.jpg) top center no-repeat; left:-30px; border: none; }  #content { overflow: hidden; width: 560px; position:relative; left:0px; voice-family:"\"}\""; voice-family:inherit; float: left; background-color:transparent; border: none; padding:0px; }  .entries { padding:10px; background:#c30000 url(http://farm5.static.flickr.com/4062/4352909581_9da91348c2_o.jpg) top right no-repeat; margin-bottom: 20px; margin-top:15px; }  #header a { color: #FFB0B0; background-color:transparent; text-decoration: none; padding: 5px 5px 0px 5px; }  #header a:hover { color:#fff; background-color:transparent; }  /* bloggtitel */ h1 { font-family: georgia, serif; font-style:italic; font-size: 24px; color: #FFB0B0; margin-top: 470px; margin-left: 100px; margin-bottom:0px; padding:0px; width:390px; float:left; }  /*bloggbeskrivning */ h2 { font-family: myriad, verdana, sans-serif; font-size: 12px; color: #000; background-color:#ffb0b0; margin-left: 100px; margin-top:5px; margin-bottom:10px; padding: 10px; width:390px; float:left; clear:left; }  .navheader { font-family:  myriad, Helvetica, Sans-serif; font-size: 12px; font-weight: bold; color: #000; background-color: transparent; padding:0px; margin-bottom:0px; text-transform: uppercase; border-bottom: 1px solid black; }  .nav { font-family: verdana, Arial, Helvetica, Sans-serif; font-size: 10px; font-weight: bold; color: #333; margin: 0px; }  .nav ul { margin: 5px 0px 5px 0px; padding: 0px; font-weight: normal; background-color: transparent; }  .nav li { list-style: none; padding: 0px 0px 5px 0px; font-weight: normal;	 }  .nav a { color: #ffb0b0; background-color:transparent; text-decoration:none;} .nav a:hover { color: #fff; background-color:transparent; text-decoration:none;}  /** Entry headers **/ h3 { font-family: myriad, "myriad pro", helvetica, verdana, arial, sans-serif; font-size: 26px; font-weight:300; color: #000; background: transparent; width:250px; margin:100px 200px 100px 100px; padding:5px; }  /** Post's body text **/ .entrybody { font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 12px; font-weight: normal; color: #000; line-height: 150%; margin:5px; padding:10px 10px 130px 10px; background:#fff; border-bottom: 1px solid #958557; }  .entrybody a { color: #000; background-color:#ffb0b0; text-decoration:none;} .entrybody a:hover { color: #000; background-color:#ff7373; text-decoration:none;}  /** 'Posted by' txt **/ .entrymeta { font-family: verdana, arial, sans-serif; font-size: 10px; font-weight: normal; color: #ff7373; text-align:right; clear: both; margin: 14px 0px 14px 12px border: none; padding-bottom:10px; }  .entrymeta a { color: #ffb0b0; background-color:transparent; text-decoration:none;} .entrymeta a:hover { color: #fff; background-color:transparent; text-decoration:none;}  .commentheader { font-family:  myriad, verdana, helvetica, sans-serif; font-size: 11px; font-weight: bold; background-color:#ff7373; padding:5px; color: #000; }  .commenttext { font-family: verdana, arial, sans-serif; font-size: 11px; font-weight: normal; color: #000; line-height: 130%; background-color:#fff; padding: 5px; }  .commentmeta { font-family: verdana, arial, sans-serif; font-size: 10px; font-weight: normal; color: #666; margin: 5px 0px 20px 0px }  .commentmeta a { color: #ffb0b0; background-color:transparent; text-decoration:none;} .commentmeta a:hover { color: #fff; background-color:transparent; text-decoration:none;}  .commentform { font-family: verdana, arial, sans-serif; font-size: 11px; font-weight: normal; color: #333333; margin: 0px 0px 20px 0px background-color:#ffb0b0; }  .separator { display:none; }  .default { font-family: Arial, Helvetica, Sans-serif; font-size: 11px; color: #ff7373; font-weight: bold; padding: 0px 0px 10px 0px; text-transform: uppercase; }  .subside { font-family: "Trebuchet MS" Verdana, Arial, Helvetica, Sans-serif; font-size: 11px; font-weight: normal; padding: 0px 0px 0px 0px; }   .xmlButton { border:1px solid; border-color:#FC9 #630 #330 #F96; padding:0 3px; font:bold 10px Verdana, Arial, Helvetica, Sans-serif; color:#FFF; background:#F60; text-decoration:none; margin:0; }  .image { border:none; }  .thumbnail { border: 2px solid #CCCCCC; background-color:#FFFFFF; padding:2px; margin: 0px 6px 6px 0px; }  .video{ padding: 0px 0px 0px 0px; }  .fieldName{ font-family: verdana, arial, sans-serif; font-size: 11px; margin: 0px 0px 12px 0px }  select{ font-family: verdana, arial, sans-serif; font-size: 11px; }  #calendar { color: #333333; font-family: 'Trebuchet MS', Verdana, sans-serif; padding: 0px; text-align: left; background-color: #FFFFFF; margin: 12px 0px 12px 0px; padding: 10px; }  #calendar table { padding: 1px; /*border-collapse: collapse;*/ border: 0px; }  #calendar table caption { color: #666666; font-family : Arial, Helvetica, Sans-serif; font-size : 0.7em; border-bottom: 1px solid #999999; text-align: left; font-weight: bold; text-transform: uppercase; padding: 3px; letter-spacing: .3em; }  #calendar table th { text-align: center; font-weight: bold; font-size: xx-small; }  #calendar table tr td { border: 1px solid #666666; text-align: center; font-size: xx-small; }  #calendar table tr ul  { color: #666666; list-style: dot; margin: 0px 0px 0px 20px; padding: 4 0 5 0; font-family : Verdana, Geneva, Arial, Helvetica, sans-serif; font-size : 0.7em;	 }  #calendar table tr td.cssDayMouseOver { border: 1px dotted red; cursor: hand; }  #calendar table tr td.cssDayMouseOut { border: 1px solid #666666; }  #calendar table tr td.cssEntryBox { border: 1px solid gray; padding: 6px; text-align: left; background: #FFFFFF; font-family : Verdana, Geneva, Arial, Helvetica, sans-serif; font-size : 0.8em; color: #666666; }  #calendar table tr td ul li { color: #666666; }  #calendar table tr td div.cssDayEntryHeader { font-family : Verdana, Geneva, Arial, Helvetica, sans-serif; font-size : 0.8em; text-align: left; font-weight: bold; padding: 4; }  #calendar table tr td div.cssDayAvailable { text-decoration: underline; text-weight: bold; }  form { padding: 10px; background-color: #ffb0b0; margin: 0px 0px 10px; }  #profile { font-family:  Verdana, Helvetica, Sans-serif; font-size: 11px; font-weight: normal; margin: 0px 0px 10px 0px; padding-left: 0px; text-align:center; }  #profile h4 { font-family:  Arial, Helvetica, Sans-serif; font-size: 12px; font-weight: bold; color: #000; background-color: #ff7373; padding:5px; margin-bottom:10px; text-transform: uppercase; text-align:left; }  #profile p{ }

Radera allt i din kodmall 'Framsida' och klistra in följande kod istället:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head>  <title>${BlogTitle} - ${BlogDescription}</title>  <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" />  <meta name="generator" content="${AppUrl}" />  <link rel="stylesheet" href="${BlogUrl}style.css" mce_href="/456233/entries/article/68930267/${BlogUrl}style.css" type="text/css" />  <link rel="alternate" href="${BlogUrl}index.rss" mce_href="/456233/entries/article/68930267/${BlogUrl}index.rss" type="application/rss+xml" title="RSS" />   <mce:script type="text/javascript" mce_src="http://static.blogg.se/public/js/script_blogg.js"></mce:script>   <mce:script type="text/javascript" mce_src="http://static.blogg.se/shared/js/script.js"></mce:script>  </head>  <body>  <div id="wrapper">   <div id="header">   <h1><a href="${BlogUrl}" mce_href="/456233/entries/article/68930267/${BlogUrl}">${BlogTitle}</a></h1>   <h2>${BlogDescription}</h2>  </div>   <div id="content"> <div id="content-inner">   <tag:entrylist limit="15">  <div class="entries">     <a name="a${EntryNum}"></a> <h3><a href="${EntryPermaLink}" mce_href="/456233/entries/article/68930267/${EntryPermaLink}">${EntryTitle}</a></h3>    <div class="entrybody">${EntryBody}</div>    <div class="entrymeta">     ${EntryDate} @ ${EntryTime}     <a href="${EntryPermaLink}" mce_href="/456233/entries/article/68930267/${EntryPermaLink}">Permalink</a>     <a href="${EntryCategoryLink}" mce_href="/456233/entries/article/68930267/${EntryCategoryLink}">${EntryCategoryName}</a>     <a href="${EntryPermaLink}#comment" mce_href="/456233/entries/article/68930267/${EntryPermaLink}#comment">Kommentarer (${EntryCommentCount})</a> 	<a href="${EntryPermaLink}#trackback" mce_href="/456233/entries/article/68930267/${EntryPermaLink}#trackback">Trackbacks (${EntryTrackbackCount})</a> 	<br /><br /> 	<tag:taglist title="Nyckelord: "> 		<a href="${TagURL}" mce_href="/456233/entries/article/68930267/${TagURL}" rel="tag">${TagName}</a> 	</tag:taglist>    </div>    <hr class="separator" /> </div>   </tag:entrylist>  </div> </div>   <div id="side"> <div id="side-inner">   <div id="profile"> 	<tag:profile> 		<tag:if test="${ProfileExists == 'true'}"> 			<h4>Om</h4> 			<a href="${AppUrl}index.bd?fa=pf.view&pf_id=${ProfileID}" mce_href="/456233/entries/article/68930267/${AppUrl}index.bd?fa=pf.view&pf_id=${ProfileID}"><img class="thumbnail" src="${AppUrl}shared/img/profiles/${ProfileImage}" mce_src="/456233/entries/article/68930267/${AppUrl}shared/img/profiles/${ProfileImage}" alt="Min profilbild" /></a> 			<p><a href="${AppUrl}index.bd?fa=pf.view&pf_id=${ProfileID}" mce_href="/456233/entries/article/68930267/${AppUrl}index.bd?fa=pf.view&pf_id=${ProfileID}"><span style="font-weight:bold" mce_style="font-weight:bold"> ${ProfileName}</span></a></p> 		</tag:if> 	</tag:profile>   </div>    <div class="nav"> 	<div class="navheader">Sök i bloggen</div> 	<form action="${AppUrl}index.bd?fa=search.do" name="search" method="post"> 		<input type="hidden" name="bl_id" value="${BlogID}" /> 		<input type="text" name="criteria" value="" size="12" maxlength="64" /> 		<input type="submit" value="Sök" /> 	</form>     <div class="navheader">Senaste inläggen</div>    <ul>        <tag:recentlist limit="20">      <li><a href="${EntryPermaLink}" mce_href="/456233/entries/article/68930267/${EntryPermaLink}">${EntryTitle}</a></li>        </tag:recentlist>    </ul>    <div class="navheader">Kategorier</div>    <ul>      <tag:categorylist>         <li><a href="${CategoryLink}" mce_href="/456233/entries/article/68930267/${CategoryLink}">${CategoryName}</a></li>        </tag:categorylist>    </ul>    <div class="navheader">Arkiv</div>    <ul>     <tag:archivelist>      <li><a href="${ArchiveLink}" mce_href="/456233/entries/article/68930267/${ArchiveLink}">${ArchiveName}</a></li>     </tag:archivelist>    </ul>    <tag:if test="${hasLinks == 'true'}">    <div class="navheader">Länkar</div>    <ul>     <tag:linklist>      <li><a href="${LinkURL}" mce_href="/456233/entries/article/68930267/${LinkURL}" title="${LinkDescription}">${LinkName}</a></li>     </tag:linklist>    </ul>    </tag:if>    <tag:if test="${hasBooks == 'true'}">    <div class="navheader">Böcker</div>    <ul>     <tag:booklist>      <li><a href="${BookUrl}" mce_href="/456233/entries/article/68930267/${BookUrl}"><img class="thumbnail" src="${BookImageSmall}" mce_src="/456233/entries/article/68930267/${BookImageSmall}" border="0" alt="${BookTitle}" title="${BookTitle}" /></a><br /><a href="${BookUrl}" mce_href="/456233/entries/article/68930267/${BookUrl}">${BookTitle}</a></li>     </tag:booklist>    </ul>    </tag:if>    <tag:if test="${hasMusic == 'true'}">    <div class="navheader">Musik</div>    <ul>     <tag:musiclist>      <li><a href="${MusicUrl}" mce_href="/456233/entries/article/68930267/${MusicUrl}"><img class="thumbnail" src="${MusicImageSmall}" mce_src="/456233/entries/article/68930267/${MusicImageSmall}" border="0" alt="${MusicTitle}" title="${MusicTitle}" /></a><br /><a href="${MusicUrl}" mce_href="/456233/entries/article/68930267/${MusicUrl}">${MusicTitle}</a></li>     </tag:musiclist>    </ul>    </tag:if>    <tag:if test="${hasMovies == 'true'}">    <div class="navheader">Filmer</div>    <ul>     <tag:movielist>      <li><a href="${MovieUrl}" mce_href="/456233/entries/article/68930267/${MovieUrl}"><img class="thumbnail" src="${MovieImageSmall}" mce_src="/456233/entries/article/68930267/${MovieImageSmall}" border="0" alt="${MovieTitle}" title="${MovieTitle}" /></a><br /><a href="${MovieUrl}" mce_href="/456233/entries/article/68930267/${MovieUrl}">${MovieTitle}</a></li>     </tag:movielist>    </ul>    </tag:if>   </div>   <div class="subside">    <a href="index.rss" mce_href="/456233/entries/article/68930267/index.rss" title="RSS"><img src="http://static.blogg.se/img/rss.gif" mce_src="http://static.blogg.se/img/rss.gif" border="0" alt="RSS 2.0" /></a>   </div>  </div> </div> </div>  <img src="http://stats.blogg.se/?id=${BlogID}" mce_src="http://stats.blogg.se/?id=${BlogID}" border="0" width="0" height="0" alt="" />  </body> </html>

Radera allt i din kodmall 'Kategorisida' och klistra in följande kod istället:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head>  <title>${BlogTitle} - ${PageTitle}</title>  <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" />  <meta name="generator" content="${AppUrl}" />  <link rel="stylesheet" href="${BlogUrl}style.css" mce_href="/456233/entries/article/68930267/${BlogUrl}style.css" type="text/css" />  <link rel="alternate" href="${BlogUrl}index.rss" mce_href="/456233/entries/article/68930267/${BlogUrl}index.rss" type="application/rss+xml" title="RSS 2.0" />  <mce:script type="text/javascript" mce_src="http://static.blogg.se/public/js/script_blogg.js"></mce:script>  <mce:script type="text/javascript" mce_src="http://static.blogg.se/shared/js/script.js"></mce:script> </head>  <body>  <div id="wrapper">   <div id="header">   <h1><a href="${BlogUrl}" mce_href="/456233/entries/article/68930267/${BlogUrl}">${BlogTitle}</a></h1>   <h2>${BlogDescription}</h2>  </div>   <div id="content">   <tag:entrylist limit="300"> <div class="entries">    <a name="a${EntryNum}"></a> <h3><a href="${EntryPermaLink}" mce_href="/456233/entries/article/68930267/${EntryPermaLink}">${EntryTitle}</a></h3>    <div class="entrybody">${EntryBody}</div>    <div class="entrymeta">     ${EntryDate} @ ${EntryTime}     <a href="${EntryPermaLink}" mce_href="/456233/entries/article/68930267/${EntryPermaLink}">Permalink</a>     <a href="${EntryCategoryLink}" mce_href="/456233/entries/article/68930267/${EntryCategoryLink}">${EntryCategoryName}</a>     <a href="${EntryPermaLink}#comment" mce_href="/456233/entries/article/68930267/${EntryPermaLink}#comment">Kommentarer (${EntryCommentCount})</a> 	<a href="${EntryPermaLink}#trackback" mce_href="/456233/entries/article/68930267/${EntryPermaLink}#trackback">Trackbacks (${EntryTrackbackCount})</a> 	<br /><br /> 	<tag:taglist title="Nyckelord: "> 		<a href="${TagURL}" mce_href="/456233/entries/article/68930267/${TagURL}" rel="tag">${TagName}</a> 	</tag:taglist>    </div>    <hr class="separator" />      {% if loop.last and pagination %}   <div style="text-align: center; font-size: 12px" mce_style="text-align: center; font-size: 12px">     {% if pagination.page_number != 1 %}       <a style="padding-right: 30px" mce_style="padding-right: 30px" href="{{ category.slug }}-{{ pagination.page_number - 1 }}.html" mce_href="/456233/entries/article/68930267/{{ category.slug }}-{{ pagination.page_number - 1 }}.html">Tidigare inlägg</a>     {% endif %}     {% if pagination.page_number not in (pagination.total_pages, pagination.total_pages - 1) %}       <a href="{{ category.slug }}-{{ pagination.page_number + 1 }}.html" mce_href="/456233/entries/article/68930267/{{ category.slug }}-{{ pagination.page_number + 1 }}.html">Nyare inlägg</a>     {% endif %}     {% if pagination.page_number == pagination.total_pages - 1 %}       <a href="{{ category.slug }}.html" mce_href="/456233/entries/article/68930267/{{ category.slug }}.html">Nyare inlägg</a>     {% endif %}   </div>   {% endif %} </div> </tag:entrylist>  </div>   <div id="side">    <div class="nav"> 	<ul> 		<li><a href="index.html" mce_href="/456233/entries/article/68930267/index.html" title="Gå till startsidan"><b>Till bloggens startsida</b></a></li> 	</ul> 	<div class="navheader">Sök i bloggen</div> 	<form action="${AppUrl}index.bd?fa=search.do" name="search" method="post"> 		<input type="hidden" name="bl_id" value="${BlogID}" /> 		<input type="text" name="criteria" value="" size="12" maxlength="64" /> 		<input type="submit" value="Sök" /> 	</form>    <div class="navheader">Senaste inläggen</div>    <ul>        <tag:recentlist limit="20">          <li><a href="${EntryPermaLink}" mce_href="/456233/entries/article/68930267/${EntryPermaLink}">${EntryTitle}</a></li>        </tag:recentlist>    </ul>    <div class="navheader">Kategorier</div>    <ul>      <tag:categorylist>         <li><a href="${CategoryLink}" mce_href="/456233/entries/article/68930267/${CategoryLink}">${CategoryName}</a></li>        </tag:categorylist>    </ul>    <div class="navheader">Arkiv</div>    <ul>     <tag:archivelist>      <li><a href="${ArchiveLink}" mce_href="/456233/entries/article/68930267/${ArchiveLink}">${ArchiveName}</a></li>     </tag:archivelist>    </ul>    <tag:if test="${hasLinks == 'true'}">    <div class="navheader">Länkar</div>    <ul>     <tag:linklist>     <li><a href="${LinkURL}" mce_href="/456233/entries/article/68930267/${LinkURL}" title="${LinkDescription}">${LinkName}</a></li>     </tag:linklist>    </ul>    </tag:if>   </div>    <div class="subside">     <a href="index.rss" mce_href="/456233/entries/article/68930267/index.rss" title="RSS"><img src="http://static.blogg.se/img/rss.gif" mce_src="http://static.blogg.se/img/rss.gif" border="0" alt="RSS 2.0" /></a>   </div>   </div>  </div>  <img src="http://stats.blogg.se/?id=${BlogID}" mce_src="http://stats.blogg.se/?id=${BlogID}" border="0" width="0" height="0" alt="" />  </body> </html>

Radera allt i din kodmall 'Arkivsida' och klistra in följande kod istället:

För sista kodmallen 'Inläggssida' blir det lite klippa och klistra. Leta reda på koden <div id="content">
direkt nedanför detta klistrar du in <div class="entries"> Leta sedan reda på koden </tag:entry> en bit nedanför
direkt nedanför detta klistrar du in </div>

Allt innehåll, om inte annat framgår, är © Terese Mörtvik.
Foton, grafik, eller texter får inte användas utan mitt tillstånd.
Vid användning med tillstånd länka alltid tillbaka till bloggen.

2010-02-14 @ 13:06:05 DESIGN Blogglayout Trackbacks () Permalink Tillbaka till sidans topp

(1)

Innan du kommenterar kan det vara bra att veta några saker.

Jag gör inga gratisdesigner annat än vad som läggs ut på bloggen.
Om det står exempelvis "gratis design" i ett inlägg är det bara att ta för sig. Du behöver inte fråga om lov, men jag förväntar mig cred/länk i ett inlägg på din blogg. Om det inte står någonstans att du får ta bilden, designen osv så är det "se, men inte röra" som gäller.
Jag läser bara bloggar jag är intresserad av och vill alltså inte utbyta Bloglovin-prenumerationer.
Reklam och spam raderas.

tellan säger:

tog denna design

2010-03-25 @ 00:00:35
URL: http://tellans.blogg.se/

Trackback

KREATiV -- Text I Foto I Design

I min blogg finns det mycket bilder, mycket personligt och mycket kreativitet. Foto, bloggdesign, texter, poesi, grafik, kläder, smink, och annat skoj. Kom och kika in en sväng. Kanske hittar du något du kan ta med dig hem.

Gratis bloggdesign - Valentine (kod+grafik)

Innan du kommenterar kan det vara bra att veta några saker.

Kommentera inlägget här:

Senaste

Kategorier

Arkiv

Länkar

Terese Mörtvik