Slider eller bildspel på din sida

Inbyggd funktion:

Det finns en inbyggd funktion för att ha bildspel i sidans utrymme för headerbild.

Instruktion:

Se till att du har premium på din N.nu hemsida.
Skapa bilderna i ett bildbehandlingsprogram eller använd en gratis tjänst som till exempel Pixlr. Se till så att de olika bilderna är 940 pixlar i bredd och att alla har samma höjd med minst 100 pixlar. Försök även att få de lätta i antalet kilobyte, helst under 80kb styck.
Ladda upp de olika bilderna på denna sidan och kopiera adressen (URL) till bilderna.
Koden för slidern ser ut så här:
##SLIDER: height=250 images=url,url,url,url#

Ändra siffran för höjden och byt ut URLerna för bilderna med dina egna. Mellan 3-4 stycken är lagom. Alltså exempelvis

##SLIDER:  height=240  images=https://images.staticjw.com/tes/6709/header1.jpg,https://images.staticjw.com/tes/6709/header2.jpg,https://images.staticjw.com/tes/6709/header3.jpg##

Klistra in koden i sista rutan innan sparaknappen på denna sidan.
Du måste ha en mall som har en funktion med egen header för att det ska fungera.
(Om du istället har en egen mall så använd koden ##header_image_if_exists## där du vill att slidern ska finnas.)

Vill du ha ett bildspel någon annan stans än i headern krävs en hel del egen kodning:

Lägga in egen slider:

Här nedan försöker vi förklara det så enkelt som möjligt.

Ladda ner dessa fyra filer till din dator (högerklicka på länken och spara):
Ladda upp på din n.nu-sida i filuppladdaren.
Notera adresserna!
Gå till egen mall på din n.nu-sida

Leta upp </head> och OVANFÖR den lägger du in:

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js"></script>
<br><script src="adressentilldinfil/sss.js"></script>
<br><script src="adressentilldinfil/sss.min.js"></script>
<br><link rel="stylesheet" href="adressentilldinfilsss.css" type="text/css" media="all">
<script>jQuery(function($) {$('.slider').sss();});</script><br>

Byt ut adressentilldinfil till den adress dy noterat i steg 2.
I egen css lägger du till:
.sssnext, .sssprev {
background: url(' adressentillbilden') no-repeat;
}
Byt ut adressentillbilden till hela adressen till arr.png som du fick när du laddade upp den.
Ladda upp de bilder du vill ha i ditt bildspel och lägg in dem efter varandra på önskad sida på din sida.
Växla till html eller tryck på <> och leta upp dina bilder där:
Byt ut <p> före bilderna till <div class="slider">
Byt ut </p> efter bilderna till </div>
Säkerställ att din kod er ut ungefär som på bilden ovan. Finns det saker mellan " /><img så suddar du ut det, det ska bara vara bilder där.
tryck OK (om du använder <>) och spara!
Då ska slidern fungera!