HTML-er til blogg design

 

Jeg har funnet noen sider der dere kan få litt hjelp med designene deres

de er veldig brae og dere ser hvor jeg har tatt linkene fra. Jeg stjeler ikke , jeg bare "låner" jeg anbefaler bra sider til dere, til dere som trenger hjelp og inspirasjon. Det er ferdig design der og på den bloggen.

 

http://www.nerdie.me/design/grafikk/bakgrunner/  <----- Bakrunner

http://www.nerdie.me/design/grafikk/klokker/ <...... Klokker

http://www.nerdie.me/design/grafikk/pekere/ <,-----, Pekere

http://www.nerdie.me/design/grafikk/favicons/ <------- isteden for B - for blogg på URL linjen

http://www.nerdie.me/design/guider/ <----- Photoshop guide

http://www.nerdie.me/design/blogg/html-og-css/

 


Ingen kommentarer

Sukkersøt - Designe mitt

#626262; font-weight: normal; font-style: normal; letter-spacing: 0px; padding-top: 0px; padding-right: 5px; padding-bottom: 5px; padding-left: 0px; margin-bottom: -20px; margin-top: 0px; line-height: 30px;"> 

#626262; font-weight: normal; font-style: normal; letter-spacing: 0px; padding-top: 0px; padding-right: 5px; padding-bottom: 5px; padding-left: 0px; margin-bottom: -20px; margin-top: 0px; line-height: 30px;">Gratis design #3 - Sukkersøtt

Det er helt greit hvis du fikser litt på kodene, men det er IKKE lov til å fjerne linken der det står at jeg har laget det!

HEADER-STØRRELSE: 331px i høyden og 707px i bredden (du MÅ ha en header i denne størrelsen ellers blir det ikke noe fint..)

STØRRELSE PÅ BILDER I INNLEGG: 700px.


STILSETTET = design > rediger > ta vekk alle kodene som står der fra før av, og lim inn dette:

body {
background-image: url(http://bloggfiler.no/cmndesign.blogg.no/images/1018151-7-1301226323165.jpg);
background-attachment: fixed;
}
a { color: #8a8a8a; text-decoration: none;}
a:link { color: #8a8a8a; text-decoration: none;}
a:visited { color: #8a8a8a; text-decoration: none;}
a:active { color: #8a8a8a; text-decoration: none;}
a:hover {color: #EDD8D8; text-decoration: none;}
#wrapper {
clear: none;
margin-left: auto;
margin-right: auto;
width: 1000px;
background-color: #transparent;
}
#wrapper:after {
content: ".";
display: block;
height: 0;
clear: both;
visibility: hidden;
}
#header {
background: url("images/header.png") no-repeat scroll 0 0 transparent;
background-image: url(http://i55.tinypic.com/28u1sav.png);
background-repeat-x: no-repeat;
background-repeat-y: no-repeat;
background-attachment: scroll;
background-position-x: 0px;
background-position-y: 0px;
background-origin: initial;
background-clip: initial;
background-color: transparent;
height: 392px;
padding-bottom: 0;
width: 749px;
}
#header img {
margin: 22px 0px 0px 21px;
height: 331px;
width: 707px;
}
#side {
float: right;
background-color: #ffffff;
font-family: times;
font-size: 11px;
color: #7E7E7E;
padding: 10px;
line-height: 155%;
background: url("images/bgdrop.png") repeat scroll 0 0 transparent;
background-image: url(http://tescho.se/wp-content/themes/teschopersika/images/bgdrop.png);
background-repeat-x: repeat;
background-repeat-y: repeat;
background-attachment: scroll;
background-position-x: 0px;
background-position-y: 0px;
background-origin: initial;
background-clip: initial;
background-color: transparent;
margin-top: -300px;
margin-left: 760px;
padding-left: 10px;
position: absolute;
width: 175px;
}
#content {
overflow: hidden;
float: left;
width: 709px;
padding: 20px;
line-height: 150%;
background-color: #ffffff;
}
h1 {
font-family: times;
font-size: 14px;
text-transform:uppercase;
margin: 0px;
padding: 0px;
height: 30px;
}
h2 {
color: #EDD8D8;
font-family: times;
font-size: 12px;
font-weight: bold;
text-transform: uppercase;
margin-bottom: -14px;
margin-top: 0px;
padding-bottom: 0px;
line-height: 140%;
}
/** Entry headers **/
h3 {
font-family: georgia;
font-size: 20px;
color: #626262;
text-transform: normal;
font-weight: normal;
font-style: normal;
letter-spacing: 0px;
padding: 0px 5px 5px 0px;
margin-bottom: -20px;
margin-top: 0px;
line-height: 150%;
}
.navheader {
font-family: times;
font-size: 12px;
color: #a8a8a8;
padding:0px 0px 0px;
margin-bottom:0px;
text-transform: uppercase;
line-height: 150%;
}
.nav {
font-family: times;
font-size: 12px;
font-weight: normal;
font-color: #a8a8a8;
margin: 0px;
line-height: 150%;
}
.nav ul {
margin: 0px 0px 12px;
padding: 0px 0px 0px;
font-weight: normal;
line-height: 150%;
}
.nav li {
list-style: underline;
padding: 0px 0px 0px 0px;
font-weight: normal;
color: #FFFFFF;
}
.nav a {
color: #a8a8a8;
text-decoration:underline;
}
.nav a:hover {
text-decoration: underline;
}
/** Post's body text **/
.entrybody {
font-family: times;
font-size: 13px;
font-weight: normal;
letter-spacing: 0px;
text-align: left;
color: #7E7E7E;
line-height: 150%;
margin: 0px 0px 10px 0px;
padding: 10px 0px 10px 0px;
}
/** 'Posted by' txt **/
.entrymeta {
font-family: georgia;
font-size: 11px;
font-weight: normal;
text-transform: normal;
color: #8a8a8a;
text-align: left;
letter-spacing: 1px;
line-height: 150%;
margin: 0px;
}
.entrymeta a { color: #8a8a8a; }
.entrymeta a:hover { color: #d8c6cb; text-decoration: none;}
.commentheader {
font-family: times;
font-size: 12px;
font-weight: normal;
letter-spacing: 0px;
color: #EDD8D8;
line-height: 150%;
margin: 10px 10px 10px 15px;
}
.commenttext {
font-family: times;
font-size: 12px;
font-weight: normal;
color: #626262;
line-height: 150%;
margin: 10px 10px 0px 0px;
}
.commentmeta {
font-family: times;
font-size: 11px;
font-weight: normal;
color: #626262;
margin: 10px 10px 10px 0px;
padding-bottom: 10px;
line-height: 150%;
border-bottom: 1px dotted #eeeeee;
}
.commentmeta a { color: #7e7e77; }
.commentmeta a:hover { color: #EDD8D8; text-decoration: none}
.commentform {
font-family: times;
font-size: 12px;
text-transform: normal;
font-weight: normal;
color: #626262;
margin: 10px 10px 20px 15px;
line-height: 150%;
}
#navbar {
padding: 5px;
height: 1em;
width: auto;
margin: 0px;
text-align: center;
}
#navbar li {
float: left;
list-style: none;
width: 150px;
background-color: #ffffff;
}
#navbar li a {
padding: 5px;
display: block;
border-bottom: 0px dashed #F7D7EE;
color: #454343;
text-decoration: none;
font-family: times;
font-size: 10px;
line-height: 12px;
}
#navbar li ul {
padding: 5px;
display: none;
width: em;
background-color: #ffffff;
}
#navbar li:hover ul, #navbar li.hover ul {
display: block;
position: absolute;
margin: 0;
padding: 0;
z-index: 1;
text-align: left;
}
#navbar li:hover li, #navbar li.hover li {
float: none;
}
#navbar li:hover li a, #navbar li.hover li a {
border-bottom: 0px dotted #ffc0c0;
color: #454343;
}
#navbar li li a:hover {
background-color: #ffffff;
}
.entrymeta date {
text-align: left;
position: relative;
color: #646464;
font-weight: normal;
font-size: 9px;
margin-left: 4px;
letter-spacing: 1px;
font-family: arial;
text-transform: uppercase;
}
.entrymeta comment {
text-align: left;
position: relative;
color: #646464;
font-weight: normal;
font-size: 9px;
letter-spacing: 1px;
font-family: arial;
text-transform: uppercase;
}

 

 

FORSIDE-MAL, KATEGORI-MAL & ARKIV-MAL = design > rediger > maler > forsiden/kategorier/arkiv > ta vekk alle kodene som står der fra før av, og lim inn dette:

<!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" type="text/css" />
<link rel="alternate" href="${BlogUrl}index.rss" type="application/rss+xml" title="RSS" />
<link rel="shortcut icon" href="http://thingsyouremember.blogg.se/design/images/2010/heeart_100769151.png" type="image/gif"/><script type="text/javascript" src="http://static.blogg.se/public/js/script_blogg.js"></script>
<script type="text/javascript" src="http://static.blogg.se/shared/js/script.js"></script>
</head>
<body>
<div id="wrapper">
<div id="header" onclick="document.location='${BlogUrl}';">
<img src="http://i56.tinypic.com/992cnb.png" border="0" alt="heart">
</div>
<div id="content">
<tag:entrylist limit="30">
<a name="a${EntryNum}"></a>
<div class="entrymeta"><date>${EntryDate}, ${EntryTime}</date></div>
<h3><em><a href="${EntryPermaLink}">${EntryTitle}</a></h3></em>
<div class="entrybody">${EntryBody}</div>
<div class="entrymeta">
<comment><a href="${EntryPermaLink}#comment">${EntryCommentCount} kommentarer </a></comment>
<br/><br/>
<a title="Caroline Maria on Bloglovin" href="http://www.bloglovin.com/en/blog/564385/caroline-maria/follow"><img alt="bloglovin" border="0" src="http://www.bloglovin.com/widget/bilder/widget_plus.gif" /></a><a title="Caroline Maria on Bloglovin" href="http://www.bloglovin.com/en/blog/564385/caroline-maria/follow"><img alt="bloglovin" border="0" src="http://www.bloglovin.com/widget/bilder/widget_plus.gif" /></a><a title="Caroline Maria on Bloglovin" href="http://www.bloglovin.com/en/blog/564385/caroline-maria/follow"><img alt="bloglovin" border="0" src="http://www.bloglovin.com/widget/bilder/widget_plus.gif" /></a><br/><br/><br/><br/><br/>
</div>
</tag:entrylist>
</div>
<div id="side">
<a href="${ProfileUrl}" title="${ProfileName}">
<img src="http://bloggfiler.no/cmndesign.blogg.no/images/1018151-9-1298222769350.jpg" width="170" border="0" alt="${ProfileName}"></a>
<br><br>
<!--Skriv hva bloggen din handler om her--!>
her kan du skrive hva du heter, hvor gammel du er og hva bloggen din handler om. min offisielle blogg kan du finne <a href="http://www.carolinemaria.blogg.no">her</a>.
<br><br>
<h2>arkiv</h2>
<tag:archivelist limit="12">
<br/><a href="${ArchiveLink}"mce_href="/922173/entries/article/73622744/
${ArchiveLink}">${ArchiveName}</a></tag:archivelist><br/><br/>
<h2>kategorier</h2>
<tag:categorylist>
<br/><a href="${CategoryLink}" mce_href="/922173/entries/article/73622744/ ${CategoryLink}">${CategoryName}</a></tag:categorylist><br/><br/>
<h2>favoritter</h2>
<tag:linklist>
<br><a href="${LinkURL}">${LinkName}</a></tag:linklist>
<br><br>
<h2>designet er laget av:</h2><br/>
<a href="http://carolinemaria.blogg.no" target="_blank">caroline maria</a>
<a title="Caroline Maria on Bloglovin" href="http://www.bloglovin.com/en/blog/564385/caroline-maria/follow"><img alt="bloglovin" border="0" src="http://www.bloglovin.com/widget/bilder/widget_plus.gif" /></a>
<br><br>
</div>
</div>
</div>
</body>
</html>

 

INNLEGG-MAL = design > rediger > maler > innlegg > ta vekk alle kodene som står der fra før av, og lim inn dette:

<!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" type="text/css" />
<script type="text/javascript" src="http://static.blogg.se/public/js/script_blogg.js"></script>
<script type="text/javascript" src="http://static.blogg.se/shared/js/script.js"></script>
<script type="text/javascript" src="http://static.blogg.se/shared/js/comments.js"></script>
</head>
<body>
<div id="wrapper">
<div id="header" onclick="document.location='${BlogUrl}';">
<img src="http://i56.tinypic.com/992cnb.png" border="0" alt="heart">
</div>
<div id="content">
<tag:entry>
<a name="a${EntryNum}"></a>
<div class="entrymeta"><date>${EntryDate}, ${EntryTime}</date></div>
<h3><em>${EntryTitle}</em></h3>
<div class="entrybody">${EntryBody}</div>
<div class="entrymeta">
</div>
</tag:entry>
<!-- Display comments and form if this entry allows comments -->
<tag:if test="${Comments == 1}">
<a name="comment" /><br>
&nbsp&nbsp<font face="times new roman"><font size="3"><font color="#7e7e77">${EntryCommentCount} kommentarer på "${EntryTitle}"</font><br><br></font></font>
<tag:commentlist>
<div class="commentheader">
<b>Postet av: ${CommentAuthor}</b>
<div class="commenttext">${CommentText}</div>
<div class="commentmeta">
${CommentDate}, ${CommentTime}<br/>
<tag:if test="${CommentAuthorURL != ''}">
<em>URL: <a href="${CommentAuthorURL}">${CommentAuthorURL}</a></font></font></font></em>
<tag:if test="${CommentAuthorEmail != ''}">
<br />E-post: <a href="mailto:${CommentAuthorEmail}">${CommentAuthorEmail}</a><br/><br/>
</tag:if>
</tag:if>
</div>
</div>
</tag:commentlist>
<form class="commentform" action="${AppUrl}index.bd?fa=comment.insert" name="commentForm" method="post" onsubmit="doSubmit(this)">
<input type="hidden" name="commentid" value="${CommentID}" />
<br />
<font color="#e8cfc9"><font face="times new roman"><font size="3">Legg igjen en kommentar:</font><br/><br/>
</font></font>
Navn: <br />
<input type="text" name="author" onchange="doChange(this)" value="" size="42" maxlength="255" />
<input name="remember" onclick="doCheck(this)" type="checkbox" value="1" id="remember" /> Husk meg?<br />
E-post:<br />
<input type="text" name="authoremail" onchange="doChange(this)" value="" size="42" maxlength="255" />
<br />
Bloggadresse: <br />
<input type="text" name="authorurl" onchange="doChange(this)" value="http://" size="42" maxlength="255" />
<br />
Kommentar: <br />
<textarea name="comment" onchange="doChange(this)" cols="52" rows="7"></textarea>
<br />
<a title="Caroline Maria on Bloglovin" href="http://www.bloglovin.com/en/blog/564385/caroline-maria/follow"><img alt="bloglovin" border="0" src="http://www.bloglovin.com/widget/bilder/widget_plus.gif" /></a> <a title="Caroline Maria on Bloglovin" href="http://www.bloglovin.com/en/blog/564385/caroline-maria/follow"><img alt="bloglovin" border="0" src="http://www.bloglovin.com/widget/bilder/widget_plus.gif" /></a> <a title="Caroline Maria on Bloglovin" href="http://www.bloglovin.com/en/blog/564385/caroline-maria/follow"><img alt="bloglovin" border="0" src="http://www.bloglovin.com/widget/bilder/widget_plus.gif" /></a> <a title="Caroline Maria on Bloglovin" href="http://www.bloglovin.com/en/blog/564385/caroline-maria/follow"><img alt="bloglovin" border="0" src="http://www.bloglovin.com/widget/bilder/widget_plus.gif" /></a> <a title="Caroline Maria on Bloglovin" href="http://www.bloglovin.com/en/blog/564385/caroline-maria/follow"><img alt="bloglovin" border="0" src="http://www.bloglovin.com/widget/bilder/widget_plus.gif" /></a> <a title="Caroline Maria on Bloglovin" href="http://www.bloglovin.com/en/blog/564385/caroline-maria/follow"><img alt="bloglovin" border="0" src="http://www.bloglovin.com/widget/bilder/widget_plus.gif" /></a> <a title="Caroline Maria on Bloglovin" href="http://www.bloglovin.com/en/blog/564385/caroline-maria/follow"><img alt="bloglovin" border="0" src="http://www.bloglovin.com/widget/bilder/widget_plus.gif" /></a> <a title="Caroline Maria on Bloglovin" href="http://www.bloglovin.com/en/blog/564385/caroline-maria/follow"><img alt="bloglovin" border="0" src="http://www.bloglovin.com/widget/bilder/widget_plus.gif" /></a> <a title="Caroline Maria on Bloglovin" href="http://www.bloglovin.com/en/blog/564385/caroline-maria/follow"><img alt="bloglovin" border="0" src="http://www.bloglovin.com/widget/bilder/widget_plus.gif" /></a> <a title="Caroline Maria on Bloglovin" href="http://www.bloglovin.com/en/blog/564385/caroline-maria/follow"><img alt="bloglovin" border="0" src="http://www.bloglovin.com/widget/bilder/widget_plus.gif" /></a>
<br/>
<input class="formbutton" type="submit" name="submit" value="Tusen takk for kommentaren!" />
Designet er laget av <a href="http://carolinemaria.blogg.no" target="_blank">CAROLINE MARIA</a><br/>
</form>
</tag:if>
</div>
<div id="side">
<a href="${ProfileUrl}" title="${ProfileName}">
<img src="http://i56.tinypic.com/vrggsi.jpg" width="170" border="0" alt="${ProfileName}"></a>
<br><br>
<!--Skriv hva bloggen din handler om her--!>
her kan du skrive hva du heter, hvor gammel du er og hva bloggen din handler om. min offisielle blogg kan du finne <a href="http://www.carolinemaria.blogg.no">her</a>.
<br><br>
<h2>arkiv</h2>
<tag:archivelist limit="12">
<br/><a href="${ArchiveLink}"mce_href="/922173/entries/article/73622744/
${ArchiveLink}">${ArchiveName}</a></tag:archivelist><br/><br/>
<h2>kategorier</h2>
<tag:categorylist>
<br/><a href="${CategoryLink}" mce_href="/922173/entries/article/73622744/ ${CategoryLink}">${CategoryName}</a></tag:categorylist><br/><br/>
<h2>favoritter</h2>
<tag:linklist>
<br><a href="${LinkURL}">${LinkName}</a></tag:linklist>
<br><br>
<h2>designet er laget av:</h2><br/>
<a href="http://carolinemaria.blogg.no" target="_blank">caroline maria</a>
<a title="Caroline Maria on Bloglovin" href="http://www.bloglovin.com/en/blog/564385/caroline-maria/follow"><img alt="bloglovin" border="0" src="http://www.bloglovin.com/widget/bilder/widget_plus.gif" /></a>
<br><br>
</div>
</div>
</div>
</body>
</html>

 


Les hvordan du endrer header #8a8a8a; text-decoration: none;" href="http://cmndesign.blogg.no/1301217730_slik_endrer_du_header.html" target="_blank">her.

Les hvordan du endrer teksten i sidebaren #8a8a8a; text-decoration: none;" href="http://cmndesign.blogg.no/1293977319_endre_teksten_i_sideb.html" target="_blank">her.

Les hvordan du endrer profilbilde #8a8a8a; text-decoration: none;" href="http://cmndesign.blogg.no/1296239421_endre_profilbilde_i_g.html" target="_blank">her.

Les hvordan du endrer bakgrunnen #8a8a8a; text-decoration: none;" href="http://cmndesign.blogg.no/1301226547_endre_bakgrunn_p_grat.html" target="_blank">her.

 

Her er den jeg har brukt , her kan dere og ta den ♥


2 kommentarer



Her kan du skrive litt om deg selv og hva bloggen din handler om.




hits