Possibilità di aggiungere una sezione personalizzata di link alla barra laterale

[mcwumbly (Dave McClure)]

Vogliamo consentire agli utenti di aggiungere una sezione personalizzata di collegamenti alla loro barra laterale.

Nella prima fase di questa funzionalità, prevediamo di espandere la pagina delle preferenze della barra laterale esistente e consentire a un utente di aggiungere una singola sezione personalizzata per questi collegamenti.

Pensiamo che possa funzionare più o meno così:

1. checkbox per “Mostra sezione personalizzata”.
   Se selezionato, la Sezione personalizzata appare sopra la Sezione categorie e i valori devono avere un Nome valido e almeno un Link valido per “Salva modifiche”
2. casella di testo per il Nome della sezione personalizzata (predefinito: I miei link, non può essere vuoto)
3. pulsante per “Aggiungi link”. quando cliccato, mostra la finestra di dialogo per aggiungere il link
4. I link aggiunti mostrano un pulsante per rimuoverlo

Finestra di dialogo Aggiungi link

1. La finestra di dialogo Aggiungi link ha due caselle di testo: Nome, URL
2. Il Nome non può essere vuoto, può includere emoji (che dovrebbero essere visualizzate nella barra laterale)
3. L’URL deve essere un link all’interno dello stesso sito Discourse*
4. Salva aggiunge il link, Annulla lo scarta

Quando una sezione personalizzata valida viene configurata e salvata, la barra laterale mostrerà quella sezione sopra “Categorie”.

* Perché?

1. Vorremmo poter “evidenziare”/“in grassetto” il link nella barra laterale quando ci si trova nella pagina corrispondente.
2. Vorremmo memorizzare la parte del “percorso”, in modo che le rinomine del sito funzionino come previsto.

---

Pensiamo che l’aggiunta di link oggi sarà preziosa perché consentirà alle persone di accedere facilmente a cose come “bug aperti della barra laterale” e ci consentirà di sfruttare eventuali miglioramenti futuri per gli elenchi di argomenti come filtri migliorati per gli elenchi di argomenti. Finché le cose avranno un URL, le persone potranno aggiungerle alla loro barra laterale.

Pensiamo che gli utenti vorranno poter aggiungere più sezioni e riordinarle, ma inizialmente manterremo questo fuori dall’ambito.

[bletch (Danny Goodall)]

Una domanda su questo, @mcwumbly. Questo sembra una strategia per permettere a un utente di aggiungere collegamenti personali alla barra laterale. Questo approccio permetterebbe ai proprietari del sito di aggiungere collegamenti che tutti gli utenti vedrebbero?

Spoiler - Penso di sì.

[mcwumbly (Dave McClure)]

@bletch

Questo approccio consentirebbe ai proprietari del sito di aggiungere collegamenti che tutti gli utenti vedrebbero?

Sì, penso che potrebbe certamente essere ampliato per fare qualcosa del genere, e vedo come sarebbe una funzionalità più utile per alcuni siti rispetto a quella dell’utente.

[xan2622]

Mi piace molto questa idea.

Solo alcune domande:

1. Ci sarà un limite al numero di link personalizzati che un utente potrà aggiungere?

2. La fine dei link (nella barra laterale) sarà troncata come nel mockup seguente? (Per me andrebbe bene).
   E se lo saranno, l’utente potrà leggere il testo per intero in un tooltip (se il cursore del mouse si posiziona sui link)?
   

   

[mcwumbly (Dave McClure)]

@xan2622

Ci sarà un limite al numero di collegamenti personalizzati che un utente potrà aggiungere?

Ottima domanda. Probabilmente dovremo prevedere dei limiti, ma non è qualcosa di cui abbiamo discusso in dettaglio. Che tipo di limiti speri di vedere (o di evitare)?

[xan2622]

All’inizio pensavo che 10 link potessero bastare, ma immagino che altri membri del forum ne vorranno di più. Forse 20. Ecco perché, proverei con 20 e aspetterei il feedback degli utenti per vedere se ne richiederanno altri (ma penso che 20 sia già un buon numero).

[xan2622]

Per estendere la “facilità d’uso” di questa funzionalità, sarebbe molto utile consentire all’utente di trascinare e rilasciare collegamenti (qualsiasi collegamento dalla pagina Discourse corrente) direttamente nella barra laterale.

Un puntatore (tra i collegamenti precedentemente aggiunti alla DIV “I miei collegamenti”) indicherebbe dove verrebbe posizionato il collegamento.

Mock-up (fare clic con il pulsante destro del mouse \u003e “apri immagine in una nuova scheda” per vedere l’animazione a dimensioni intere):

Forse la seguente pagina potrebbe aiutare nell’implementazione del drag and drop?

The HTML5 Drag and Drop API  |  Articles  |  web.dev

[mcdanlj (Michael K Johnson)]

Mi piacerebbe poter impostare link predefiniti per il mio sito, che gli utenti potrebbero chiudere. Ciò renderebbe le cose decisamente migliori rispetto ai link personalizzati dell’intestazione che uso ora, per come la vedo io.

[V1ktor (Viktor N.)]

+1 per l’aggiunta di link personalizzati. Avevamo alcuni link personalizzati aggiunti al menu a discesa originale. Sarebbe bello aggiungerli di nuovo, in modo simile a come Discourse stesso ha “Compleanni” e “Documenti” sotto l’opzione “Altro”.

[Olivier_Lambert]

Ehi a tutti!

Mi stavo chiedendo come potrei aggiungere dei link alla nuova barra laterale.

Non sembra esserci alcun connettore in quell’area…

Quale sarebbe il modo più efficace per farlo?

---

Modifica

La mia domanda è stata spostata qui… Non sono sicuro del perché, dato che sto chiedendo la stessa cosa.

In ogni caso, ecco cosa ho fatto per risolverlo. NON è una soluzione elegante e sarebbe molto meglio se ci fosse un modo per integrarsi con il sistema di templating di Discourse.

Ecco qui:

<script>
    let logo = "" // Ho rimosso i percorsi SVG perché non ne avete bisogno.
    const div = document.createElement('div') // Crea il link da aggiungere
    div.className = 'sidebar-section-link-wrapper' // aggiungi le classi pertinenti
    div.innerHTML = `
          <a title="Tous les sujets" href="https://www.latranchee.com" id="ember12" class="sidebar-section-link sidebar-section-link-everything sidebar-row ember-view">
            <span class="sidebar-section-link-prefix icon">
              <svg viewBox="0 0 100 100" class="logoIcon" xmlns="http://www.w3.org/2000/svg">${logo}</svg>
            </span>
            <span class="sidebar-section-link-content-text"> Accueil </span>
          </a>
    ` // Popola il link

    $( document ).ready(() => { // Questo è necessario per aspettare che Ember finisca la sua cosa
        // aggiungi navigazione su desktop
        let desktop = document.getElementsByClassName('sidebar-section-content')[0];
        if(desktop) desktop.prepend(div)

        // aggiungi navigazione su mobile
        let hamburger = document.getElementById('toggle-hamburger-menu').addEventListener("click", addMobileNav);
        function addMobileNav () {
            setTimeout(function(){ // Forza ad aspettare che la navigazione sia stata caricata
                document.getElementsByClassName('sidebar-section-content')[0].prepend(div);
            }, 0);
        }
    })
</script>

Risultato su desktop…

& Risultato su mobile:

Fino a quando non ci sarà un modo migliore, questo dovrà bastare!

Modifica #2

Ho riordinato il codice in modo che le navigazioni vengano caricate da un array di oggetti.

<script>
  let rss = `<path d="M5,3H19A2,2 0 0,1 21,5V19A2,2 0 0,1 19,21H5A2,2 0 0,1 3,19V5A2,2 0 0,1 5,3M7.5,15A1.5,1.5 0 0,0 6,16.5A1.5,1.5 0 0,0 7.5,18A1.5,1.5 0 0,0 9,16.5A1.5,1.5 0 0,0 7.5,15M6,10V12A6,6 0 0,1 12,18H14A8,8 0 0,0 6,10M6,6V8A10,10 0 0,1 16,18H18A12,12 0 0,0 6,6Z"></path>`
  let mdiSchool = `<path d="M12,3L1,9L12,15L21,10.09V17H23V9M5,13.18V17.18L12,21L19,17.18V13.18L12,17L5,13.18Z"></path>`
  let logo = `<g xmlns="http://www.w3.org/2000/svg" fill="#0e1e2b">
    <path d="M77.4 196.2 c-8 -6.9 -11.4 -16.9 -11.4 -33.2 0.1 -20.9 2.4 -30.2 6.7 -27.4 2.9 1.8 4.3 9.4 5.4 28.9 0.9 16.5 1.4 19.8 3.6 25 1.3 3.3 2.5 6.7 2.6 7.5 0.3 2.6 -3.6 2.1 -6.9 -0.8z"/>
    <path d="M2.9 167.3 c-5.1 -6.1 11.2 -24.2 21.9 -24.3 2.6 0 2.7 1.1 0.6 5.5 -1.4 3 -12.6 13.5 -14.3 13.5 -0.4 0 -1.4 1.2 -2.1 2.6 -2 3.6 -4.5 4.8 -6.1 2.7z"/>
    <path d="M87.4 160.5 c-1.9 -1.9 -2.4 -3.4 -2.2 -5.8 0.4 -4.5 3.2 -4.7 7.4 -0.6 3.9 3.8 4.1 4.9 1.6 7.2 -2.5 2.3 -3.9 2.1 -6.8 -0.8z"/>
    <path d="M126.5 158.9 c-6 -3 -10 -7.4 -17 -18.6 -7.6 -12.2 -8.2 -13.8 -5.8 -15.2 2.8 -1.5 7.3 1.8 21.3 15.4 6.9 6.8 13.5 12.6 14.7 12.9 2.7 0.8 3.9 4.2 2.3 6.1 -1.8 2.2 -10.7 1.8 -15.5 -0.6z"/>
    <path d="M36.2 156.7 c-1.5 -1.8 -1.8 -7.8 -0.4 -10.3 1.9 -3.6 3.8 -4.7 6.1 -3.4 1.7 0.9 2.1 2 2.1 6.1 0 2.8 -0.5 5.9 -1 7 -1.2 2.2 -5.2 2.5 -6.8 0.6z"/>
    <path d="M121.5 116 c-0.8 -2.5 1.1 -5.1 3 -4.4 2 0.8 2.7 3.4 1.4 5 -1.7 2 -3.7 1.7 -4.4 -0.6z"/>
    <path d="M4.3 113 c-2.6 -1.1 -2.8 -1.9 -1 -4.4 1.5 -2 7.5 -2.9 9.5 -1.4 1.8 1.5 1.5 4.6 -0.7 5.8 -2.3 1.2 -4.8 1.2 -7.8 0z"/>
    <path d="M32.7 82 c-6.3 -4 -10.3 -9.9 -13.2 -19.4 -2.5 -8.8 -4 -24 -2.7 -29.5 0.9 -4.2 3.4 -6.1 6 -4.5 1.7 1.1 1.9 2 4.6 17.9 1.8 10.8 7.3 22.5 14.1 30.3 2.8 3.1 4.5 5.8 4.1 6.7 -1 2.6 -7.7 1.8 -12.9 -1.5z"/>
    <path d="M133.6 80.4 c-2.1 -2.1 -2 -2.9 0.6 -5.4 2.8 -2.6 6.6 -3.6 8.6 -2.3 2.5 1.5 2.4 2.9 -0.3 6.2 -2.9 3.4 -6.4 4 -8.9 1.5z"/>
    <path d="M93.3 73.3 c-2 -0.8 -1.6 -2.8 2.6 -11.1 7.1 -14.1 10.8 -19.4 22.7 -31.9 9.8 -10.5 12.1 -12.4 14.3 -12.1 1.5 0.2 2.7 1 2.9 2 0.6 3.2 -18 29.9 -29.4 42.1 -6 6.5 -11.1 11.7 -11.4 11.6 -0.3 0 -1.1 -0.3 -1.7 -0.6z"/>
    <path d="M61.7 56.2 c-2.7 -3 -3.3 -7.9 -1.2 -10.2 1 -1.1 2.4 -2 3.1 -2 2.1 0 4.4 4.2 4.4 8 0 5.6 -3.1 7.7 -6.3 4.2z"/>
    <path d="M96.2 18.8 c-4.2 -4.2 4 -19.3 8.8 -16.3 1.8 1.1 1 6.9 -1.7 12.2 -2.6 5.3 -4.7 6.5 -7.1 4.1z"/>
    </g>`

  const div = document.createElement("div")
  div.className = "sidebar-section-link-wrapper"
  div.innerHTML = `
            <a href="https://www.latranchee.com" class="sidebar-section-link sidebar-section-link-everything sidebar-row">
              <span class="sidebar-section-link-prefix icon">
                <svg viewBox="0 0 100 100" class="logoIcon" xmlns="http://www.w3.org/2000/svg">${logo}</svg>
              </span>
              <span class="sidebar-section-link-content-text"> Accueil </span>
            </a>
      `

  const customHeader = document.createElement("div")
  customHeader.className = "sidebar-section-wrapper sidebar-section-community"
  customHeader.innerHTML = `
            <div class="sidebar-section-header-wrapper sidebar-row">
              <button id="ember11" class="sidebar-section-header sidebar-section-header-collapsable btn-flat btn no-text" type="button">
                <span class="sidebar-section-header-text"> Camp d'entraînement </span>
              </button>
          </div>
          <div class="sidebar-section-content" id="customNavigation"></div>
      `

  $(document).ready(function () {
    // Crea i link
    const links = [
      { title: "Accueil", src: "https://www.latranchee.com", svg: logo, viewbox: "0 0 100 100" },
      { title: "Formations", src: "https://www.latranchee.com/formations", svg: mdiSchool, viewbox: "2 -2 16 16" },
      { title: "Blogue", src: "https://www.latranchee.com/blogue", viewbox: "1 -3 16 16", svg: rss },
    ]

    // Mobile
    let hamburger = document.getElementById("toggle-hamburger-menu")
    if (hamburger) {
      hamburger.addEventListener("click", addCustomLinks)
    } else {
      addCustomLinks()
    }

    let bool = false;
    function addCustomLinks() {
      setTimeout(function () {
        // Forza ad aspettare che la navigazione sia stata caricata
        const sidebar = document.getElementsByClassName("sidebar-sections")[0]
        if (sidebar) {
          sidebar.prepend(customHeader)
          if (bool) return;
          // Ottieni l'ID di customNav
          const customNavigation = document.getElementById("customNavigation")
          if (customNavigation) {
            links.filter(function (link) {
              let linkDiv = document.createElement("div")
              linkDiv.className = "sidebar-section-link-wrapper"
              linkDiv.innerHTML = `<a href="${link.src}" class="sidebar-section-link sidebar-section-link-everything sidebar-row ember-view">
                        <span class="sidebar-section-link-prefix icon" id="link_${link.title}"></span>
                        <span class="sidebar-section-link-content-text"> ${link.title} </span>
                    </a>
                  `
              customNavigation.append(linkDiv)
              let linkIcon = document.getElementById("link_" + link.title)
              if (linkIcon && link.svg) {
                linkIcon.innerHTML = `<svg viewBox="${link.viewbox}" class="logoIcon" xmlns="http://www.w3.org/2000/svg"> ${link.svg}</svg>`
              }
            })
          }
        }
        bool = true
      }, 0)

    }
  })
</script>

Spero che questo possa aiutare qualcuno!

[jrgong]

+1 da parte mia. Un po’ più di personalizzazione per la barra laterale, come collegamenti personalizzati o magari anche più pulsanti in alto, sarebbe fantastico!

[rahim123]

Grazie per aver preso in considerazione questo, penso che per la base di utenti del mio forum questa sia una funzionalità piuttosto importante. Gli utenti di solito sono terribili nello scoprire anche informazioni leggermente nascoste e ho bisogno di aggiungere alcuni collegamenti importanti come “Contatta l’amministratore” e “Regole del forum”. Non mi dispiace se vanno direttamente sotto l’intestazione Community, ma sicuramente non verranno scoperti sotto il menu Altro. Anche la flessibilità di avere collegamenti interni ed esterni sarebbe importante, i collegamenti esterni sono attualmente non funzionanti nel menu hamburger personalizzato:

Custom Hamburger Menu Links

I took a look at Discourse’s sidebar code and @manuel icons addition. It seems that currently, it’s not possible to customize the icon’s custom links because the hamburger menu decoration method doesn’t take into account the prefixValue constant (which contains the icon’s name) or something like that… It also seems to me that hamburger-menu decorations with api.decorateWidget are going to be depreciated. See: Also, the fact that external links don’t work anymore could come from this: So th…

[Ryan_Hyer]

Ecco un altro esempio che spero sarà utile a qualcuno, basato pesantemente sugli esempi precedenti. Questo codice non aggiunge una sezione completamente nuova, ma aggiunge collegamenti aggiuntivi in fondo al pannello “Altro” nella sezione Community (ma prima dei collegamenti FAQ e Informazioni nel footer). Supporta le icone FontAwesome (presumendo che siano aggiunte nelle impostazioni del sito) e i collegamenti esterni. Gestisce i casi limite in cui la barra laterale viene chiusa e riaperta, e/o la sezione Community viene compressa e riaperta. Funziona su desktop e mobile.

Non sono un esperto di JavaScript, quindi mi scuso per qualsiasi codice errato o non ottimale. Sul mio sito, almeno, sembra funzionare come previsto.

Basta inserire questo codice nella scheda Header di un componente del tema e personalizzarlo secondo necessità:

<script>
const links = [
    // Le icone FontAwesome potrebbero dover essere aggiunte nelle impostazioni del sito se non appaiono correttamente
    { title: "Il mio account", src: "/my/billing/subscriptions", icon: "file-invoice-dollar" },
    { title: "Directory utenti", src: "/u?asc=true&cards=yes&order=username&period=all", icon: "address-book" },
    { title: "Documenti", src: "/docs", icon: "book-reader" },
    { title: "Sito esterno", src: "https://google.com/", icon: "globe" }
]

$(document).ready(function () {
    if (document.getElementById("toggle-hamburger-menu")) {
        // Siamo in visualizzazione mobile
        addToggleListener(document.getElementById("toggle-hamburger-menu"))
    } else {
        // Siamo in visualizzazione desktop
        addToggleListener(document.getElementsByClassName("btn-sidebar-toggle")[0])
        addHeaderListener()
        addMoreListener()
    }

    function addToggleListener(toggleEl) {
        if (toggleEl) {
            toggleEl.addEventListener("click", function () {
                // Aspetta un po' che la barra laterale venga caricata
                setTimeout(function() {
                    let sidebar = document.getElementsByClassName("sidebar-section-header").length
                    if (sidebar) {
                        addHeaderListener()
                        addMoreListener()
                    }
                }, 100)
            })
        }
    }

    function addHeaderListener() {
        let communityHeader = document.getElementsByClassName("sidebar-section-header")[0]
        if (communityHeader) {
            communityHeader.addEventListener("click", function () {
                // Aspetta un po' che la sezione venga espansa
                setTimeout(function() {
                    let communitySection = document.getElementById("sidebar-section-content-community")
                    if (communitySection) {
                        addMoreListener()
                    }
                }, 100)
            })
        }
    }
    
    function addMoreListener() {
        let buttonMore = document.getElementsByClassName("sidebar-more-section-links-details")[0]
        if (buttonMore) {
            buttonMore.addEventListener("click", addCustomLinks)
        }
    }
    
    function addCustomLinks() {
        // Aspetta un po' finché la navigazione non è stata caricata
        setTimeout(function () {
            const parentEl = document.getElementsByClassName("sidebar-more-section-links-details-content-main")[0]
            let linksAlreadyAdded = document.getElementsByClassName("sidebar-section-custom-link").length
        
            if (parentEl && !linksAlreadyAdded) {
                links.filter(function (link) {
                    let linkDiv = document.createElement("li")
                    let linkTitleTrim = link.title.replace(/\s+/g, '')
                    linkDiv.className = "sidebar-section-link-wrapper sidebar-section-custom-link"
                    linkDiv.innerHTML = `<a href="${link.src}" class="sidebar-section-link sidebar-section-link-everything sidebar-row ember-view">
                            <span class="sidebar-section-link-prefix icon" id="link_${linkTitleTrim}"></span>
                            <span class="sidebar-section-link-content-text"> ${link.title} </span>
                        </a>
                      `
                    parentEl.append(linkDiv)
                    
                    let linkIcon = document.getElementById("link_" + linkTitleTrim)
                    if (linkIcon && link.icon) {
                        linkIcon.innerHTML = `<svg viewBox="0 0 640 512" class="fa d-icon svg-icon prefix-icon svg-string d-icon-${link.icon}" xmlns="http://www.w3.org/2000/svg">
                                <use xlink:href="#${link.icon}"></use>
                            </svg>
                        `
                    }
                })
            }
        }, 100)
    }
})
</script>

[rahim123]

@Ryan_Hyer Molto bello! Hai scoperto il modo per far apparire (o continuare ad apparire) gli elementi dopo l’evento di attivazione dell’hamburger, che era il problema che stavo riscontrando qui:

Custom Hamburger Menu Links

There is a quirk with this method where the custom div disappears when toggling the visibility of the sidebar, for example if the browser window is narrow. This is a problem especially for tablets, which usually get the desktop version of Discourse and require clicking on the hamburger menu to display the sidebar. Any possible workarounds? Thanks! Edit: Solved here:

Anche il tuo codice è molto ordinato e pulito. Grazie a questo sono riuscito a modificarlo per visualizzare ciò che desidero nel menu Community senza che venga nascosto sotto Altro:

Head:

<script>

const links = [
    // Le icone FontAwesome potrebbero dover essere aggiunte nelle impostazioni del sito se non appaiono correttamente
    { title: "Directory Utenti", src: "/u?asc=true&cards=yes&order=username&period=all", icon: "address-book" },
    { title: "Documenti", src: "/docs", icon: "book-reader" },
    { title: "Sito Esterno", src: "https://google.com/", icon: "globe" }
]

$(document).ready(function () {
    if (document.getElementById("toggle-hamburger-menu")) {
        // Siamo in visualizzazione mobile
        addToggleListener(document.getElementById("toggle-hamburger-menu"))
    } else {
        // Siamo in visualizzazione desktop
        addToggleListener(document.getElementsByClassName("btn-sidebar-toggle")[0])
        addCustomLinks()
    }

    function addToggleListener(toggleEl) {
        if (toggleEl) {
            toggleEl.addEventListener("click", function () {
                // Aspetta un po' che il pannello laterale venga caricato
                setTimeout(function() {
                    let sidebar = document.getElementsByClassName("sidebar-section-header").length
                    if (sidebar) {
                        addCustomLinks()
                    }
                }, 100)
            })
        }
    }
    
    function addCustomLinks() {
        // Aspetta un po' finché la navigazione non viene caricata
        setTimeout(function () {
            const parentEl = document.getElementsByClassName("sidebar-section-content")[0]
            let linksAlreadyAdded = document.getElementsByClassName("sidebar-section-custom-link").length
        
            if (parentEl && !linksAlreadyAdded) {
                links.filter(function (link) {
                    let linkDiv = document.createElement("li")
                    let linkTitleTrim = link.title.replace(/\s+/g, '')
                    linkDiv.className = "sidebar-section-link-wrapper sidebar-section-custom-link"
                    linkDiv.innerHTML = `<a href="${link.src}" class="sidebar-section-link sidebar-section-link-everything sidebar-row ember-view">
                            <span class="sidebar-section-link-prefix icon" id="link_${linkTitleTrim}"></span>
                            <span class="sidebar-section-link-content-text"> ${link.title} </span>
                        </a>
                      `
                    parentEl.append(linkDiv)
                    
                    let linkIcon = document.getElementById("link_" + linkTitleTrim)
                    if (linkIcon && link.icon) {
                        linkIcon.innerHTML = `<svg viewBox="0 0 640 512" class="fa d-icon svg-icon prefix-icon svg-string d-icon-${link.icon}" xmlns="http://www.w3.org/2000/svg">
                                <use xlink:href="#${link.icon}"></use>
                            </svg>
                        `
                    }
                })
            }
        }, 100)
    }
})
</script>

E il CSS complementare:

.sidebar-section-content {
  display: flex; /* Imposta un layout flex per poter riordinare le cose */
  flex-direction: column;
  .sidebar-more-section-links-details {
    order: +1;
  }
}

.sidebar-wrapper li a.sidebar-section-link-about {
    display: none;
}

.sidebar-wrapper li a.sidebar-section-link-faq {
    display: none;
}

.sidebar-more-section-links-details-content-secondary .sidebar-section-link.sidebar-section-link-about {
    display: none;
}

.sidebar-more-section-links-details-content-secondary .sidebar-section-link.sidebar-section-link-faq {
    display: none;
}

[nat (Natalie T)]

Volevo solo portare la tua attenzione su questo argomento appena uscito:

Custom sidebar sections being tested on meta

Recently, we decided to extend the level of customization for sidebar on meta. We have enabled the ability for you to create your own sidebar sections with links (using the enable custom sidebar sections setting). How it works To display the form, you will need to click plus button at the bottom of the sidebar. [Add section button] You will need to provide the title of the section and at least one valid link. A valid link contains an icon, name and correct URL within the Discourse forum (abs…

Per favore, fornisci un feedback in quell’argomento!