Auto popup image viewer, Popup automatico con informazioni sempre aggiornate dei vostri staffer

Molti forum utilizzano il CSS popup image viewer per mettere le informazioni dello staff nelle pagine del forum.
Con questo script sarà possibile fare la stessa cosa, senza dover utilizzare codici lunghi e complessi.
Con solo due righe riuscirete ad avere un effetto uguale a quello dell'immagine, e molto di più!
Infatti a differenza dei CSS popup image viewer con questo script avrete le informazioni sempre aggiornate sui membri dello staff: ultima visita, numero di post, reputazione, genere, e molto altro!
Il tutto personalizzabile per ogni singolo utente: potete, ad esempio, far vedere all'utente X solo il gruppo mentre all'utente Y tutte le informazioni e infine all'utente Z solo il numero dei post o solo l'avatar.

Per installare lo script inserire in Amministrazione → Grafica → Codice HTML → Codice HTML che sarà mostrato nella homepage del sito (potete inserirlo in qualsiasi box, ma è sconsigliabile inserirlo nei box "tutte le pagine") queste due righe:

La riga autoPivGroups serve per specificare i gruppi da mostrare: abilitando un gruppo saranno mostrati tutti i suoi componenti (è sempre possibile nasconderli in seguito).
Per capire quali sono gli ID dei gruppi leggere la voce wiki ID.

Una volta inserito lo script rimane solo da inserire questo codice (che non va modificato!)

Dove si vuol far visualizzare i popup.
Lo si può inserire ovunque, naturalmente se si è messo lo script nel box della homepage non funzionerà nelle sezione e andrà inserito anche lì.
È possibile, in diverse pagine, mettere anche gruppi differenti da far visualizzare!

Oltre alle personalizzazioni ottenibili tramite i parametri dello script, è anche possibile intervenire sull'aspetto, aggiungendo in colori e stili gli appositi selettori, le personalizzazioni possibili sono numerose, elencheremo qui i selettori principali (e più utili):

Il div principale ha id #autopiv. Tutto quello che inizierà per questo id riguarderà quindi la personalizzazione dell'auto popup image viewer.
Per ogni utente ci sarà un div con id uguale a #a_ID_UTENTE e classi .a_CLASSE_GRUPPO, .a_GENERE (male, female), .a_STATO (online, offline, anonimo) e .user_thumb.
Ad esempio si può scegliere un colore di sfondo solo per gli utenti maschi o femmine, oppure solo per gli appartenenti ad un gruppo. Si può anche escludere un utente scrivendo:
La miniatura ha classe .thumb, per modificare ad esempio la grandezza dell'immagine, andrà scritto:
Analogamente si può modificare ciò che si preferisce della miniatura.
Il popup con le info ha classe .user_info ed è organizzato come una lista, e potranno essere modificate agendo su questa classe, lo sfondo, il bordo e varie altre cose.
L'avatar ha classe .a_avatar.
Il nick .a_nick e al suo interno il link al profilo ha classe .a_profile, mentre il link per gli mp .a_mp.
I dati hanno classe .a_info e al suo interno la reputazione .a_reputation, i messaggi .a_msg, il gruppo .a_group, il genere .a_gender, l'ultima visita .a_lastvisit, il sito dell'utente .a_website, la provenienza .a_location mentre lo stato .a_status. Si può quindi nascondere con display: none le cose non volute.
E' possibile interrompere la riga delle anteprime, facendole così andare a capo, inserendo .break_ID {display: block} dove ID corrisponde all'ID dell'ultimo utente che si vuole visualizzare nella riga, prima di andare a capo.



Edited by Kakashi - 4/5/2014, 18:22