Creare un widget per il tuo staff online


Proadmin Creare un widget per il tuo staff online

Messaggio Da Sogniriflessi il Lun 29 Giu 2015 - 20:24

Creare un widget per il tuo staff online

Creare un widget per il tuo staff online Rang10Creare un Widget per il tuo Staff online




Molto spesso, vorremmo mostrare agli utenti connessi, tramite le statistiche esistenti nel nostro forum,che i membri dello staff sono presenti. Con questo tutorial ti insegnerò come creare un widget che visualizza automaticamente quando un membro dello staff è connesso.



--> Tutorial, consigli e trucchi <--
Creare un Widget per il tuo Staff online



 - Abilitazione dei Widgets:
Prima di tutto bisogna attivare  la funzione dei Widgets sul tuo forum. Quindi, per favore vai nel tuo 
pannello di amministrazione e imposta la sezione Widget nel seguente modo:



Pannello di controllo Creare un widget per il tuo staff online 337884 Moduli Creare un widget per il tuo staff online 337884 Portale & Widgets Creare un widget per il tuo staff online 337884  Widgets dell'indice


Creare un widget per il tuo staff online JhTPZBp



 - Creare il Widget per lo Staff:
Ora abbiamo bisogno di creare un nuovo widget e quindi fai clic sul pulsante:
Creare un widget per il tuo staff online HxhKC82


Creare un widget per il tuo staff online KWherV1

Creare un widget per il tuo staff online 110111 Creare un widget per il tuo staff online 398853Nome del Widget - Questo nome apparirà nel pannello amministrativo della
sezione Widget.Mettere un nome a tua scelta.
Creare un widget per il tuo staff online 110210Creare un widget per il tuo staff online 398853Usare un indice tipo - questa opzione deve essere contrassegnata "Sì" 
in modo che il widget abbia una struttura nel forum.
Creare un widget per il tuo staff online 110310Creare un widget per il tuo staff online 398853Titolo del Widget - Mettere in questo campo lo stesso nome dato nell'opzione 1
di questa spiegazione se vuoi che Il nome dato appaia sul widget del tuo forum.
Creare un widget per il tuo staff online 110410Creare un widget per il tuo staff online 398853Fonte del Widget - Inserire in questo campo il codice che ti mostrerò di seguito.



Codice:
<script type="text/javascript">
  myStaff = ['/u1'];
  staff_cache_time = 4*60*1000; // mm*ss*ms;
  </script>
<div id="theStaff">
</div>
 
<div id="theContent" style="display:none">
</div><script type="text/javascript">
  if (localStorage.staffOn && localStorage.staffEx > +new Date - staff_cache_time) jQuery('#theStaff').html(localStorage.staffOn);
  else loadStaff();
  function loadStaff() {
    jQuery('#theContent').load('/viewonline #main-content a, a.gen', function() {
      for (i=0; i<myStaff.length; i++) jQuery('#theContent a').filter(function() { return jQuery(this).attr('href') === myStaff[i] }).appendTo('#theStaff').wrap('<div class="myStaff">');
      if (!jQuery('#theStaff .myStaff').length) jQuery('#theStaff').html('No staff online');
      jQuery('.myStaff a').each(function() {
        var href = jQuery(this).attr('href');
        jQuery(this).before('<span class="monAva"></span>').prev().load(href + ' #profile-advanced-right .module:first div img:first,.forumline td.row1.gensmall:first > img, .frm-set.profile-view.left dd img,dl.left-box.details:first dd img, .row1 b .gen:first img, .real_avatar img', function() {
          if (window.localStorage) {
            localStorage.staffOn = jQuery('#theStaff').html();
            localStorage.staffEx = +new Date;
          }
        });
      });
    });
  }
  </script>


3 - Modifica del codice:
Per i membri da aggiungere al widget creato nel tuo forum, abbiamo bisogno di fare alcune modifiche di base nel codice

Codice:
myStaff = ['/u1'];


Creare un widget per il tuo staff online Act_bottom
In questo caso, la "/ U1" è il numero di un utente registrato nel tuo forum, ovvero il fondatore. 
Ogni utente ha un numero nel tuo forum, per ordine di registrazione. Per ottenere il numero per ogni membro sul forum, è sufficiente fare clic sul nik dell'utente del tuo forum e nell'URL nel browser apparirà qualcosa del tipo:
"mioforum.forumattivo.it/u1".




 -L'aggiunta di nuovi membri:
Per aggiungere nuovi membri nel widget è semplice. Nel codice,è sufficiente aggiungere una virgola e subito dopo la virgola lo stesso codice, solo con il numero di utente diverso, come nel seguente esempio:



Codice:
myStaff = ['/u1', '/u53077'];

Come vedi dopo il '/ U1' bisogna aggiungere una virgola e il numero di un altro utente.Basta non dimenticare che deve essere all'interno dello slash e delle virgolette

 -  Personalizzazione del Widget: Ora che hai capito il funzionamento del codice, possiamo personalizzare con i CSS. Per questo abbiamo bisogno di accedere al pannello di amministrazione e subito dopo nel foglio di stile CSS:


Pannello di controllo Creare un widget per il tuo staff online 337884 visualizzazione Creare un widget per il tuo staff online 337884Colori Creare un widget per il tuo staff online 337884 foglio di stile CSS. 


Creare un widget per il tuo staff online EDpbDlE





Creare un widget per il tuo staff online 110111Creare un widget per il tuo staff online 398853 Vedere CSS di base del tuo forum- Consente all'amministratore di gestire il CSS del forum. Anche se si aggiungono dei codice CSS nel foglio di stile, la base di CSS non cambia. Il foglio di stile di base mostra i codici che consentono di personalizzare il vostro forum, senza la necessità di ulteriore CSS, 

Creare un widget per il tuo staff online 110210Creare un widget per il tuo staff online 398853 Ricercare CSS - Con questo strumento, si può fare una ricerca nel codice esistente nel foglio di stile CSS. Ad esempio, se hai aggiunto un codice nel foglio di stile, e successivamente vuoi modificarlo e non riesci a trovarlo perchè è troppo grande,basta inserire il codice nel campo "Cerca nel CSS" e verrà trovato automaticamente(se inserito correttamente).

Creare un widget per il tuo staff online 110310Creare un widget per il tuo staff online 398853 Disattivare il CSS di base - Se si disattiva questa opzione,il CSS di base del tuo forum verrà disattivato, lasciando solo il foglio di stile CSS.

Creare un widget per il tuo staff online 110410Creare un widget per il tuo staff online 398853 Ottimizzare il tuo CSS - Con questa funzione attiva, la capacità di caricamento della pagina aumenta, facilitando la navigazione nelle pagine del tuo forum. Ma è importante ricordare che, per far funzionare normalmente l'opzione,è necessario aggiungere il codice corretto nel foglio di stile.



Codice:
/******STAFF ONLINE**********/
.monAva img {
  height: 40px;
  width: 40px;
  margin-right: 5px;
  background: none repeat scroll 0 0 #FFF;
  border: 1px solid #d5d1c8;
  box-shadow: 0 2px 2px rgba(0,0,0,0.1);
  padding: 1px;
}
.monAva img:hover {
  border: 1px solid black;
}
.myStaff a {
  display:inline-block;
  vertical-align:top;
  margin-top:.75em;
}
/*******FINE STAFF ONLINE********/




Risultato:


Creare un widget per il tuo staff online 5gDmL8y



Tutorial tradotto da: sogniriflessi
Copyrigth © FORUMATTIVO.COM



Ultima modifica di Sogniriflessi il Mer 1 Lug 2015 - 15:15, modificato 1 volta


Creare un widget per il tuo staff online Peindre Creare un widget per il tuo staff online Graphi11 Creare un widget per il tuo staff online Premiu10
Vi aspettiamo nel servizio grafico di Forumattivo!

Creare un widget per il tuo staff online 5mjHI7W
Sogniriflessi
Sogniriflessi
Creattiva
Creattiva

Sesso : Femmina
Età : 47
Messaggi : 950
Località : lamezia terme


http://unmondodigrafica.forumattivo.it
Sogniriflessi è stato ringraziato dall'autore di questo topic.

Vedere l'argomento precedente Vedere l'argomento seguente Torna in alto


 
Permessi di questa sezione del forum:
Non puoi rispondere agli argomenti in questo forum