Blog: sito con sola Sticky Bar e Hambuger Menu 
Autore: Stefano T.
Visite 939,
Followers 3,
Condiviso 0
Se si crea un Blog in un sito senza Header con la sola Sticky Bar, la parte alta della Pagina Principale con i vari argomenti e la Pagina con il testo dell'Articolo vengono coperte dal nome del sito e dall'Hamburger Menu, rendendo impossibile leggere cosa c'è scritto.
E' possibile fare in modo che queste pagine (Principale e Articolo) si abbassino?
Grazie
Postato il
... da parte mia per il codice EXTRA devi postarmi il link, altrimenti attendi gli altri suggerimenti...
.
Tipo una cosa del genere? ESEMPIO
Autore
Esatto
vai in mappa proprietà pagina principale blog.
su esperto metti questo codice e regola l'altezza in base a quella che tu hai scelto per la stycky-bar
Mettilo in ► Prima della chiusura del tag head ▼
<style>
#imContent {
padding-top: 150px !important;
}
</style>
<style>
#imBlogSidebar {
padding-top: 70px !important;
}
</style>
Autore
Dimenticato..
Il sito è un template di Website in prova a cui ho aggiunto un blog: http://trialwebsite.altervista.org/
Il codice è valido per qualsiasi template con le caratteristiche dell'header posto a zero px.
x Stefano, ... ho visto il tuo Blog che ti avevo richiesto, ed il codice che ho sugerito in passato, simile al precedente, potrebbe essere questo:
<style>
#imContent {padding-top: 70px !important;}
#imStickyBar {background-color: rgba(255, 255, 255, 0.9)}
</style>
.
... incollare il codice in questa sezione nelle Proprietà della Pagina Speciale del BLOG:
>> Passo 3 - Mappa > Finestra 'Proprietà Pagina' > Le opzioni della Sezione Esperto | ▪Codice personalizzato: > 3^opzione > Prima della chiusura del tag HEAD
.
.
Autore
Ho provato sia il codice di Roberto M. che quello di KolAsim e funzionano entrambi, non avevo dubbi
Nel codice di Roberto M. si può anche modificare a che altezza far comparire la barra laterale: ottimo
Col codice di KolAsim posso cambiare colore alla sticky bar per quella pagina: ottimo
Potrei fonderli insieme:
<style>
#imContent {
padding-top: 150px !important;
}
</style>
<style>
#imBlogSidebar {
padding-top: 70px !important;
}
</style>
<style>
#imStickyBar {background-color: rgba(255, 255, 255, 0.9)}
</style>
Riguardo il codice di KolAsim imStickyBar {background-color: rgba(255, 255, 255, 0.9)}, se volessi avere la sticky bar trasparente basta non scrivere la riga di codice vero?
Grazie ad entrambi
Autore
Giusto così per completezza..
Se volessi che il codice imStickyBar {background-color: rgba(255, 255, 255, 0.9)}, mi creasse la sticky bar estesa a tutta la pagina?
Grazie
... in giallo, e poi cambi il colore se vuoi in bianco:
<style>
#imContent,#imBlogSidebar {top: 70px !important;}
#imStickyBarContainer {background-color: rgba(255, 255, 0, 0.9)}
</style>
.
Autore
Si OK, se voglio un altro colore cambio i codici RGB.
Se però volessi una Sticky Bar colorata (gialla, nero o altro) che occupi tutta la larghezza della pagina?
.. è già a tiitta larghezza, puoi provare anche in anteprima... ciao...
... per avere per esempio il colore rosso:
background-color: red
Ciao Kol. Applicando il colore alla barra non si estende in tutta la larghezza. La stessa cosa constatata da Stefano t. Se tu dici che si estende allora sbagliamo noi in qualche cosa.
... ciao, ...puoi verificare con un rapido copia-incolla ... ciao ...
...
.
Si funziona come dici tu solo se nelle impostazioni la barra la metti trasparente. Dato che avevo il nero all'85% il colore con il codice proposto si estendeva solo nel perimetro interno dell'header e non su tutta la pagina.
... certamente, ...barra e sfondo dovrebbero essere congrui per fondersi, oppure sfruttare le trasparenze come nell'esempio di Stefano; ...o a seconda delle personalizzazioni preferite...
.