Meny: På høyre side av bloggen

ALCHEMIST.BLOGG.NO ER KILDEN TIL DENNE KODEN (LINK HER)

 CSS / STILSETT 
kan redigeres hvordan man vil. utseende på menyen!

a.yes:link, a.yes:visited, a.yes:active
{display:block; font-family:helvetica; background:#0c0c0c; text-transform:uppercase; font-size:8px; padding:7px 0px 7px 2px; margin-bottom:3px; border-right:5px solid #e2e2e2; color:#a4a4a4; background:#000; letter-spacing:1px;}

a.yes:hover {background:#000; border-right:5px solid #eb4e9c; color:#a4a4a4;}

HTML / MALER
plasseres etter </head> 

<div style="position:fixed; margin-left:841px; top:450px; width:180px; height:100%;">
<a href="http://www.blogg.no" class="yes">blogg.no</a>
<a href="http://www.blogg.no" class="yes">blogg.no</a> 
<a href="http://www.blogg.no" class="yes">blogg.no</a> 
<a href="http://www.blogg.no" class="yes">blogg.no</a> 
<a href="http://www.blogg.no" class="yes">blogg.no</a> 
<a href="http://www.blogg.no" class="yes">blogg.no</a>
</div>

  •  Understreket: hvor du plasserer menyen! margin-left = hvor langt inn på skjermen den er. top = hvor langt ned på skjermen den er.
  • Hvis du ikke vil at den "sitter fast" når du scroller ned, så redigerer du position:fixed; til position:absolute;
  • IKKE fjern class="yes" fordi det er den som kobler til utseende-koden i CSS / STILARK.
  • Hvis du ikke trenger så mange lenker kan du bare fjerne " <a href="http://www.blogg.no" class="yes">blogg.no</a> " som du vil.
  • Får du det ikke til første gangen, slett alt fra disse kodene du har lagt inn på stilark og maler, og start på nytt. :) Bruk gjerne FORHÅNDSVISNING så mye du kan.

07.10.2012, kl. 14:12 × Menyer × 0 Kommentarer

Meny: Sirkler

Kilde for koden her & kilden for bildet @ bloggen under her.


KODEN (LIMES NEDERST I STILSETTET):

<style type="text/css">
.circlemenu{
width: 100%;
overflow:hidden;
}
.circlemenu ul{
margin: 0;
padding: 0;
font: bold 14px Verdana;
list-style-type: none;
text-align: center; /* "left", "center", or "right" align menu */
}
.circlemenu li{
display: inline;
margin: 0;
}
.circlemenu li a{
display:inline-block;
text-align:center;
text-decoration: none;
color: white;
background:#b72d23; //FARGE//
margin: 0;
margin-right:5px; /*right spacing between each link */
width:100px;
height:100px;
border-radius: 400px; /*really large border radius to create round borders*/
-moz-border-radius: 400px;
-webkit-border-radius: 400px;
}
.circlemenu a span{
position:relative;
top:40%;
}
.circlemenu li a:visited{
color: white;
}
.circlemenu a:hover{
background: #a71b15; //FARGE//
}
</style>



SÅ GÅR DU TIL MALER (FORSIDEN, INNLEGG, KATEGORI, ARKIV) OG LIMER INN DENNE KODEN (PASSER BEST UNDER </HEAD>)

KODEN:
<div class="circlemenu">
<ul>
<li><a href="DIN URL"><span>Navn på link</span></a></li>
<li><a href="DIN URL"><span>Navn på link</span></a></li>
<li><a href=" DIN URL"><span>Navn på link</span></a></li>
<li><a href="DIN URL"><span>Navn på link</span></a></li>
<li><a href="DIN URL"><span>Navn på link</span></a></li>
</ul>
</div>

07.10.2012, kl. 14:09 × Menyer × 0 Kommentarer

Meny: Block

1. Kopier denne koden og legg den nederst i stilsettet
2. Så, kopier denne koden der du vil ha selve knappene i HTML'en

Utseende på knappene:

07.10.2012, kl. 14:06 × Menyer × 0 Kommentarer

Drop down meny

Denne koden legger du der du vil ha den i malene (forsiden, innlegg, kategori, arkiv)

KODEN:
<select onchange='location=this.options[this.selectedIndex].value;' style='width:100px;'>
<option>HEADER HER</option>
<option value="LINK HER">LINK TITTEL HER</option>
<option value="LINK HER">LINK TITTEL HER</option>
</select>

03.10.2012, kl. 18:10 × Menyer × 0 Kommentarer

Drop down meny med tekst eller bilde

Aller først...

DENNE KODEN skal være imellom </head> og <head>.

DENNE KODEN skal være nederst i stilsettet ditt.


 

Bilde klikk:


DENNE KODEN, der du vil ha den i menyen.


 

Tekst klikk:


 DENNE KODEN, der du vil ha den i menyen.

03.10.2012, kl. 18:10 × Menyer × 0 Kommentarer

Meny: Rund



1. Gå til DENNE siden, kopier koden og legg den nederst i stilsettet
2. Gå til DENNE siden og kopier koden og legg den der du vil ha den i under HTML (Forsiden, innlegg, kategori og arkiv)

Du endrer farge, størrelse selv i Stilsettet (CSS).

03.10.2012, kl. 16:36 × Menyer × 0 Kommentarer
hits