Home Hardware Networking Programmazione Software Domanda Sistemi
* Conoscenza del computer >> Domanda >> PC Risoluzione dei problemi >> .

Come aggiungere il breadcrumb nel sito Weebly?

L'aggiunta di breadcrumb a un sito Weebly è un processo semplice che implica la personalizzazione del codice HTML/CSS del tuo sito. I breadcrumb sono gli elementi di navigazione che forniscono una gerarchia della posizione della pagina corrente all'interno del tuo sito web. Ecco come puoi aggiungere breadcrumb al tuo sito Weebly:

Passaggio 1:modifica HTML/CSS

Apri l'editor del sito Weebly e vai alla pagina in cui desideri aggiungere breadcrumb.

Clicca su "Modifica HTML/CSS del sito" dal menu "Impostazioni".

Passaggio 2:inserisci lo snippet di codice

Nell'editor HTML/CSS, individua il tag "" e inserisci il seguente snippet di codice subito prima:

```html

```

Questo codice crea l'elemento contenitore per i breadcrumb e aggiunge il collegamento home.

Passaggio 3:personalizza il collegamento Home

Sostituisci il testo "Home" e il collegamento "/" nel codice con il testo e l'URL della home page del tuo sito web effettivo.

Passaggio 4:aggiungi ulteriori collegamenti

Per aggiungere ulteriori collegamenti ai breadcrumb, aggiungi più `

  • ` con tag `` all'interno dell'elemento `#breadcrumbs-list`, in questo modo:

    ```html

  • Categoria

  • Sottocategoria

  • Nome prodotto

    • ```

    Ciò creerà breadcrumb che mostrano la gerarchia dalla home page alla pagina del prodotto corrente.

    Passaggio 5:dai uno stile al breadcrumb

    Aggiungi stili CSS agli elementi "#breadcrumbs" e "#breadcrumbs-list" per controllare l'aspetto dei breadcrumb.

    Per esempio:

    ```css

    #pangrattato {

    sfondo:#e5e5e5;

    imbottitura:10px;

    }

    #elenco-breadcrumb {

    display:flessibile;

    }

    #lista-breadcrumb li {

    margine destro:10px;

    }

    ```

    Questo modellerà il breadcrumb come un elenco orizzontale con riempimento e uno sfondo grigio chiaro.

    Passaggio 6:salva le modifiche

    Fare clic sul pulsante "Salva" per salvare le modifiche.

    Ora, il tuo sito Weebly avrà breadcrumb che mostrano la gerarchia della posizione della pagina corrente.

    Ricorda che puoi personalizzare ulteriormente l'aspetto e la funzionalità dei breadcrumb modificando il codice HTML e CSS in base alle tue specifiche esigenze e preferenze di design.

    Informazioni correlate

    Articoli consigliati

     

    Domanda © www.354353.com