Testo trasparente con le immagini sotto che si vedono attraverso 
Autore: Bass H.
Visite 1280,
Followers 1,
Condiviso 0
Ciao ragazzi,
ho comprato il template "Bill Marsh", in Home ci sono delle immagini che scorrono con effetto parallasse.
prima domanda: e' possibile rendere il testo sopra queste immagini trasparente? nel senso che le immagini sotto si vedono attraverso il testo?
seconda domanda: sul testo è possibile modificare il bordo (detto anche outline) ? Possiedo la versione 17.1.2
Quindi fare un testo trasparente con il solo outline colorato
Grazie
Postato il
Ciao @Bass H.
per agire sulla trasparenza del testo dovrai usare del codice Extra e Incomedia non fornisce supporto per i codici Extra, quindi ti spiego brevemente.
In questo specifico caso, io mi sto basando sulla pagina di Preview del Template presa QUI perchè non ho un tuo link alla pagina cui fai riferimento, anzi, CONSIGLIO:
quando chiedi aiuto posta sempre un collegamente alla pagina su cui vuoi essere aiutato.
Detto questo, sopra la prima immagine parallasse che vedo in Home, cioè questa >
gli ID dei due testi sono:
#imTextObject_23_tab0 .cf1 > per questo testo > "Bill Marsh Quality Policy"
#imTextObject_23_tab0 .cf2 > per questo testo > "Praesent ornare, velit sed placerat viverra, risus neque cursus tellus, et efficitur turpis dolor ut sem. Suspendisse vitae lacus hendrerit, convallis nulla in, congue purus."
Al momento questi due testi sono impostati con due colori senza trasparenza:
rgb(255, 255, 255); il primo testo, che sarebbe BIANCO pieno e
rgb(228, 228, 228); il secondo testo, che sarebbe un grigo chiaro pieno.
Per impostare una trasparenza, bisogna inserire un valore in percentuale fra le parentesi, esempio:
rgb(255, 255, 255, 50%);
Per cambiare il colore invece, che è in rgb, ti basta cambiare questo 255, 255, 255 dentro le parentesi, con il rispettivo valore del colore che andrai a scegliere. Tutto ciò è più difficile a dirsi che a farsi, comunque.
Quindi, dopo aver individuato i tuoi ID, al Passo 3 Mappa > Pagina Home > Tasto Proprietà della Pagina > Sezione Esperto > Prima della chiusura del tag HEAD > inserisci questo codice >
<style>
#imTextObject_23_tab0 .cf1 {
color: rgb(255, 255, 255, 50%);
}
#imTextObject_23_tab0 .cf2 {
color: rgb(255, 255, 255, 50%);
}
</style>
In grassetto i TUOI ID.
PS: ovviamente la percentuale ora io l'ho impostata a 50%, ma tu potrai modificarla a tuo piacere.
Per tutti gli altri testi, dovrai fare la stessa cosa, dopo aver individuato gli ID degli interessati.
Per trovare l'ID di un oggetto sul tuo sito ti lascio a un video del buon Giuseppe Guida.
LINK AL VIDEO
Spero di esser stato d'aiuto. Se hai problemi son qui.
Ciao.
Autore
Grazie 1000 per l'esaustiva risposta. Per quanto concerne il punto 2, come si fa invece ad impostare l'outline delle scritte? (colore e spessore)
Grazie ancora
Autore
ciao, ho individuato l'oggetto, inserito nell'area esperto il codice:
<style>
#imTextObject_62_tab0 .cf1 {
color: rgb(255, 255, 255, 100%);
}
</style>
non cambia nulla purtroppo...
... per facilitare ad essere aiutato dovresti postare il LINK del tuo esempio online(*), un click al Passo_5...
(*) ... o in sotto directory o in spazio WEB free, per esempio su Altervista che usano quasi tutti per i test reali...
.
Autore
Ciao,
il sito è sito prova
il testo è quello bianco in cima alla home page con le immagini dell'ufficio bianco e blu sotto. ho appena tolto il codice nell'area "esperto" per non dimenticarmelo lì. Grazie
<style>
#imTextObject_62_tab0 .imHeading1 *{color: rgba(255,255,255, 0.4) !important;-webkit-text-stroke: 1px navy !important}
</style>
.
ciao
.
attenzione, hai impostato 100% trasparenza, qui di senza trasparenza... più abbassi la percentuale più diventerà trasparente il testo.
Autore
Kolasim, funziona con il tuo codice, giusto per capire l'outline quale sarebbe? Magari solo quello vorrebbe cambiarlo in nero o farlo piu' spesso. Grazie
... qui tutte le regole relative: https://www.w3docs.com/learn-css/text-stroke-width.html
.