Gratis arkivsida

För det första, om du vill koda själv kan du klicka på HTML, välja sida i en ruta som ska se ut som nedan och sedan börja koda! Men då måste du vara duktig på det, för det finns många siffror och tecken att hålla reda på. Personligen vet jag knappt något om kodning, jag kopierar mest autokoder.
För det andra tänkte jag ge er en annan kodning (en autokod igen såklart). Även denna är från min sida så om resultatet inte passar in på din blogg borde du testa något annat. Annars är det bara att klistra in:

{% extends "index" %}

{% block head %}
<title>{{ blog.title }} - {{ archive_page.name }}</title>
{{ macros.opengraph_entries(archive_page.name, blog, profile, entries) }}
{% endblock %}

{% block profile %}{% endblock %}

{% block side %}
<ul>
<li><a href="{{ blog.blog_path }}index.html" title="Gå till startsidan"><strong>Till bloggens startsida</strong></a></li>
</ul>
{% endblock %}

Jag hoppas verkligen att jag hjälper er när jag gör det här! Kommentera gärna vilken sida ni vill se härnäst, och vad ni tyckte om designen! Förresten, den här kodningen är för arkivsidan :)

Gratis stilmall

Hej! Vill du få en gratis stilmall av mig? Koda in detta bara! Ge gärna credit om du har en publicerad blogg som du vill ha designen till :) Du behöver inte fråga om lov men säg gärna till om du har använt den :)

/* Theme Dotty */
@import url("http://static.blogg.se/themes/dotty/style.css");
{{options.importstr}}

body {
background-color: {{options.color.background}};
background-image: {{options.image.background.urlsrc}};
}

.header-big { background-image: {{options.image.header.urlsrc}}; }
.header-small:first-of-type { background-image: {{options.image.header1.urlsrc}}; }
.header-small:nth-of-type(2) { background-image: {{options.image.header2.urlsrc}}; }
.header-small:nth-of-type(3) { background-image: {{options.image.header3.urlsrc}}; }
.header-small:nth-of-type(4) { background-image: {{options.image.header4.urlsrc}}; }
.header-small:nth-of-type(5) { background-image: {{options.image.header5.urlsrc}}; }
.header-small:nth-of-type(6) { background-image: {{options.image.header6.urlsrc}}; }

#header {
height: 346px;
}

.nav a, a, body, .nav, .commentmeta a:hover, .navheader, .commentheader, .commentmeta, .commentmeta a {
color: {{options.color.header}};
}

.entrybody, .commentform, .commenttext, #profile, #profile .info-profile, a:hover, .nav a:hover {
color: {{options.color.body}};
}

.social svg, #social svg { fill: {{options.color.header}}; }
#social { text-align: center; }
#social svg { border-radius: 50%; }

h1, h2, #header h1 a { color: {{options.color.background2}}; }
#side, #content, .header-wrap { background: {{options.color.background2}}; }

.avatar {
border-bottom: 1px solid {{options.color.border}};
border-top: 1px solid {{options.color.border}};
}

.navheader { border-bottom: 2px solid {{options.color.border}}; }

.commentheader { border: 1px solid {{options.color.border}}; }

.commenttext, .commentmeta {
border-bottom: 1px solid {{options.color.border}};
border-left: 1px solid {{options.color.border}};
border-right: 1px solid {{options.color.border}};
}

.response-by, .entrymeta { border-bottom: 1px solid {{options.color.border}}; }

.response, .response-by {
border-left: 1px solid {{options.color.border}};
border-right: 1px solid {{options.color.border}};
}

.dot { color: {{options.color.border}}; }

h3, .avatar, .commentheader {
background: {{options.color.border}};
}


h3, .navheader {
font-family: "{{options.gfont.heading.name}}", {{options.gfont.heading.fallback}};
}

h1 {
font-size: 2.2em;
height: 40px;
margin-left: 280px !important;
margin-top: 84px !important;
overflow: hidden;
width: 100%;
}

h1, h2, .nav, .entrybody, .commentheader, body, .commenttext, .commentmeta .response, .response-by, .commentform, select {
font-family: "{{options.gfont.body.name}}", {{options.gfont.body.fallback}};
}

h3 {
font-size: {{options.fontsize.heading}};
}

.navheader {
font-size: {{options.fontsize.header}};
}

.entrybody, .nav, .commentheader, .commenttext, h2, .response, .response-by {
font-size: {{options.fontsize.body}};
line-height: 140%;
}

.commentmeta, .commentform, select {
font-size: {{options.fontsize.body}};
}
.header-wrap { position: absolute; bottom: 7px; }
.header-right .header-wrap {width: 354px; right: 0; }

.like-container { float: left; margin-left: 5px; }
.likebtn { margin-right: 0px !important; }
.like-container .likebtn { margin-right: 0; }
.like-container .likebtn .likebtn__btn {
background: {{options.color.likebtn}} !important;
}
.like-container .likebtn.clicked .likebtn__btn {
color: {{options.color.likebtn}} !important;
background: white !important;
}

.entrymeta:after {
clear: both;
content: " ";
display: block;
height: 0;
visibility: hidden;
line-height: 0;
}

Inställningar

Det är inte bara själva designen som gör din blogg fin! Det finns fler viktiga inställningar! Du kan t ex klicka på kugghjulet igen, men ta inte "Design" utan just "Inställningar"!
Vill du ha ett namn till din blogg? Fyll i det högst upp! Välj även kategori och beskrivning.
Hur gör du beskrivningen egentligen? Hur kommer den synas? Det beror på din design/ditt tema, men i mitt fall ser den ut såhär:
Beskriv din blogg helt enkelt! Här har vi lite inställningar som jag inte tänker handleda dig igenom, du får tänka ut det själv:
Klicka nu på "Profil" efter att du har sparat dina inställningar. Börja med att skriva ditt namn, men bara om du vill. Jag vill personligen helst vara anonym, jag har alltså inte heller skrivit fakta. Om du vill kan du ladda upp en bild till din profil! Om du inte gör det kommer bilden se ut som nedan, eller inte komma med på bloggen alls (beroende på temat).
Det här är självklart också valfritt, men om du vill kan du även fylla i dina konton på sociala medier:
Spara såklart! Resten av inställningarna tänker jag inte gå igenom, det får du klura ut själv. Jag tror inte du är typ fem år, så du klarar det nog själv! ;) Det är inte svårt att fixa inställningarna, det är mest designen som är lite mer klurig!