Toolbar: scegliere quali link visualizzare nel menu

Da **Niko** Lun 18 Gen 2021 - 18:35

Toolbar: scegliere quali link visualizzare nel menu

Descrizione

Questo #tutorial vi permetterà di scegliere quali link visualizzare nel #menu della #toolbar forumattivo Wink

menu - Toolbar: scegliere quali link visualizzare nel menu Menu10

Installare il codice javascript

come per tutti i codici javascript dovrete andare verso PDA > Moduli > HTML & Javascript > Gestione del codice javascript e creare un nuovo codice javascript :new:

Titolo: a tua scelta
Dove: in tutte le pagine
Codice:
Codice:
$(function() { var submenus = { See_my_profile : ['/u' + _userdata.user_id, 0], Edit_profile : ['/profile?mode=editprofile&page_profil=preferences', 0], 'Separator 1' : ['|', 0], All_Topics : ['/sta/' + _userdata.username, 0], All_Messages : ['/spa/' + _userdata.username, 0], js_topics_followed : ['/search?search_id=watchsearch', 0], All_PMs : ['/privmsg?folder=inbox', 0], 'Separator 2' : ['|', 0], 'Reports' : ['/report', 2], 'Archived Reports' : ['/report?mode=archive', 2], 'Separator 3' : ['|', 2], Admin_panel : ['/admin', 1], Logout : ['/login?logout=1', 0] }, i, j, li, menu; $(function() { menu = document.getElementById('fa_menulist'); if (menu) { for (li = menu.getElementsByTagName('LI'), i = 0, j = li.length; i < j; i++) li[i].style.display = 'none'; // hide old menu links for (i in submenus) { li = document.createElement('LI'); // check and correct incorrect data types if (submenus[i].constructor != Array) submenus[i] = []; if (submenus[i][0] == undefined) submenus[i][0] = '|'; if (submenus[i][1] == undefined) submenus[i][1] = 0; // assign element attributes based on the string value submenus[i][0] == '|' ? li.className = 'fa_separator' : li.innerHTML = '<a href="' + submenus[i][0] + '" ' + (submenus[i][2] ? 'target="_blank"' : '') + '>' + (_lang[i] ? _lang[i] : i) + '</a>'; // append the new item to the menu based on permissions if (_userdata.user_level == 1 || _userdata.user_level >= submenus[i][1] && submenus[i][1] != 1) menu.appendChild(li); } } }); });

Potete salvare lo script adesso (verranno aggiunti due link per i moderatori), oppure continuare a leggere la nuova sezione per scoprire come modificare i link visualizzati. Wink

Modificare la toolbar

Per modificare i link visualizzati nel menu della tua toolbar, devi modificare l'oggetto submenus. E' posizionato all'inizio dello script ed ha questo aspetto:

Codice:: var submenus = { See_my_profile : ['/u' + _userdata.user_id, 0], Edit_profile : ['/profile?mode=editprofile&page_profil=preferences', 0], 'Separator 1' : ['|', 0], All_Topics : ['/sta/' + _userdata.username, 0], All_Messages : ['/spa/' + _userdata.username, 0], js_topics_followed : ['/search?search_id=watchsearch', 0], All_PMs : ['/privmsg?folder=inbox', 0], 'Separator 2' : ['|', 0], 'Reports' : ['/report', 2], 'Archived Reports' : ['/report?mode=archive', 2], 'Separator 3' : ['|', 2], Admin_panel : ['/admin', 1], Logout : ['/login?logout=1', 0] },

Personalizzazione

Crea un link personale

Ora, quindi, per creare il tuo collegamento devi semplicemente definire un nome che sarà a sinistra dei due punti, quindi creare un array a destra dei due punti usando le parentesi. ( [] ) Iniziamo semplicemente e creiamo un collegamento vuoto denominato Pagina HTML:

Codice:: 'HTML Page' : []

Nota: se il collegamento che stai creando non è l'ultimo nell'elenco degli oggetti, è imperativo inserire una virgola alla fine della matrice. ( [] , ) Altrimenti, puoi omettere la virgola se è l'ultimo elemento dell'oggetto.

All'interno dell'array puoi inserire tre valori: [URL, PERMISSION_LEVEL, TARGET]

URL: questo dovrebbe essere l'URL a cui vuoi che il link ti porti. Poiché nell'esempio stiamo creando una pagina HTML, inserirò "/h1-my-html-page" . Tieni presente che il tuo URL dovrebbe essere racchiuso tra virgolette.
PERMISSION_LEVEL: questo è il livello di autorizzazione per il quale sarà disponibile il collegamento. Dovrebbe essere un numero compreso tra 0 e 2. Scegli il livello più adatto per il collegamento:
- 0: Visibile a chiunque
- 1 : Visibile solo agli amministratori
- 2 : Visibile solo a moderatori e amministratori
Per il mio esempio, sceglierò 0 in modo che il collegamento alla pagina HTML sia visibile a chiunque.
TARGET: questo è un terzo valore opzionale . Se impostato su true, facendo clic sul collegamento verrà aperto in una nuova finestra / scheda. Ad esempio, sarebbe simile a questo: ['/h1-my-html-page', 0, true ]

Ora con tutti i miei valori inseriti, il collegamento completato sarà simile a questo:

Codice:: 'HTML Page' : ['/h1-my-html-page', 0]

Suggerimento: per semplificarti le cose, puoi copiare l'esempio sopra e apportare le modifiche desiderate.
Quindi, quando salvo lo script, dovrebbe essere visualizzato ovunque sia stato posizionato nell'oggetto dei sottomenu.

Creazione di un separatore

Se hai più link e vuoi creare un separatore è abbastanza semplice! Dato che hai letto l'ultima sezione dovresti già sapere come creare nuovi link, o "elementi". Segui la stessa routine, ma dagli un nome semplice come "separatore 1." L'unica differenza è che metterai una barra ( | ) come URL.

Codice:: 'separator 1' : ['|', 0]

o script lo riconoscerà e l'elemento verrà inserito nel menu come separatore anziché come collegamento. Le stesse regole di autorizzazione si applicano ai separatori, quindi assicurati di scegliere il livello di autorizzazione corretto per evitare di mostrare più separatori affiancati.

Inoltre, non è possibile avere più separatori denominati "separatore 1", il nome è univoco, quindi è necessario incrementare il numero o modificare il nome per ogni nuovo separatore.

Riassunto

Con questo script sarai in grado di modificare i link visualizzati nel menu come meglio credi. Puoi anche modificare gli URL e le autorizzazioni dei link esistenti o creare il tuo elenco personalizzato per i tuoi membri .. le possibilità sono infinite, quindi personalizza!