Qualche tempo fa un utente (dal forum di supporto rumeno) ha chiesto un tutorial su come creare un nuovo BBCode da scaricare. Ora ecco la soluzione perfetta, il codice funziona perfettamente, anche l'integrazione di un nuovo editor, è facile da usare e da personalizzare!
Installazione JavascriptAndiamo verso Pannello di amministrazione ► Moduli ► HTML & Javascript ► Gestione del codice Javascript, assicuriamoci che la gestione del codice Javascript sia attivata, e creiamo un nuovo codice con queste impostazioni:
- Titolo: a tua scelta
- Dove: in tutte le pagine
- Codice:
- Codice:
(function($) { document.write('<script type="text/javascript" src="https://use.fontawesome.com/141c9eaa90.js"></script>'); var Required_Post = 70, Open_Type = true, Show_ERROR_Message = 'Non hai i permessi sufficienti per effettuare questo download'; $(function() { $(function() { $('body').append('<div id="download" class="sceditor-dropdown sceditor-download" style="visibility:hidden;width:auto;text-align:left;"><div><label for="linkdownload" unselectable="on">URL</label> <input type="text" id="linksrc" class="url" placeholder="http://" value=""></div><div><input type="button" class="button" value="inserare"></div></div>'); $('.sceditor-group:last-child').after('<div class="sceditor-group" id="download_link"><a class="sceditor-button" title="Download BBCode" onclick="selectWysiwyg(this, \'download\');"><div style="background:url(https://i.servimg.com/u/f62/19/70/74/92/if_dow13.png) no-repeat center;"></div></a></div>'); $('div input[value="inserare"]', $('#download')).live("click", function(e) { $('textarea#text_editor_textarea').sceditor('instance').insert('[download='+ $('#linksrc', $('#download')).val() +']'); $('#linksrc', $('#download')).val(''); $('#download').css({'visibility':'hidden'}); }); for(var i = 0, j = $('.post'); i <= j.length; i++) { if(/\/t(\d+)-|\/t(\d*)p(\d+)-/g.test(window.location.href)) { if(_userdata.user_posts <= Required_Post) { j[i].innerHTML = j[i].innerHTML.replace(/\[download=(.*?)\]/g, '<div id="download-link" class="error">'+ Show_ERROR_Message +'</div>'); } else if(_userdata.user_posts >= Required_Post) { (Open_Type == true) ? j[i].innerHTML = j[i].innerHTML.replace(/\[download=(.*?)\]/g, "<div id="download-link"><i class="fa fa-download" aria-hidden="true"></i><a href="$1" target="_blank">Download</a></div>") : j[i].innerHTML = j[i].innerHTML.replace(/\[download=(.*?)\]/g, "<div id="download-link"><i class="fa fa-download" aria-hidden="true"></i><a href="$1">Download</a></div>"); } } } }); }); }(jQuery));
Personalizzazione dello stile CSSAndiamo verso Pannello di amministrazione ► Visualizzazione ► Immagini e colori ► Foglio di stile CSS e aggiungiamo questo codice:
- Codice:
div#download-link { background: #f1c444; width: auto; display: inline-block; padding: 5px 10px; border: 1px solid rgba(171, 153, 26, 0.21); border-radius: 2px; } div#download-link > a { color: #231d1d; text-decoration: none; font-size: 14px; } i.fa.fa-download { margin-right: 5px; font-size: 14px; } div#download-link.error { background: #e44343; color: wheat; }
Personalizzazione della funzione- Required_Post = 30 // Ecco il numero richiesto di messaggi per utente per visualizzare il pulsante di download.
- Open_Type = true // True = apre una nuova pagina al link per il download || False = si apre il collegamento alla pagina di download
- how_ERROR_Message= 'Non hai i messaggi necessari per il download.' // Ecco il messaggio che apparirà se non ha il numero richiesto di messaggi inviati
|