Adaugarea butonului offline

Scris de Cassius Dio Vin Feb 15, 2013 7:17 pm

Adaugarea butonului offline

In acest tutorial va voi arata cum puteti adauga butonul "offline" pentru versiunile phpBB3, PunBB si Invision. Trucul este foarte simplu si consta numai in adaugarea unor coduri.

Coduri de adaugat:
Pentru versiunea phpBB3:
- Cod JavaScript:

Cod:: $(function(){ $('.post:not(".online")').addClass('offline'); });

- Cod CSS:

Cod:: .offline{ background-image: url(Link imagine offline); background-position: right 0; background-repeat: no-repeat; }

Daca folositi versiunea phpBB3 si doriti sa schimbati pozitia imaginii "offline" in partea stanga, inlocuiti acest fragment de cod:

Cod:: background-position: right 0;

cu:

Cod:: background-position: left 0;

Pentru versiunea phpBB2:
- Cod JavaScript:

Cod:: $(document).ready(function(){ $('tr[class^="post"]:has(".i_icon_online")').addClass('online'); $('tr[class^="post"]:not(".online"):not("[id]")').addClass('offline'); $('.offline td.messaging.gensmall td').append('<img src="Link imagine offline" class="i_icon_offline" alt="Offline" title="Offline">'); });

Pentru versiunea PunBB:
- Cod JavaScript:

Cod:: $(function(){ $('.post:has(".i_icon_online")').addClass('online'); $('.post:not(".online")').addClass('offline'); $('.post.offline .user-info').prepend('<img src="Link imagine offline" class="i_icon_offline" alt="Offline" title="Offline" /><br />'); });

Pentru versiunea Invision:
- Cod JavaScript:

Cod:: $(function(){ $('.post:not(".online")').addClass('offline'); $('.post.offline .post-header .popmenubutton a').prepend('<img src="Link imagine offline" class="i_icon_offline" alt="Offline" title="Offline" />'); });

Pasi de urmarit:
1. Alegeti codul sau codurile potrivite in functie de versiunea forumului pe care o folositi;
2. Gasiti o imagine tip "offline" pe care sa o folositi pe forum;
3. Inlocuiti din cod Link imagine offline cu adresa URL valida catre imaginea aleasa;
4. Activati Gestiunea codurilor JavaScript;
5. Creati un cod JavaScript nou, iar la rubrica Amplasare alegeti Topicuri.

Adaugarea codurilor:
Codurile CSS se adauga in:

Panou de Administrare ~> Afisare ~> Imagini si culori ~> Culori ~> Foaie de stil CSS

Codurile JavaScript se adauga in:

Panou de Administrare ~> Module ~> HTML & JAVASCRIPT ~> Gestiunea codurilor JavaScript

Succes!