Blocco note per i tuoi utenti

Da **Niko** Gio 9 Set 2021 - 12:56

Blocco note per i tuoi utenti

Questa astuzia ti mostra come creare un taccuino personale per i tuoi membri. Come il blocco note che si trova nella home del pannello di amministrazione, questo blocco note personale consente ai tuoi membri di poter annotare informazioni che saranno le uniche a poter consultare.

 Tieni presente che questo trucco utilizza la funzione di archiviazione del browser locale, quindi lo script non avrà alcun effetto per un browser IE inferiore a IE8. Inoltre, svuotando i dati del sito (cookie) dal browser, perderai le informazioni inserite nel blocco note.

Inserimento dello script

Pannello di amministrazione ► Moduli ► HTML & JAVASCRIPT - Gestione codice Javascript

Assicurati che la gestione dei codici JavaScript sia attivata , quindi crea un nuovo javascript con il titolo "taccuino personale dei membri" (facoltativo) e per il posizionamento "Su tutte le pagine"

Codice:: $(function() { var notepad = document.getElementById('fa_notepad'); if (notepad) { var key = 'fa_notepad_u' + _userdata.user_id, storage = window.localStorage, handler = function() { var key = 'fa_notepad_u' + _userdata.user_id, val = this.value, storage = window.localStorage; storage ? storage[key] = val : my_setcookie(key, val); }; notepad.value = (storage ? storage[key] : my_getcookie(key)) || 'Benvenuti sul tuoblocco note personale, ' + _userdata.username + ' !'; notepad.oninput ? notepad.oninput = handler : notepad.onkeyup = handler; } });

L'unica impostazione indicata in questo codice è la frase predefinita che è possibile visualizzare. Ecco la frase è:

Codice:: 'Benvenuti sul tuoblocco note personale, ' + _userdata.username + ' !';

Sei libero di poterlo personalizzare in base al contesto del tuo forum. :bene:

Inserimento del codice CSS

Il codice CSS sottostante consente di personalizzare la visualizzazione del blocco note. Puoi personalizzarlo in base al contesto del tuo forum.
Pannello di amministrazione ► Visualizzazione ► Immagini e colori - colori (scheda Foglio di stile CSS)

Codice:: /* Blocco-note */ .panel_bn_global { background: #dfdfe1; box-shadow: 0px 3px 2px #aab2bd; border-radius: 2px; width: 400px; } .panel_bn_header_global { background-color: #38445A; border-radius: 2px; color: #fff; height: 30px; line-height: 2.5em; padding: 3px; padding-left: 11px; text-transform: uppercase; } .notepad { background-color: #fcf8e3; border: 1px solid #faebcc; color: #8a6d3b; height: 250px; overflow: auto; padding: 5px; width: 97%; }

Non dimenticare di fare clic sul pulsante Convalida per salvare le modifiche.

Posizionamento del blocco note

Diversi posti possono essere indicati per posizionare questo blocco note:

Pannello di amministrazione ► Moduli ► Portale e widget - Gestione dei widget del forum
Pannello di amministrazione ► Moduli ► HTML & JAVASCRIPT - Gestione delle pagine HTML
Pannello di amministrazione ► Display ► Home page - Generale

Indipendentemente dalla posizione (che accetta HTML), è necessario compilare il seguente codice HTML:

Codice:: <div style="display:block;" class="panel_bn_global"> <div class="panel_bn_header_global">Blocco Note</div> <textarea id="fa_notepad" class="notepad"></textarea> </div>

Non dimenticare di fare clic sul pulsante Convalida per salvare le modifiche.