TechBlogSD - Tutto per WordPress e sviluppo WEB
Istruzioni WEB e WordPress, notizie, recensioni di temi e plugin

Come aggiungere il pulsante Scorri verso l’alto nel sito Weebly?

17

Scorri verso l’alto è una funzione semplice e utile utilizzata per andare all’inizio di una pagina Web ovunque dal basso. Potresti aver notato una freccia verso l’alto nell’angolo in basso a destra della maggior parte dei siti e facendo clic sull’immagine della freccia verrai portato in cima a quella pagina. Questa è una funzione utile soprattutto per le pagine con contenuti lunghi. Questo articolo spiega come aggiungere la funzione di scorrimento in alto o in alto nel tuo sito Weebly gratuito. Scopri più di 200 tutorial Weebly gratuiti per ottimizzare il tuo sito Weebly.

Ecco il riepilogo dei passaggi necessari per l’aggiunta del pulsante Scorri in alto o Torna in alto:

  1. Scarica e modifica il file JavaScript di scorrimento verso l’alto.
  2. Scarica l’immagine della freccia su.
  3. Carica JavaScript e file immagine sul tuo sito Weebly.
  4. Aggiungi Scorri verso l’alto in tutte le pagine.
  5. Aggiungi scorrimento verso l’alto in pagine specifiche.

Cerchiamo di discutere ogni passaggio in dettaglio.

Passaggio 1: scarica e modifica il file di script

  • Scarica il file zip ed estrailo in un file JavaScript denominato "scrolltopcontrol.js".
  • Apri il file nell’editor come Blocco note o TextEdit e cerca il codice img src="up.png".
  • Sostituiscilo con il percorso dell’immagine del tuo sito Weebly come di seguito:
img src="https://yoursitename.weebly.com/files/theme/up_arrow.png"
  • Salva il file modificato.

Passaggio 2: download dell’immagine della freccia su

Passaggio 3: caricamento di file sul tuo sito Weebly

  • Accedi al tuo account Weebly e seleziona il sito che desideri aggiungere alla funzione di scorrimento verso l’alto.
  • Nell’editor Weebly vai alla scheda "Tema" e quindi fai clic sul pulsante " Modifica HTML/CSS ".
  • Fare clic sull’icona "+" nella scheda "Risorse", selezionare "Carica file (s) dal menu a discesa e caricare il file "scrolltopcontrol.js" modificato.
  • Allo stesso modo carica il file immagine "up_arrow.png".
  • Salva il tuo tema, se è la prima volta che carichi file nel tuo sito, ti verrà chiesto di inserire un nuovo nome per il tuo sito. Inserisci un nuovo nome per il tema e salva le modifiche.

Ora hai quasi finito e ti rimangono due opzioni per aggiungere la funzione di scorrimento in alto:

  1. Aggiungi in tutte le pagine del sito.
  2. Solo in pagine specifiche.

Come aggiungere il pulsante Scorri verso l'alto nel sito Weebly?

Caricamento file nel sito Weebly

Passaggio 4: aggiunta di scorrimento in alto in tutte le pagine

Copia il codice sottostante e modificalo sostituendo "yoursitename.weebly.com" con il tuo vero nome del sito Weebly.

<script type="text/javascript" src="https://yoursitename.weebly.com/files/theme/scrolltopcontrol.js"></script>

Vai alla scheda "Impostazioni" nell’editor Weebly e incolla il codice nella casella "Codice intestazione" nella sezione "SEO" come mostrato nell’immagine qui sotto.

Come aggiungere il pulsante Scorri verso l'alto nel sito Weebly?

Aggiungi codice nella home page del sito Weebly

Salva le modifiche e pubblica il tuo sito per vedere un pulsante freccia posizionato nell’angolo in basso a destra durante lo scorrimento verso il basso. Puoi vedere l’immagine della freccia verso l’alto in tutte le tue pagine e facendo clic sull’immagine verrai portato in cima al tuo sito.

Avvertenza: se la funzione di scorrimento non funziona, prova a incollare il codice nella sezione "Codice piè di pagina" anziché nella sezione "Codice intestazione".

Passaggio 5: aggiunta di scorrimento in alto su pagine specifiche

Vai alla scheda "Pagine" nell’editor Weebly e seleziona la pagina a cui desideri aggiungere la funzione di scorrimento verso l’alto. Fare clic sul collegamento "Impostazioni avanzate" e incollare il codice sopra nella casella " Codice intestazione " come mostrato nell’immagine sottostante. Ricordati di sostituire "nomesito.weebly.com" con il tuo vero nome del sito Weebly.

Come aggiungere il pulsante Scorri verso l'alto nel sito Weebly?

Aggiungi codice in una singola pagina Weebly

Salva le modifiche e pubblica il tuo sito. Apri la pagina specifica e vedrai che il pulsante freccia è ora posizionato nell’angolo in basso a destra della pagina durante lo scorrimento verso il basso.

Utilizzo del testo Torna all’inizio

Se desideri utilizzare il testo invece di un’immagine, aggiungi semplicemente il codice sottostante in qualsiasi punto della pagina utilizzando un elemento " Codice di incorporamento ".

<a href="#top">Back to Top</a>

Puoi anche utilizzare questo codice nella casella "Codice piè di pagina" nella sezione "SEO" della scheda "Impostazioni" per aggiungere "Torna all’inizio" nel piè di pagina del tuo sito. utilizzare e
tag per allineare il testo di conseguenza.

Nota: invece di #top puoi utilizzare qualsiasi ancoraggio HTML nella tua pagina per scorrere fino a quella posizione.

Modifica della destinazione di destinazione del controllo "Scorri verso l’alto"

Quando fai clic sulla freccia su, la barra di scorrimento per impostazione predefinita verrà spostata nella parte superiore della pagina. Se vuoi spostarti in qualsiasi altra posizione, puoi controllarlo modificando l’attributo "scrollto" all’interno del file .js. Ad esempio, cambiando "scrollto: 0" in "scroll: 100" si sposterà la barra di scorrimento di 100 pixel sotto la posizione superiore. Puoi anche spostare la posizione su qualsiasi elemento definito nella tua pagina utilizzando i due passaggi seguenti.

  • Passaggio 1 – Definire l’elemento – Ad esempio per definire un H2 utilizzare l’elemento del codice di incorporamento e aggiungere il codice seguente:
<h2 id="movehere">Move the Scroll bar here </h2>
  • Passaggio 2: quindi modificare l’attributo come scrollto: "movehere" all’interno del file .js come mostrato di seguito:
setting: {startline:100, scrollto: "movehere", scrollduration:1000, fadeduration:[500, 100]},

Questo sposterà la barra di scorrimento in quella posizione di intestazione H2 quando si fa clic sulla freccia su o sul collegamento di ritorno in alto.

Fonte di registrazione: www.webnots.com
Lascia una risposta

This website uses cookies to improve your experience. We'll assume you're ok with this, but you can opt-out if you wish. Accept Read More