Bloggdesign - Rundat & Blommigt

2011-09-14 15:57:00
Kodmall - Framsida:

<!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" />
<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">
<h1><a href="${BlogUrl}">${BlogTitle}</a></h1>
<h2>${BlogDescription}</h2>
</div>

<div id="content">
<tag:entrylist limit="15">
<a name="a${EntryNum}"></a>
<h3>${EntryTitle}</h3>     
<h7>${EntryDate} ${EntryTime}</h7>
<div>${EntryBody}</div>
<div>
<a href="${EntryCategoryLink}">${EntryCategoryName}</a>
<a href="${EntryPermaLink}#comment"> ${EntryCommentCount} Kommentarer</a>

<br /><br />
<tag:taglist title="Nyckelord: ">
<a href="${TagURL}" rel="tag">${TagName}</a>
</tag:taglist>
</div>
<hr />
</tag:entrylist>
</div>



<div id="sidebar">


<div id="profile">
<tag:profile>
<tag:if test="${ProfileExists == 'true'}">
<h4>Om</h4>
<a href="${AppUrl}index.bd?fa=pf.view&amp;pf_id=${ProfileID}"><img src="${AppUrl}shared/img/profiles/${ProfileImage}" alt="Min profilbild" /></a>
<p><a href="${AppUrl}index.bd?fa=pf.view&amp;pf_id=${ProfileID}"><span style="font-weight:bold"> ${ProfileName}</span></a></p>
</tag:if>
</tag:profile>
</div>

<div>
<div>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>Senaste inläggen</div>
<ul>
<tag:recentlist limit="20">
<li><a href="${EntryPermaLink}">${EntryTitle}</a></li>
</tag:recentlist>
</ul>
<div>Kategorier</div>
<ul>
<tag:categorylist>
<li><a href="${CategoryLink}">${CategoryName}</a></li>
</tag:categorylist>
</ul>
<div>Arkiv</div>
<ul>
<tag:archivelist>
<li><a href="${ArchiveLink}">${ArchiveName}</a></li>
</tag:archivelist>
</ul>

</div>
</div>

<div style="clear: both; line-height: 1px; font-size: 1px;">&nbsp;</div>

</div>

<img src="http://stats.blogg.se/?id=${BlogID}" border="0" width="0" height="0" alt="" />

</body>
</html>


Kodmall - Inläggsida:

<!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">
<h1><a href="${BlogUrl}">${BlogTitle}</a></h1>
<h2>${BlogDescription}</h2>
</div>


<div id="content">

<tag:entry>
<a name="a${EntryNum}"></a>
<h3>${EntryTitle}</h3>
<h7>${EntryDate}  ${EntryTime}</h7>
<div>${EntryBody}</div>
<div>

<a href="${EntryCategoryLink}">${EntryCategoryName}</a>
<br /><br />
<tag:taglist title="Nyckelord: ">
<a href="${TagURL}" rel="tag">${TagName}</a>
</tag:taglist>
</div>
</tag:entry>

<!-- Display comments and form if this entry allows comments -->
<tag:if test="${Comments == 1}">

<hr />

<a name="comment"></a>

<div>Kommentarer </div>

<tag:commentlist>
<div>
Postat av: ${CommentAuthor}
</div>
<p>${CommentText}</p>
<div>
${CommentDate}  ${CommentTime}
<!-- If comment author has written her / his e-mail address -->
<tag:if test="${CommentAuthorEmail != ''}">
<br />E-postadress: <a href="mailto:${CommentAuthorEmail}">${CommentAuthorEmail}</a>
</tag:if>
<!-- If comment author has written her / his URL -->
<tag:if test="${CommentAuthorURL != ''}">
<br />URL: <a href="${CommentAuthorURL}">${CommentAuthorURL}</a>
</tag:if>
</div>
</tag:commentlist>

<form action="${AppUrl}index.bd?fa=comment.insert" name="commentForm" method="post" onsubmit="doSubmit(this)">
<input type="hidden" name="commentid" value="${CommentID}" />
<br />
<strong>Kommentera inlägget här:</strong> <br /> <br />
Namn: <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" /> Kom ihåg mig?<br />
<br />
E-postadress: (publiceras ej)<br />
<input type="text" name="authoremail" onchange="doChange(this)" value="" size="42" maxlength="255" />
<br />
URL/Bloggadress: <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 />
<input type="submit" name="submit" value="Skicka kommentar" />
</form>

</tag:if>


</div>

<div id="sidebar">


<div id="profile">
<tag:profile>
<tag:if test="${ProfileExists == 'true'}">
<h4>Om</h4>
<a href="${AppUrl}index.bd?fa=pf.view&amp;pf_id=${ProfileID}"><img src="${AppUrl}shared/img/profiles/${ProfileImage}" alt="Min profilbild" /></a>
<p><a href="${AppUrl}index.bd?fa=pf.view&amp;pf_id=${ProfileID}"><span style="font-weight:bold"> ${ProfileName}</span></a></p>
</tag:if>
</tag:profile>
</div>

<div>
<div>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>Senaste inläggen</div>
<ul>
<tag:recentlist limit="20">
<li><a href="${EntryPermaLink}">${EntryTitle}</a></li>
</tag:recentlist>
</ul>
<div>Kategorier</div>
<ul>
<tag:categorylist>
<li><a href="${CategoryLink}">${CategoryName}</a></li>
</tag:categorylist>
</ul>
<div>Arkiv</div>
<ul>
<tag:archivelist>
<li><a href="${ArchiveLink}">${ArchiveName}</a></li>
</tag:archivelist>
</ul>

</div>
</div>

<div style="clear: both; line-height: 1px; font-size: 1px;">&nbsp;</div>

</div>

<img src="http://stats.blogg.se/?id=${BlogID}" border="0" width="0" height="0" alt="" />

</body>
</html>


Kodmall - Kategorisida:

<!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" />
<link rel="alternate" href="${BlogUrl}index.rss" type="application/rss+xml" title="RSS 2.0" />
<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">
<h1><a href="${BlogUrl}">${BlogTitle}</a></h1>
<h2>${BlogDescription}</h2>
</div>

<div id="content">
<tag:entrylist limit="50">
<a name="a${EntryNum}"></a>
<h3>${EntryTitle}</h3>
<h7>${EntryDate}  ${EntryTime}</h7>
<div>${EntryBody}</div>
<div>
<a href="${EntryCategoryLink}">${EntryCategoryName}</a>
<a href="${EntryPermaLink}#comment">${EntryCommentCount} Kommentarer </a>
<br /><br />
<tag:taglist title="Nyckelord: ">
<a href="${TagURL}" rel="tag">${TagName}</a>
</tag:taglist>
</div>
<hr />

{% if loop.last and pagination %}
<div style="text-align: center; font-size: 12px">
{% if pagination.page_number != 1 %}
<a style="padding-right: 30px" href="{{ 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">Nyare inlägg</a>
{% endif %}
{% if pagination.page_number == pagination.total_pages - 1 %}
<a href="{{ category.slug }}.html">Nyare inlägg</a>
{% endif %}
</div>
{% endif %}
</tag:entrylist>
</div>

<div id="sidebar">

<div>

<div>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>Senaste inläggen</div>
<ul>
<tag:recentlist limit="50">
<li><a href="${EntryPermaLink}">${EntryTitle}</a></li>
</tag:recentlist>
</ul>
<div>Kategorier</div>
<ul>
<tag:categorylist>
<li><a href="${CategoryLink}">${CategoryName}</a></li>
</tag:categorylist>
</ul>
<div>Arkiv</div>
<ul>
<tag:archivelist>
<li><a href="${ArchiveLink}">${ArchiveName}</a></li>
</tag:archivelist>
</ul>
<tag:if test="${hasLinks == 'true'}">
<div>Länkar</div>
<ul>
<tag:linklist>
<li><a href="${LinkURL}" title="${LinkDescription}">${LinkName}</a></li>
</tag:linklist>
</ul>
</tag:if>
</div>



</div>

<div style="clear: both; line-height: 1px; font-size: 1px;">&nbsp;</div>

</div>

<img src="http://stats.blogg.se/?id=${BlogID}" border="0" width="0" height="0" alt="" />

</body>
</html>


Kodmall - Arkivsida:


<!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" />
<link rel="alternate" href="${BlogUrl}index.rss" type="application/rss+xml" title="RSS 2.0" />
<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">
<h1><a href="${BlogUrl}">${BlogTitle}</a></h1>
<h2>${BlogDescription}</h2>
</div>


<div id="content">
<tag:entrylist limit="40">
<a name="a${EntryNum}"></a>
<h3>${EntryTitle}</h3>
<h7>${EntryDate}  ${EntryTime}</h7>
<div>${EntryBody}</div><b></b>
<div>

<a href="${EntryCategoryLink}">${EntryCategoryName}</a>
<a href="${EntryPermaLink}#comment">Kommentarer (${EntryCommentCount})</a>
<a href="${EntryPermaLink}#trackback">Trackbacks (${EntryTrackbackCount})</a>
<br /><br />
<tag:taglist title="Nyckelord: ">
<a href="${TagURL}" rel="tag">${TagName}</a>
</tag:taglist>
</div>
<hr />
</tag:entrylist>
</div>

<div id="sidebar">


<div id="profile">
<tag:profile>
<tag:if test="${ProfileExists == 'true'}">
<h4>Om</h4>
<a href="${AppUrl}index.bd?fa=pf.view&amp;pf_id=${ProfileID}"><img src="${AppUrl}shared/img/profiles/${ProfileImage}" alt="Min profilbild" /></a>
<p><a href="${AppUrl}index.bd?fa=pf.view&amp;pf_id=${ProfileID}"><span style="font-weight:bold"> ${ProfileName}</span></a></p>
</tag:if>
</tag:profile>
</div>

<div>
<div>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>Senaste inläggen</div>
<ul>
<tag:recentlist limit="20">
<li><a href="${EntryPermaLink}">${EntryTitle}</a></li>
</tag:recentlist>
</ul>
<div>Kategorier</div>
<ul>
<tag:categorylist>
<li><a href="${CategoryLink}">${CategoryName}</a></li>
</tag:categorylist>
</ul>
<div>Arkiv</div>
<ul>
<tag:archivelist>
<li><a href="${ArchiveLink}">${ArchiveName}</a></li>
</tag:archivelist>
</ul>

</div>
</div>

<div style="clear: both; line-height: 1px; font-size: 1px;">&nbsp;</div>



</div>

<img src="http://stats.blogg.se/?id=${BlogID}" border="0" width="0" height="0" alt="" />

</body>
</html>


Stilmall:

html,body,h1,h2,h3,h4,h5,h6,p,dl,dd,dt,ul,li,img,table,caption,tr,th,td,tt,span,fieldset,legend, form { margin: 0; padding: 0; border: 0; }
input, select, textarea { margin: 0; padding: 0; }




a {
color: #D95B81;
}
a:hover {
color: #FFBACF;
}


body {
font: 12px/14px , Arial, Sans-serif;
}

h1,h2,h3,h4,h5,h6,h7 div.navheader, div.default {
font-family: Arial, Georgia, Serif;
color: #333;
}



body {
background: #55BAD8;
}


div#wrapper {
margin: 50px auto 50px auto;
padding: 20px;
width: 960px;
background: #FEFEFE url(http://kaveldunet.blogg.se/images/2011/seamless-floral-design-vector-background_thumb_166069778.jpg) repeat;
border: solid #555 2px;
-moz-border-radius: 30px;
border-radius: 30px;
-moz-box-shadow: 5px 5px 5px #888;
box-shadow: 5px 5px 5px #888;

}



div#header {    /* Inställningar för headern */
clear: left;
padding: 20px;
margin: 0px 0px 20px 0px;
width: 910px;
height: 100px;
background: #FEFEFE;
border: solid #555 2px;
-moz-border-radius: 30px;
border-radius: 30px;
-moz-box-shadow: 5px 5px 5px #888;
box-shadow: 5px 5px 5px #888;

}

div#header h1 {
font-size: 45px;
letter-spacing: 3px;
font-weight: bold;
margin: 10px 0px 0px 20px;
text-shadow:1px 1px 1px #DDD;
}

div#header h1 a {
text-decoration: none;
color: #61AECF;
cursor: default;
text-shadow:1px 1px 1px #DDD;
}

div#header h2 {
font-size: 18px;
letter-spacing: 1px;
margin: 5px 0px 0px 100px;
color: #A4C746 ;
text-shadow:1px 1px 1px #DDD;
}




div#content {   /* Inställningar för content */
float: left;
padding: 20px;
margin: 0px 20px 0px 0px;
width: 640px;
background: #FEFEFE;
border: solid #555 2px;
-moz-border-radius: 30px;
border-radius: 30px;
-moz-box-shadow: 5px 5px 5px #888;
box-shadow: 5px 5px 5px #888;
}

div#content h3 {
font-size: 25px;
font-weight: normal;
font-family: Arial;
margin: 0px 50px 10px 0;
}

div#content div.entrybody {
font-size: 18px
font-weight: normal;
letter-spacing: 0px;
font-family: Arial;
margin: 10px 50px 0px 0px;
}

div#content div.entrybody ul {
margin: 10px 0 10px 15px;
}

div#content div.entrybody li {
font-size: 13px;
font-family: Arial;
color: #222;
list-style-type: square;
}




div#sidebar {    /* Inställningar för sidebar */
float: left;
width: 225px;
padding: 0px 0px 20px 20px;
margin: 0px 0px 0px 0px;
background: #FEFEFE;
border: solid #555 2px;
-moz-border-radius: 30px;
border-radius: 30px;
-moz-box-shadow: 5px 5px 5px #888;
box-shadow: 5px 5px 5px #888;
}


div#sidebar div.navheader, div#sidebar h4, div.default {
padding: 20px 5px 5px 0px;
font-size: 16px;
font-family: Arial;
font-weight: normal;
}

div#sidebar h3 div.navheader {
color: #666;
font-family: Arial;
}





div.default {
margin: 0 0 15px 0;
}

div.nav input {
margin-right: 5px;
}

div.nav li {
list-style: none;
font-family: Arial;
font-size: 14px;
padding: 4px 0;
}

div.nav ul li strong {
line-height: 37px;
font-size: 12px;
font-family: Arial;
}

div.entrymeta {
font-size: 12px;
font-family: Arial;
margin: 10px 0px 20px 0px;
padding: 10px 0 10px 0;
color: #666;
line-height: 7px;
}

div.commentheader, p.commenttext {
margin: 0 0 0 15px;
font-weight: bold;
font-family: Arial;
color: #222;
}

p.commenttext {
font-weight: normal;
font-family: Arial;
}

div.commentmeta {
color: #666;
margin: 5px 0 20px 15px;
font-family: Arial;
font-size: 12px;
}

form.commentform {
font-size: 12px;
font-family: Arial;
}

form.commentform input, form.commentform textarea {
margin: 0 5px 10px 0;
font-family: Arial;
vertical-align: middle;
}

input.formbutton {
margin-top: 10px;
}

.separator {
display: block;
background: #FFF url(http://kaveldunet.blogg.se/images/2011/seamless-floral-design-vector-background_thumb_166069778.jpg) repeat;
height: 20px;
width: 0 auto;
margin: 0px 0px 20px 0px;
border: solid #555 2px;
-moz-border-radius: 30px;
border-radius: 30px;
-moz-box-shadow: 2px 2px 2px #888;
box-shadow: 2px 2px 2px #888;

}

.subside {}

.image {
border: solid #DDD 3px;
margin: 5px;
}

.thumbnail {
margin: 7px;
}

.video {
padding: 0;
}

.xmlButton {
border: 1px solid;
border-color: #FC9 #630 #330 #F96;
padding: 0 3px;
font: bold 10px  Arial, Helvetica, Sans-serif;
color: #FFF;
background: #F60;
text-decoration: none;
margin:0;
}


Bakgrundsbild:

Blommig bakgrund


Det är bättre om Ni själva sparar bakgrunden, laddar upp den på Eran blogg och själva 
ändrar bildadressen, ifall att jag av nån anledning skulle ta bort den från mitt arkiv.

[Jag tänker inte ta något ansvar för om designen krånglar. Fråga mig inte om hjälp.]

Kommentarer

Kommentera inlägget här:

Namn:
Kom ihåg mig?

E-postadress: (publiceras ej)

URL/Bloggadress:

Kommentar: