Bottoni top pagina

Pagina aggiornata... Lunedì, 11 settembre 2023 * Tempo di caricamento 0.13 secondi
Link navigazione : Home ~ Gadget » Bottoni top pagina

..:: Bottoni top pagina ::..

Bottoncini che facilitano la navigazione dei nostri utenti per tornare all'inizio della pagina
o alla pagina precedente in un clic, come quello che trovate qui nel telaio^^

- Info

Prelevate il codice del bottone che vi piace e postatelo appena sotto il tag <body>

Affinché funzionino per bene occorre inserire la dichiarazione doctype,
che va scritta prima di ogni altro tag della pagina
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "https://www.w3.org/TR/html4/loose.dtd">

Per i blog Blogger/Blogspot andate nel pannello di controllo, cliccate su "Modifica HTML"
quando si è aperta la finestrella con il codice cliccate su f3 della vostra tastiera
e nella piccola finestrella scrivete </body>

Si evidenzierà il tag nel codice quindi subito sopra incollate il codice del bottoncino
Nel mio PenelopeBlog potete vedere uno dei bottoni all'opera ^_^

Versione soft

<div style="border: 0px; background-image:url('https://www.iltelaiodipenelope.it/gadget/bottoni_top_page/images/penelope_bottoncino_top_2.png'); position:fixed; bottom:0px; right:20px; width: 139px; height: 84px;">
<table style="border: 0px; margin-left: auto; margin-right: auto;" width="139">
<tr>
<td height="54" width="43"></td>
<td height="54" width="86"><img border="0" src="https://www.iltelaiodipenelope.it/gadget/bottoni_top_page/images/stellinedorate.gif" width="32" height="32" alt="" /></td>
</tr>
<tr>
<td align="center" width="133" colspan="2"><a href="javascript:history.back()"><img border="0" src="https://www.iltelaiodipenelope.it/gadget/bottoni_top_page/images/back_scuro.png" 
width="53" height="15" alt="Torna indietro" /></a> 
<a href="#top"><img border="0" src="https://www.iltelaiodipenelope.it/gadget/bottoni_top_page/images/top_scuro.png" width="53" height="15" alt="Torna su..." /></a></td>
</tr>
</table></div>

<div style="border: 0px; background-image:url('https://www.iltelaiodipenelope.it/gadget/bottoni_top_page/images/penelope_bottoncino_top_3.png'); position:fixed; bottom:0px; right:20px; width: 139px; height: 82px;">
<table style="border: 0px; margin-left: auto; margin-right: auto;" width="100%">
<tr>
<td height="50" width="43"></td>
<td height="50" width="86"><img border="0" src="https://www.iltelaiodipenelope.it/gadget/bottoni_top_page/images/stellinedorate.gif" width="32" height="32" alt="" /></td>
</tr>
<tr>
<td align="center" width="133" colspan="2"><a href="javascript:history.back()"><img border="0" src="https://www.iltelaiodipenelope.it/gadget/bottoni_top_page/images/back_chiaro.png" width="53" height="15" alt="Torna indietro" /></a>
<a href="#top"><img border="0" src="https://www.iltelaiodipenelope.it/gadget/bottoni_top_page/images/top_chiaro.png" width="53" height="15" alt="Torna su..." /></a></td>
</tr>
</table></div>

<div style="border: 0px; background-image:url('https://www.iltelaiodipenelope.it/gadget/bottoni_top_page/images/penelope_bottoncino_top_7.png'); position:fixed; bottom:0px; right:20px; width: 139px; height: 73px;">
<table style="border: 0px; margin-left: auto; margin-right: auto;" width="100%">
<tr>
<td height="40" width="32%"></td>
<td height="40" width="61%"><img border="0" src="https://www.iltelaiodipenelope.it/gadget/bottoni_top_page/images/stellinedorate.gif" width="32" height="32" alt="" /></td>
</tr>
<tr>
<td align="center" colspan="2"><a href="javascript:history.back()"><img border="0" src="https://www.iltelaiodipenelope.it/gadget/bottoni_top_page/images/back_chiaro.png" width="53" height="15" alt="Torna indietro" /></a>
<a href="#top"><img border="0" src="https://www.iltelaiodipenelope.it/gadget/bottoni_top_page/images/top_chiaro.png" width="53" height="15" alt="Torna su..." /></a></td>
</tr>
</table></div>

<div style="border: 0px; background-image:url('https://www.iltelaiodipenelope.it/gadget/bottoni_top_page/images/penelope_bottoncino_top_8.png'); position:fixed; bottom:0px; right:20px; width: 141px; height: 75px;">
<table style="border: 0px; margin-left: auto; margin-right: auto;" width="92%">
<tr>
<td height="44" width="19%"></td>
<td height="44" width="74%"><img border="0" src="https://www.iltelaiodipenelope.it/gadget/bottoni_top_page/images/stellinedorate.gif" width="32" height="32" alt="" /></td>
</tr>
<tr>
<td align="center" colspan="2"><a href="javascript:history.back()"><img border="0" src="https://www.iltelaiodipenelope.it/gadget/bottoni_top_page/images/back_chiaro.png" width="53" height="15" alt="Torna indietro" /></a> 
<a href="#top"><img border="0" src="https://www.iltelaiodipenelope.it/gadget/bottoni_top_page/images/top_chiaro.png" width="53" height="15" alt="Torna su..." /></a></td>
</tr>
</table></div>

Versione pucciosa

<!-- Bottone TopPage - Penelope --> <div style="border: 0px; position:fixed; bottom:0px; right:30px; width: 91px; height: 150px;"> <a href="#top"><img border="0" src="https://www.iltelaiodipenelope.it/gadget/bottoni_top_page/images/penelope_toppage_micio.png" width="91" height="150" alt="Torna su"></a></div> <!-- Bottone TopPage - Penelope -->	<!-- Bottone TopPage - Penelope --> <div style="border: 0px; position:fixed; bottom:0px; right:30px; width: 162px; height: 138px;"> <a href="#top"><img border="0" src="https://www.iltelaiodipenelope.it/gadget/bottoni_top_page/images/penelope_topage_gufottox.png" width="162" height="138" alt="Torna su"></a></div> <!-- Bottone TopPage - Penelope -->	<!-- Bottone TopPage - Penelope --> <div style="border: 0px; position:fixed; bottom:0px; right:30px; width: 158px; height: 133px;"> <a href="#top"><img border="0" src="https://www.iltelaiodipenelope.it/gadget/bottoni_top_page/images/penelope_topage_fatinax.png" width="158" height="133" alt="Torna su"></a></div> <!-- Bottone TopPage - Penelope -->
<!-- Bottone TopPage - Penelope --> <div style="border: 0px; position:fixed; bottom:0px; right:30px; width: 138px; height: 128px;"> <a href="#top"><img border="0" src="https://www.iltelaiodipenelope.it/gadget/bottoni_top_page/images/penelope_toppage_cuore.png" width="138" height="128" alt="Torna su"></a></div> <!-- Bottone TopPage - Penelope -->	<!-- Bottone TopPage - Penelope --> <div style="border: 0px; position:fixed; bottom:0px; right:30px; width: 158px; height: 121px;"> <a href="#top"><img border="0" src="https://www.iltelaiodipenelope.it/gadget/bottoni_top_page/images/penelope_toppage_dolly.png" width="158" height="121" alt="Torna su"></a></div> <!-- Bottone TopPage - Penelope -->	<!-- Bottone TopPage - Penelope --> <div style="border: 0px; position:fixed; bottom:0px; right:30px; width: 158px; height: 88px;"> <a href="#top"><img border="0" src="https://www.iltelaiodipenelope.it/gadget/bottoni_top_page/images/penelope_toppage_cuoriciottox.png" width="158" height="88" alt="Torna su"></a></div> <!-- Bottone TopPage - Penelope -->
<!-- Bottone TopPage - Penelope --> <div style="border: 0px; position:fixed; bottom:0px; right:30px; width: 158px; height: 87px;"> <a href="#top"><img border="0" src="https://www.iltelaiodipenelope.it/gadget/bottoni_top_page/images/penelope_topage_vintagex.png" width="158" height="87" alt="Torna su"></a></div> <!-- Bottone TopPage - Penelope -->	<!-- Bottone TopPage - Penelope --> <div style="border: 0px; position:fixed; bottom:0px; right:30px; width: 159px; height: 79px;"> <a href="#top"><img border="0" src="https://www.iltelaiodipenelope.it/gadget/bottoni_top_page/images/penelope_toppage_nuvola.png" width="159" height="79" alt="Torna su"></a></div> <!-- Bottone TopPage - Penelope -->	<!-- Bottone TopPage - Penelope --> <div style="border: 0px; position:fixed; bottom:0px; right:30px; width: 138px; height: 63px;"> <a href="#top"><img border="0" src="https://www.iltelaiodipenelope.it/gadget/bottoni_top_page/images/penelope_toppage_fiore.png" width="138" height="63" alt="Torna su"></a></div> <!-- Bottone TopPage - Penelope -->

Commentario...

Scrivi qui per lasciare un saluto, una richiesta di aiuto,
un suggerimento o una critica ^_^

I vostri commenti in questa pagina...

	Gabriella ~ 25/09/2023 12:21:45
Bentornata Penelope , ho prelevato un tuo bellissimo bottone. Grazie di cuore !

	il mondo animato ~ 21/04/2015 16:20:23
ciao scusa il disturbo♥ volevo chiederti come fai a mettere le etichette (penso si chiamino così) che si trovano in alto come per esempio "home" "commenti" "e-mail" "amici" ecc.....♥ graie mille x l'aiuto.

	Penelope 20/10/2014 23:57:06
Ciao cara batù ^_^ hai ragione perdonami avevo dimenticato di scrivere che su blogger il tag delle immagini va chiuso con una slash / finale, ovvero dove vedi: <img [.......] alt="" metti la slash qui /> Un abbraccione ♥

	batù simo ~ 17/10/2014 17:11:11
Ciao Penny, ho provato ad inserire il codice di un bottone (sopra la riga body come hai ben spiegato tu) ma non va. ecco quale messaggio salta fuori: Errore di analisi XML, riga 640, colonna 171: The element type "img" must be terminated by the matching end-tag "".spero che tu possa dirmi comefare perchè mi piacciono moltissimo :-)

	Valentina! ~ 19/08/2014 15:49:00
Sono molto carini! Forse ne metterò uno! ♥ P.S Da diversi giorni ti chiedo di visitare il mio sito e di commentare così sò che l' hai visitato ma non lo fai! Perfavore, lo puoi visitare?!

~ Pagina visitata da 9616 utenti

H:
Buon Autunno !

Pagina Facebook
del telaio...

..:: Accessori e gadget ::..

ೡ Istruzioni per prelevare e postare
nel proprio spazio accessori e gadget del telaio

Sito o forum
Blogger-Blogspot

Anteprima...
..: html & script tutorial :..

Cbox

La Cbox è la mitica ciattina, piccolo accessorio indispensabile per parlare con i nostri amici "in tempo reale" vediamo come prelevarla, personalizzarla e postarla nel nostro spazio...

Leggi il tutorial...

Marquee

Un modo simpatico e sicuramente visibile per attirare l'attenzione in punti specifici di una pagina, scrittine o immagini che camminano...

Leggi il tutorial...

Table scroll

Nelle nostre table possiamo mettere lo scroll, affinché abbiano delle misure predefinite ma possano contenere lunghi testi o tante immagini...

Leggi il tutorial...

Box div con effetto rilievo

Pochi semplici parametri css3 per avere contenitori div con effetto rilievo, da utilizzare come contenitore principale del sito per non appesantire le pagine con elaborate basi grafiche, rendere visibile in modo elegante un boxino per messaggi/news o abbellire delle immagini senza formati particolari che si caricano con difficoltà...

Leggi il tutorial...

Font personalizzato nel sito...

Personalizzare con pochi semplici passaggi il font, carattere del testo, nel nostro sito o in una pagina web!

Leggi il tutorial...

Pioggia di gif...

Piccole gif che cadono come leggera pioggia, piccole magie del web! Si trovano diversi script in rete ma questo è al momento l'unico che non fa impazzire lo scroll nelle pagine e non ne sporca il codice...

Leggi il tutorial...

Box scroller

Script per box con scroll particolare, vediamo il codice e le personalizzazioni possibili...

Leggi il tutorial...

Frasi a rotazione o random

Script che permette di visualizzare una frase diversa ad ogni aggiornamento pagina, vediamo il codice e come fare le varie personalizzazioni...

Leggi il tutorial...

Una frase per ogni giorno della settimana

Un piccolo script che ci permetterà di visualizzare un saluto, una frase o una poesia diversa per ogni giorno della settimana...

Leggi il tutorial...

Immagine a rotazione - Random

Script per immagini che cambiano ogni volta che si aggiorna la pagina, si possono aggiungere quante immagini si vuole e anche un link per banner o piccole anteprime...

Leggi il tutorial...

Aggiorna il box

ೡ Visita la sezione Tutorial Home

..: Spazio web...

Realizzare e gestire un sito web
con l'hosting free più famoso...

Link del telaio...
Banner

I vostri messaggi...

Penelope
02/10/2023 17:01:02

Grazie infinite cara Grazia, mi dispiace molto vedere spazi trascurati quando poi basta avere un po' di pazienza per sistemare

ti ringrazio anche per aver aggiunto informazioni molto utili
Un abbraccio forte ♥

ೡ ...commentario

Grazia
01/10/2023 17:51:03

Ciao Penny, buona domenica! Hai fatto benissimo a scrivere questa guida sull'HTTPS, con Altervista hanno fatto le cose per bene, anche se si installa uno spazio web "classico", come hai scritto tu, e persino se si installa WordPress è tutto automatico, con un click nel pannello di controllo, ma non tutti lo sanno, era giusto farlo presente! Wordpress (che io adoro perchè è veramente versatile) dal canto suo, offre un'infinità di plugin per attivare l'https, il fatto è che bisogna essere molto, molto attenti, altrimenti il sito praticamente si "rompe" *-* Per fortuna quasi tutte le piattaforme si sono adeguate, tranne la bellissima Eklablog, non comprendo il perchè. Ok, perdona lo "sproloquio", un abbraccio ed alla prossima!!

ೡ Scritto in... Il telaio di Penelope...

Penelope
27/09/2023 17:12:31

Ciao Calcifer grazie infinite anche io sono felice di essere tornata

ೡ Scritto in... 'https' Hyper Text Transfer Protocol Secure

Calcifer
27/09/2023 15:08:42

AAh, che bello vederti di nuovo attiva! :) Aspettavo da anni il tuo ritorno ♥

ೡ Scritto in... 'https' Hyper Text Transfer Protocol Secure

Cleo
25/09/2023 17:58:11

ho fatto un giretto e' tutto ancora piu' bello un abbraccio e grazie per il banner inserito un abbraccio

ೡ Scritto in... *Amici del telaio...*

Gabriella
25/09/2023 12:21:45

Bentornata Penelope , ho prelevato un tuo bellissimo bottone. Grazie di cuore !

ೡ Scritto in... Bottoni top pagina

Grazia
24/09/2023 19:16:50

Ciao Penny cara, nel messaggio precedente ho omesso di scrivere quella che sembra una ovvietà, ma la scrivo lo stesso: il tuo sito è fantastico, come sempre, la maestra dei codici è tornata 😄😄😄😄 Un abbraccio e serena domenica sera di cuore ❤️

ೡ Scritto in... Il telaio di Penelope...

Grazia
21/09/2023 10:24:25

Carissima Penelope, è una gioia immensa leggerti di nuovo! Sono felicissima tu sia tornata online, hai fatto benissimo, gli hobby aiutano tantissimo a risollevare l'animo ...brava! Oltre al mio piccolo blogghino per esempio io mi sto dedicando ai disegni fatti a mano e mi rilassano tantissimo! Ti cerco su Fb così ci sentiamo, se ti fa piacere, più spesso...ti abbraccio immensamente cara amica, a presto!

ೡ ...commentario

Cleo
20/09/2023 16:39:32

Ciao tesoro i miei banner sono qui [Link]

ೡ Scritto in... Il telaio di Penelope...

Cleo
20/09/2023 12:48:48

Bentornata e' bellissimo rivedere il tuo Sito on line

ೡ ...commentario

Referer...