Hvordan lage en Sidebar Gadget for Blogger med roterende tekst

Hvordan lage en Sidebar Gadget for Blogger med roterende tekst


Blogger.com er Googles trykknapp publisering nettside. Registrerte Blogger-brukere kan velge mellom en rekke prefabrikkerte maler og oppsett for å lage en tilpasset nettside med en "blogspot.com" URL. I tillegg til disse maler og oppsett, Blogger tilbyr også brukerne mer enn 20 "gadgets" for å tilpasse sin side. Inkludert i disse gadgets er en HTML Java alternativ /, som du kan bruke til å lage en roterende tekst funksjon.

Bruksanvisning

1 Klikk på "Design" -fanen inne i dashbordet på Blogger.com konto.

2 Klikk på "Page Elements" alternativet under "Design" tag. Bestem hvor du vil plassere din gadget med roterende tekst. Blogger tilbyr oppsett med opptil tre sidefelt, så avhengig av oppsettet du bruker, kan du ha flere alternativer.

3 Klikk på "Legg til gadget" -knappen øverst i sidepanelet hvor du ønsker å plassere gadget.

4 Bla gjennom listen over gadget muligheter i pop-up boks til du finner en som heter "HTML / Javascript". Klikk på dette alternativet.

5 Lim denne koden inn i tekstfeltet:

<Style type = "text / css">

ran1, # ran2, # ran3, # ran4 {display: none;}

</ Style>

<Script type = "text / javascript">

window.onload = function () {

Var VM = (Math.floor (Math.random () * 4) 1);

document.getElementById ( 'kjørte' + VM) .style.display = 'inline';

}

</ Script>

<P id = "randomP">

<Span id = "ran1"> ROTERENDE TEKST # 1 går HER </ span>

<Span id = "ran2"> ROTERENDE TEKST # 2 GOES HER </ span>

<Span id = "ran3"> ROTERENDE TEKST # 3 GOES HER </ span>

<Span id = "ran4"> ROTERENDE TEKST # 4 GOES HER </ span>

</ P>

6 Redigere koden for å tilpasse ditt roterende tekst. Koden i trinn 6 er for fire linjer med tekst. For to linjer med roterende tekst, vil du eliminere "# ran3; # ran4" på toppen av koden, eliminere "<span id =" ran3 "> ROTERENDE TEKST # 3 GOES HER </ span>" og "<span id = "ran4"> ROTERENDE TEKST # 4 GOES HER </ span> "linjer nederst og endre nummeret" 4 "til" 2 "etter koden" Math.floor (Math.random (). "for å legge til ekstra linjer roterende tekst, vil du legge til "# ran5" og så videre til du har nådd "#ranX", der "X" representerer antall tekstlinjer du ønsker å ha i rotasjon. du vil også legge til "<span id = "ran5"> ROTERENDE TEKST # 5 GOES HER </ span> "og så videre til du har nådd" <span id = "Ranx"> ROTERENDE TEKST #X GOES HER </ span> ", der" X "representerer nytt nummer av linjer med tekst i rotasjon. til slutt endre nummeret etter "Math.floor (Math.random ()" for å matche det totale antall linjer med tekst i rotasjon.

Hint

  • Denne typen roterende tekst gadget kunne brukes til en "Quote of the Day" -funksjonen, for eksempel.