Pulsante whatsapp fluttuante
Autore: Pamela V.
Visite 1576,
Followers 3,
Condiviso 0
Buongiorno, ho creato un sito ed il Cliente mi ha chiesto di inserire il pulsante WhatsApp che galleggia in basso nella pagina come oggi se ne vedono molti. Ho utilizzato lo strumento "Messaggio pubblicitario" per farlo e va tutto bene, solo che resta bloccato nel punto in cui l'ho sistemato mentre vorrei che scorresse con la pagina (restasse sempre in basso invece di restare inchiodato lì dov'è e tra l'altro mi copre alcuni testi del sito). Come posso risolvere? Grazie mille.
P.S.: Ho appoggiato il sito temporaneamente su un hosting mio che uso per i test, potete vederlo qui: www.media-grafica.it
Postato il
una cosa del genere?
https://codepen.io/sinasoltani164/pen/gOXdgjB
oppure questo del programma:
https://market.websitex5.com/it/oggetti/28faeb70-63d3-4214-bd05-3bee5e4739c
x Pamela, ... io no so se ho capito cosa vorresti ottenere, ma se intendi di confinare il pulsante attuale in modo sempre visibile e sempre fisso nello scroll in basso a destra, magari sotto (o sopra) al GoToTop per non ostacolarlo, si potrebbe ottenere con semplice codice css EXTRA un qualcosa di simile a questa simulazione:
.
Autore
KolAsim, esatto. Mi serve proprio che faccia quello. Come faccio ad ottenere quel codice css? e poi dove lo metto? considera che ora l'ho configurato utilizzando "messaggio pubblicitario" come escamotage. Non sono una programmatrice e per me è complicato anche scrivere un codice seplice.
Grazie intanto per la risposta...
Autore
Giancarlo questo sarebbe fantastico ma non ho idea di come fare per renderlo visibile sul sito. immagino che quello che vedo sopra sia il codice ma poi come creo i link al numero di telefono? e alle pagine social? e soprattutto dove lo inserisco questo codice?
Grazie per la tua risposta, sarebbe una soluzione perfetta x me.
Autore
Mirko grazie, questo non l'avevo visto ma comunque per il mio cliente non va bene perchè funziona solo su mobile, a me servirebbe qualcosa che funziona anche su desktop. So che ormai oltre il 98% del traffico web è fatto da mobile ma preferisco creare dei siti che hanno massima versatilità. Gentilissimo, grazie infinite anche perché sicuramente lo utilizzerò in futuro per altri clienti.
https://wa.me/TUO_NUMERO_DI_TELEFONO
...x Pamela, ... se vuoi usare la tua struttura attuale, così com'è adesso, puoi risolvere istantaneamente con un elementare copia/incolla di questo mio codice:
<style>
.swing {position:fixed !important;bottom:-20px !important }
</style>
.................................
... nel Passo 3; ...devi selezionare la Home Page (casetta), poi andare in alto sul menu e cliccare su Proprietà + Esperto, quindi in > Codice personalizzato ed incolla il mio codice nella 3^opzione...
.
ciao
.
-
.
messo codice in oggetto HTML e CSS in esperto oggetto HTML
pagina
codice
esperto
non è proprio cosi, io nel mio sito ho messo un semplicissimo codice e lo vedo anche da desktop...
Ciao Giancarlo approfitto del thd. Ma per farlo scendere un po o addirittura che scorra con lo scrool come si fa? Si piazza in alto e quando scende la stiky da 150px lo copre.
Buongiorno Roberto, io ho messo 250px, ma puoi variarlo in base alle tue necessita.
Ciao.
Ah...ok ora provo
Funziona! Tank Giancarlo.
prego Roberto figurati, volendo se più pratico, anche la percentuale della pagina esempio 70%
.. io penso che si possa più semplicemente usare il pulsante collegamento previsto dal programma, e poi magari fissarlo dove lo si vuole...
certo che si, ma questo è gratis e semplice da personalizzare, ognuno è libero di dare la propria scelta.
Autore
Sei fantastico! funziona esattamente come volevo io. L'unica cosa è che sta praticamente attaccato al bordo in basso alla pagina. per farlo salire leggermente c'è un'opzione da inserire al codice?
intanto mi hai risolto in modo semplice un problema enorme quindi grazie ancora.
P.S.: è corretto lasciare come opzione "prima della chiusura del TAG HEAD"? Sta cosa non l'ho mai capita cosa significa ma non sono una programmatrice quindi immagino di essere scusata...
... come ti avevo detto, adesso viene posizionato sul fondo per non ostacolare il GoToTop...
... però in questo modo invece si posiziona appena sopra il GoToTop:
<style>
.swing {position:fixed !important;bottom:60px !important }
</style>
... basta controllare il valore della coordinata in bottom:60px
ciao
.
Autore
Grazie mille, sei stato davvero prezioso. Codice facile e versatile.
Bellissimo, ma scusate l'intrusione,
se volessi cambiare instagram con email?
e come inserire nelle righe di codice i riferimenti per essere contattato su whatsapp, telegram e mail?
grazie
Autore
Se utilizzi lo strumento "Messaggio pubblicitario" come ho fatto io basta che cambi l'icona e nel collegamento del messaggio pubblicitario metti quello che ti serve...
Ti allego screenshot
Autore
ti ho inviato il codice per email...