Dette er en test.

"Life is not measured by the number of breaths we take, but by the moments that take out breath away." "Life is not measured by the number of breaths we take, but by the moments that take out breath away." "Life is not measured by the number of breaths we take, but by the moments that take out breath away." "Life is not measured by the number of breaths we take, but by the moments that take out breath away." "Life is not measured by the number of breaths we take, but by the moments that take out breath away."

"Life is not measured by the number of breaths we take, but by the moments that take out breath away." "Life is not measured by the number of breaths we take, but by the moments that take out breath away." "Life is not measured by the number of breaths we take, but by the moments that take out breath away." "Life is not measured by the number of breaths we take, but by the moments that take out breath away."

HTML og CSS

Meny:

Oppsett:

Utseende på bloggen:

Sidemeny:

Kopisperre:

Kopisperre 2

Lim denne koden under <body> eller <body class="front"> i malene. Bytt ut Function Disabled! med den meldingen du vil ha.

<script language=JavaScript>
<!--

//Disable right mouse click Script
//By Maximus (maximus@nsimail.com) w/ mods by DynamicDrive
//For full source code, visit http://www.dynamicdrive.com

var message="Function Disabled!";

///////////////////////////////////
function clickIE4(){
if (event.button==2){
alert(message);
return false;
}
}

function clickNS4(e){
if (document.layers||document.getElementById&&!document.all){
if (e.which==2||e.which==3){
alert(message);
return false;
}
}
}

if (document.layers){
document.captureEvents(Event.MOUSEDOWN);
document.onmousedown=clickNS4;
}
else if (document.all&&!document.getElementById){
document.onmousedown=clickIE4;
}

document.oncontextmenu=new Function("alert(message);return false")

// --> 
</script>

Kopisperre 1

Hindrer folk i og dra bilder til f.eks adresselinjen for å få URL-en eller og dra og kopiere tekst. Med denne koden går det heller ikke an å merke bilder og tekst i Internet Explorer.

Legg denne koden til body-taggen. Body taggen ser sånn ut: <body>

ondragstart="return false" onselectstart="return false" 

Har du gjort det riktig skal den se sånn ut: <body ondragstart="return false" onselectstart="return false" >

Det kan hende de står class="front" inni body-taggen, det trenger du ikke å fjerne.

Fjerne "Siste innlegg" fra sidemenyen

For å fjerne "siste innlegg" fra sidemenyen, sletter du dette fra malene:
<div>
<h3>Siste innlegg</h3>
<ul>
<tag:recentlist limit="10">
<li><a href="${EntryPermaLink}">${EntryTitle}</a></li>
</tag:recentlist>
</ul>
</div>

Fjerne "Siste kommentarer" fra sidemenyen

For å fjerne "siste kommentarer fra sidemenyen, sletter du dette fra malene:

<div>
<h3>Siste kommentarer</h3>
<ul>
<tag:commentlist global="true" limit="10" sort="desc">
<li> ${CommentAuthorLinkIf} om ${CommentArticleLink}</li>
</tag:commentlist>
</ul>
</div>

Fjerne profil

Dette finnes flere måter å gjerne profilen i sidemenyen på. Den enkleste er å lime inn denne koden nederst i stilsettet:

#profile { display: none; }

Fjerne kategorier

For å fjerne kategorier fra sidemenyen sletter du dette fra malene:

<div>
<h3>Kategori</h3>
<ul>
<tag:categorylist>
<li><a href="${CategoryLink}">${CategoryName}</a></li>
</tag:categorylist>
</ul>
</div>

Fjerne arkiv

For å fjerne arkiv fra sidemenyen sletter du dette fra malene:

<div>
<h3>Arkiv</h3>
<ul>
<tag:archivelist>
<li><a href="${ArchiveLink}">${ArchiveName}</a></li>
</tag:archivelist>
</ul>
</div>

Fjerne reklamen i sidemenyen

NB: Hvis du gjør dette fjerner du også  widgets!

Dette er koden du skal fjerne: </tag:profile> (trykk CTRL + F og skriv inn)

Det finnes to av den i malene, og du skal slette den første/øverste.

Diverse ting i sidemeny

Design> Rediger> Maler> Forsiden/Innlegg/Arkiv/Kategorier

Om du vil ha et bilde i for eksempel sidemenyen, limer du inn denne koden:
<img src="URL" height="størrelsen du vil ha på bildet">

Om du vil ha et bilde med en link, limer du inn denne koden:
<a href="URL til siden"><img src="URL til bildet" height="Hvor stort bildet skal være"> </a>

Om du bare vil ha en link, limer du inn denne koden:
<a href="URL til siden">Tekst til linken</ a>

Hvis du vil ha dette rett under linker, i sidemenyen, legge du til kodene over, under denne linja:
<div>
<h3>Lenker</h3>
<ul>
<tag:linklist>
<li>
<a href="${LinkURL}">${LinkName}</a>
</li>
</tag:linklist>
</ul>
</div>
</tag:if>
KODENE SKAL HER

Eller så kan du også legge de i widgets: Design> Rediger> Widgets

Skille sidemenyen fra innleggene

Lim disse kodene inn i stilsettet hvis du vil skille sidemenyen fra innleggene.

#wrapper {
margin-left: auto;
margin-right: auto;
}
#header {
margin-left: auto;
margin-right: auto;
}
#footer {
margin-left: auto;
margin-right: auto;
}

Flytte sidemenyen til høyre/venstre

Hvis du vil at blogginnleggene og sidemenyen skal bytte plass trenger du bare å lime koden under inn i stilsettet.
#main {
float: right;
}
#side {
float: left;
}

Flytte sidemenyen opp ved headeren

Har du lyst å flytte sidemenyen lenger opp ved siden av headeren? Kopier denne koden og lim den nederst i stilsettet:

 

#side {
margin-top: -300px;
background-color: #ffffff;
}
Hvis du allerede har avsnittet side, så limer du bare inn margin-top: -300px; under der. Endre 300 til du finner ut hvor du vil ha sidemenyen. Ikke fjern -. Har lagt inn hvit som bakgrunnsfarge på sidemenyen i tilfelle den er gjennomsiktig fra før, men det kan endres.
Hvis du ikke vil at sidemenyen skal gå over headeren, så ordner du headeren like bred som blogginnleggene.

Stillestående bakgrunn

For å få stillestående bakgrunn på bloggen din limer du inn koden under i stilsettet. Den kan limes inn under f.eks. body.

background-attachment: fixed;
For at koden skal funke så må man ha et bakgrunnsbilde, ikke bare en bakgrunnsfarge. Koden til det er:
background-image: url('URL-EN TIL BILDET HER');

Bytte farge på scrollbaren

NB: Vises bare i Internet Explorer og Opera.

For å bytte farge på scrollbaren limer du inn disse kodene i stilsettet:

body {
scrollbar-face-color: #D4D0C7;
scrollbar-highlight-color: #FFFFFF;
scrollbar-3dlight-color: #D4D0C7;
scrollbar-darkshadow-color: #404040;
scrollbar-shadow-color: #808080;
scrollbar-arrow-color: #000000;
scrollbar-track-color: #D5D1C8;
}

Fargekodene kan du bytte ut etter eget ønske.

Midtstille bloggen

For å midtstille bloggen limer du inn disse kodene i stilsettet:

#wrapper {
margin-left: auto;
margin-right: auto;
}
#header {
margin-left: auto;
margin-right: auto;
}
#footer {
margin-left: auto;
margin-right: auto;
}

Vanlig horisontal meny

For å få en vanlig, horisontal meny må du følge disse to stegene:

 

1: Lim disse kodene inn i malen under eller over headeren.
Bytt ut # med url-en og Link linken til siden du vil linke til.

<div id="meny">
<a href="#"> Link </a>
<a href="#"> Link </a>
<a href="#"> Link </a>
<a href="#"> Link </a>
<a href="#"> Link </a>
<a href="#"> Link </a>
</div>




2: Lim deretter dette inn i stilsettet. Det står forklart ved siden av kodene hva de betyr.

#meny {
font-family: arial;
font-size: 12px;           /* Tekststørrelse */
text-align: center;
width: 890px;           /* Bredde */
padding: 5px 0px 5px 0px;
background-color: #efefef;           /* Bakgrunnsfarge bak hele menyen*/
margin-left: auto;

margin-right: auto;
}
#meny a {
background-color: #efefef;           /* Bakgrunnsfarge */
color: #898989;           /* Farge på linken */
padding: 5px 15px 5px 15px;
width: 100%;
margin: 0px 8px 0px 0px;           /* Mellomrom mellom boksene. Oppe, høyre, nede, venstre */
}
#meny a:hover {
color: #696969;           /* Farge på linken når du fører pekeren over */
background-color: #efefef;           /* bakgrunnsfarge */
}

Dropdown meny

For å få dropdown meny så må du lime inn dette nederst i stilsettet:

#navbar {

padding: 5px;
height: 1em;
width: auto;
margin: 0px;
text-align: center;
}
#navbar li {
float: left;
list-style: none;
width: 150px;
background-color: #fff;
}
#navbar li a {
padding: 5px;
display: block;
border-bottom: 0px dashed #F7D7EE;
color: #000000;
text-decoration: none;
font-family: arial;
font-size: 10px;
line-height: 12px;
}
#navbar li ul {
padding: 5px;
display: none;
width: em;
background-color: #fff;
}
#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: 1px dotted #ffc0c0; 
color: #727272;
}
#navbar li li a:hover {
background-color: #ffc0c0;
}
#meny {
width: 610px;
margin-left: auto;
margin-right: auto;
}

Background-color, color (farge på teksten), border osv kan endres på.

Kodene under skal du lime inn i maler der du vil at menyen skal være. På bildet er det forklart hvor du kan plasser kodene.

 

<div id="meny">
<ul id="navbar">

<li><a href="#">Siste innlegg</a>
<ul>
<tag:recentlist limit="10">
<li><a href="${EntryPermaLink}">${EntryTitle}</a></li>
</tag:recentlist>
</ul>
</li>

<li><a href="#">Kategorier</a>
<ul>
<tag:categorylist>
<li><a href="${CategoryLink}" class="nav">&raquo; ${CategoryName}</a></li>
</tag:categorylist>
</ul>
</li>

<li><a href="#">Arkiv</a>
<ul>
<tag:archivelist>
<li><a href="${ArchiveLink}">${ArchiveName}</a></li>
</tag:archivelist>
</ul>
</li>

<li><a href="#">Overskrift</a>
<ul>
<li><a href="#" class="nav">Link</a></li>
<li><a href="#" class="nav">Link</a></li>
<li><a href="#" class="nav">Link</a></li>
</ul>
</li>

</ul>
</div>


Hvis du vil ha flere "knapper" limer du inn dette før den siste </ul>.

<li><a href="#">Overskrift</a>
<ul>
<li><a href="#" class="nav">Link</a></li>
<li><a href="#" class="nav">Link</a></li>
<li><a href="#" class="nav">Link</a></li>
</ul>

Listene med siste innlegg, kategorier og arkiv kan fjernes hvis du ikke vil ha dem.
Bytt ut # med den url-adressen du vil linke til. Firkanten før overskrift kan bare stå der om du ikke vil ha noen link der.
</li>

FARGEKART

Hei!

Noen lurte på om jeg kunne dele noen fargekart, og det kan jeg jo såklart! Dette er to sider jeg bruker veldig mye når jeg holder på selv, så jeg synes det er veldig gode sider. For å komme til sidene trykk her og her.

Var dette til hjelp?



arkiv

  • August 2012
  • Juli 2011
  • Mai 2011
  • Februar 2011
  • Desember 2010



  • kategorier

  • Blogg
  • HTML-koder





  • hits