Link di intestazione personalizzati (icone)

Ciao, questo componente funziona bene, tuttavia come si può fare in modo che i link creati ricevano una classe attiva quando si tratta di link su discourse (uguale), i miei elementi icona predefiniti hanno la classe attiva ma non quelli del componente

1 Mi Piace

Questo è un argomento piuttosto confuso, poiché l’OP viene aggiornato come una wiki, ma la maggior parte della discussione si riferisce a una versione del componente vecchia di alcuni anni.

L’argomento e l’OP suggeriscono che questo supporta icone grafiche oltre ai collegamenti di testo. L’Object Settings Editor, tuttavia, non ha un campo per definire un’icona. Ho provato ad aggiungere manualmente un’icona SVG:

"icon": "https://foo.svg",

Il pulsante grafico non viene visualizzato: ottengo invece un pulsante di collegamento di testo, basato sugli altri parametri del collegamento personalizzato. La vecchia discussione tra questo post e l’OP suggerisce che potrebbe essere necessario aggiungere qualcosa da qualche parte per abilitare l’icona SVG, ma cosa e dove?

Ehi,

Ti riferisci a questo componente del tema?

Questo componente del tema Custom Header Links (icons) non ha un’impostazione Object.
Potresti voler usare questo se hai bisogno di Header Links con supporto per le icone. :+1:

2 Mi Piace

Nota che ho appena migrato questo componente alle nostre nuove impostazioni dell’oggetto:

Ora dovrebbe essere molto più facile modificare le impostazioni.

2 Mi Piace

Ciao, provando ad aggiornare il componente Custom Header Links, ricevo questo errore: “Si è verificato un errore: Hai fornito parametri non validi per la richiesta: La proprietà in JSON Pointer ‘/3/url’ deve essere un URL valido.”

Sì, vedo cosa potrebbe causare questo… Lo schema dice url: true e infatti consentiamo URL relativi, quindi è solo una stringa e considerata un URL non valido.

Ci darò un’occhiata.

1 Mi Piace

Può mostrarmi le impostazioni del suo componente, per favore? Può inviarle in PM se preferisce.

Non sono a casa ora, lo farò al più presto.

1 Mi Piace

Ho risolto il problema direttamente con Patrick in un PM, se qualcuno sta riscontrando lo stesso problema, il problema è che con queste nuove impostazioni il controllo dell’URL è più rigoroso.

Qualsiasi URL che inserisci nelle impostazioni dovrebbe essere un URL codificato correttamente, la soluzione più semplice è usare encodeURI nella console di un browser:

Prendi questo URL come esempio: “/some-url?title=Foo bar:baz”

encodeURI("/some-url?title=Foo bar:baz")

Ti darà:

/some-url?title=Foo%20bar:baz
5 Mi Piace

Ciao, anche se non c’è modo di riordinare le icone, puoi farlo modificando lo script facendo clic sul pulsante “Editor” nel componente e riordinando le righe di codice:

1 Mi Piace

Esecuzione di 3.5.0.beta2-dev (137e8a0fa0). Sono 14 commit indietro.

Quando provo ad aggiornare ricevo un errore:

Si è verificato un errore: Hai fornito parametri non validi alla richiesta: La proprietà in JSON Pointer '/1/title' deve essere presente. La proprietà in JSON Pointer '/1/icon' deve essere presente. La proprietà in JSON Pointer '/1/url' deve essere presente.

C’è un modo per risolvere questo problema?

Puoi comunicarci le tue impostazioni facendo clic su Settings Editor?

Se è privato, puoi inviarmi un messaggio privato.

1 Mi Piace

Inviato a te, grazie!

1 Mi Piace

Solo un aggiornamento. Come sospettato, la migrazione è fallita per Wingtip per qualche motivo. Gli ho fornito le impostazioni corrette. Mi chiedo in quali condizioni le migrazioni possano fallire. :thinking:

MODIFICA:
In realtà, all’inizio non ha funzionato, quindi gli ho suggerito quanto segue:

Inoltre, per qualche motivo, non accettava impostazioni valide; ho dovuto reimpostare le impostazioni, aggiornare e poi riconfigurare con quelle corrette. Non è un grosso problema, non era necessaria una grande quantità di configurazione. Grazie ancora per l’aiuto!

1 Mi Piace

Introducing Font Awesome 5 and SVG icons

Ciao, non riesco a visualizzare un’icona svg personalizzata e gradirei il tuo aiuto per identificare cosa sto sbagliando.

Ho caricato un file svg nel tema predefinito:

Quindi ho aggiunto quanto segue a questo componente del tema:

image

image

Ho usato icons-sprite, fa-icons-sprite e fab-icons-sprite, ma l’svg non viene visualizzato. Il segnaposto c’è, si può cliccare e il link funziona, ma il rettangolo non contiene alcuna icona.

L’ispettore mostra questo:
<svg class="fa d-icon d-icon-fab-icons-sprite svg-icon svg-string" aria-hidden="true" xmlns="http://www.w3.org/2000/svg"><use href="#fab-icons-sprite"></use></svg>

Penso che dovrebbe essere spostato in un nuovo argomento Dev.

@icaria36
Puoi condividere il contenuto di Three_asterisks?

Il spritesheet segue un formato specifico.

Quindi, puoi usare my-theme-icon-1, my-theme-icon-2 come identificatori.

Maggiori informazioni sono disponibili su Replace Discourse's default SVG icons with custom icons in a theme.

2 Mi Piace

@Arkshine grazie mille! Ero arrivato a quella pagina ma apparentemente sono sceso troppo velocemente. No, non ho fatto quel compito con il file SVG. Ci proverò (prima volta che modifico il testo in un file SVG; c’è sempre una prima volta) :sweat_smile: e spero che sarà tutto. :folded_hands:

1 Mi Piace

Riesco a caricare le icone di Facebook, Instagram e TikTok con questo componente, ma non importa cosa provi, non riesco a caricare né l’icona originale di Twitter, né la nuova icona X.

Qualche suggerimento?

Forse aiuta se condividi la tua configurazione. Senza di essa, è difficile aiutarti.

Funziona bene per me
image