Cinque modi per nascondere la barra di navigazione di blogger / impedire le segnalazioni dannose

718次阅读
Nessun commento

共计 2321 个字符,预计需要花费 6 分钟才能阅读完成。

Cinque modi per nascondere la barra di navigazione di blogger / impedire le segnalazioni dannose

Vari modi per nascondere la barra di navigazione

Nelle piattaforme di blogging, molti utenti desiderano rimuovere la barra di navigazione predefinita o apportarvi modifiche personalizzate per rendere la pagina più concisa o per soddisfare le proprie esigenze di design. Ecco alcuni modi comuni per nascondere la barra di navigazione:

Metodo 1: Nascondere la barra di navigazione tramite CSS

Il modo più semplice per farlo è trovare nel file CSS del template del blog il parametro corpo prima del tag e poi aggiungere il seguente codice:

css复制代码#navbar-iframe {display:none !important;}

Questo codice verrà passato attraverso il metodo display:nessuno per nascondere la barra di navigazione, dove la barra Importante Assicura la priorità di questo stile e impedisce ad altri stili di sovrascrivere questa impostazione. Dopo aver applicato questo codice, la barra di navigazione non sarà più visualizzata, ma il layout della pagina non cambierà e non ci saranno spazi bianchi aggiuntivi.

Metodo 2: nascondere completamente la barra di navigazione e rimuovere gli spazi bianchi

Se si desidera non solo nascondere la barra di navigazione, ma anche rimuovere lo spazio occupato dalla barra di navigazione per evitare uno spazio vuoto nella parte superiore della pagina, è possibile utilizzare un codice più completo:

css复制代码#b-navbar,
#navbar,
#Navbar1,
#space-for-ie {height: 0px; visibility: hidden; display: none;}
body #header {margin-top: 0px !important;}
#navbar-iframe {display: none;}

Questo codice fa diverse cose:

  1. approvare (un disegno di legge, un'ispezione, ecc.) visualizzazione: nessuno Completamente nascosto. #b-navbar, #navbar, #Navbar1, #spazio-per-i e altri possibili elementi della barra di navigazione.
  2. utilizzare visibilità: nascosto Nascondere l'elemento passando l'opzione altezza: 0px Rimuovere l'altezza di questi elementi.
  3. body #header {margin-top: 0px !important;} Questa riga di codice rimuove gli spazi bianchi superiori che possono verificarsi quando si nasconde la barra di navigazione.

Metodo 3: Scorrere per nascondere la barra di navigazione

Se si preferisce un effetto di scorrimento per nascondere la barra di navigazione, si può utilizzare il codice seguente:

css复制代码#navbar-iframe{opacity:0.0;filter:alpha(Opacity=0)}
#navbar-iframe:hover{opacity:1.0;filter:alpha(Opacity=100, FinishedOpacity=100)}

Questo codice utilizza l'opzione opacità imposta la trasparenza della barra di navigazione a 0rendendola invisibile nel suo stato iniziale. Quando l'utente passa il mouse sull'area, la trasparenza diventa 1Verrà visualizzata la barra di navigazione. Questo metodo consente di ottenere un effetto di transizione omogeneo, più in linea con le esigenze del moderno web design.

Metodo 4: Nascondere completamente la barra di navigazione e gli spazi vuoti

Se si vuole solo nascondere la barra di navigazione e non si vuole che occupi spazio, si può aggiungere una nuova sezione nel file corpo etichette dopo #Pagina Aggiungete il seguente codice CSS davanti al tag:

css复制代码.Navbar {
    visibility: hidden;
    display: none;
}

Questo codice nasconde il campo .Navbar e attraverso l'elemento visualizzazione: nessuno Assicuratevi che non occupi spazio e che renda la pagina più pulita.

Metodo 5: Nascondere tramite JavaScript

Un altro approccio, più flessibile, consiste nell'aggiungere codice di script tramite elementi HTML/JavaScript che consentano di nascondere la barra di navigazione tramite un effetto set o slide. Ecco una soluzione comune:

  1. Aggiungere un elemento “HTML/JavaScript” alle impostazioni del modello.
  2. Incollare il seguente codice JavaScript in questo elemento:
html复制代码<script src="http://blogger-ext2.googlecode.com/files/jquery.pack.js" type="text/javascript"></script>
<script src="http://blogger-ext2.googlecode.com/files/blogger_ext2-core-0.6.3.pack.js" type="text/javascript"></script>
<script>
  // Blogger NavBar设置
  BloggerExtOptions.hide_navbar = true; // true = 隐藏导航栏
  BloggerExtOptions.fade_navbar = true; // true = 启用滑动隐藏效果
</script>

Questo codice viene passato attraverso il metodo BloggerExtOptions.hide_navbar = vero Impostare la barra di navigazione nascosta con il comando BloggerExtOptions.fade_navbar = true L'effetto Slide hide è abilitato per consentire agli utenti di vedere l'animazione della barra di navigazione al passaggio del mouse.


Icone del sito web personalizzate

Oltre a nascondere la barra di navigazione, molti utenti di blog desiderano personalizzare le icone del sito. Questo può essere fatto aggiungendo file di icone personalizzati. In genere, i file di icone sono .ico è possibile impostare l'icona del formato seguendo la procedura seguente:

  1. Nel modello di blog <head> Aggiungere il seguente codice HTML alla sezione: html copy code.
  2. comandante in capo (militare) "Indirizzo dell'icona" Sostituire l'URL con l'URL dell'icona personalizzata. Ad esempio, se il file dell'icona è memorizzato nella cartella http://example.com/favicon.icoSe il codice non è nel posto giusto, dovrebbe essere come segue: html copy code<link rel="Shortcut Icon" href="http://example.com/favicon.ico"> <link rel="Bookmark" href="http://example.com/favicon.ico">

Una volta impostata questa impostazione, quando si visita il sito web, la scheda, la barra degli indirizzi o la barra dei segnalibri del browser visualizzeranno l'icona specificata invece di quella predefinita.


riassunti

Con questi metodi è possibile nascondere la barra di navigazione, regolare il layout della pagina o personalizzare le icone a seconda delle necessità, rendendo il blog più in linea con le proprie esigenze di design. Ogni metodo ha i suoi scenari applicabili e potete scegliere il modo più adatto per apportare modifiche in base alle vostre esigenze. Spero che questi metodi possano aiutarvi a personalizzare e ottimizzare meglio il vostro blog!

正文完
 0
Signor wang
版权声明: 猫 UN'IDEA CHE NON HA SENSO.本站原创文章,由 Signor wang 于2024-11-17发表,共计2321字。
转载说明: 竄SI TRATTA DI UN'OPERAZIONE CHE NON HA NULLA A CHE VEDERE CON IL NOSTRO LAVORO.Se non diversamente indicato, questo sito è pubblicato con licenza CC BY 4.0. Si prega di indicare l'autore della riproduzione "Technology Lao Wang" e il link alla fonte originale; qualsiasi riproduzione non attribuita, la rimozione della fonte o il comportamento di lavaggio sono considerati una violazione del copyright.
Raccomandazione di RackNerd per un VPS conveniente AI Preferito dai costruttori di siti web principianti Stabile solo 10°+ Movers VPS Raccomandazione