Avatar Select light (Modifié)


Avatar Select light (Modifié)


Je présente à votre attention une version allégée gratuite du module Avatar-Select .
Ce module permettra à vos utilisateurs d'installer facilement un avatar original de votre banque d'images en 2 clics.

La fenêtre principale du module ressemble à ceci :


Lorsque l'avatar actuel est surligné en rouge et en orange, l'image est surlignée et deviendra l'avatar une fois enregistrée.
Pour sélectionner un nouvel avatar, sélectionnez simplement une image et appuyez sur le bouton "Enregistrer" ou double-cliquez sur l'image. Pas besoin de recharger la page tout passe par ajax. Des avatars sont fournis avec le script.

Installation
uploader les dossiers **engine** et **uploads** à la racine du site
Allez dans l'administration section utilitaires/gestions des plugins et importer le fichier avatar-select.xml

Ouvrez le fichier modèle **main.tpl**.

Dans le pied de page du site, par exemple, avant l'insertion:
</body>


ajoutez au dessus
<script src="/engine/mods/AvatarSelect/assets/libs.js"></script>


Ouvrir la fenêtre
Le lien permettant d'ouvrir la fenêtre de sélection des avatars peut être placé n'importe où et dans n'importe quel fichier du modèle de site Web.
Par exemple, dans **userinfo.tpl** ou dans **registration.tpl**

Dans registration.tpl cherchez
<input type="file" id="image" name="image" class="wide">


remplacer par
<img src="{foto}" alt="avatar" data-foto="img" class="ava-modal-trigger" style="width:70px" /><br />
<input type="file" id="image" name="image" class="wide">
<br /><a href="#" class="ava-modal-trigger">Choisissez un avatar dans la liste</a>


Dans userinfo.tpl cherchez
<span class="cover" style="background-image: url({foto});">


Remplacer par
<span class="cover" style="background-image: url({foto});" data-foto="background">


Cherchez plus bas
<input type="file" name="image" id="image" class="wide">


Remplacer par
[not-logged]
<a href="#" class="ava-modal-trigger">Choisissez un avatar dans la liste</a>[/not-logged]


Le déclencheur de la fenêtre est la présence d'une classe ***ava-modal-trigger***

Il suffit d'ajouter cette classe à n'importe quel élément du site, de sorte que lorsque vous cliquez sur cet élément, la fenêtre du module s'ouvre.

Par exemple dans **login.tpl**

[not-group=5]<img src="{foto}" class="yourClass ava-modal-trigger" alt="Фото" />[/not-group]


Mise à jour automatique de la photo sur le site web:
Ainsi, lorsque vous sélectionnez un nouvel avatar, la photo est également mise à jour dans les modèles **login.tpl** et **userinfo.tpl**, il suffit d'ajouter un attribut data-foto="img" ou data-foto="background" pour un bloc avec une image.

La première concerne les balises d'image :
<img src="{foto}" alt="foto" data-foto="img" class="ava-modal-trigger" />


La deuxième est si l'avatar est affiché comme arrière-plan :
<a href="#"><span class="cover" style="background-image: url({foto});" data-foto="background">{usertitle}</span></a>


FAQ sur le téléchargement:
Les avatars sont stockés dans
[color=#0000FF]**/uploads/fotos/bank/{image}**[/color]


Le nom de l'image ne doit contenir que des caractères latins, des chiffres et des traits de soulignement _.

Modifié par DarkLane pour avoir la fenêtre de sélection d'avatar dans l'inscription au moment de la validation de celui-ci

Auteur: Sander
Version DLE: 10.1 à 15.0
Version PHP: 5.4 à 8.0.12
Lire le readme pour l'installation

Informations

Les visiteurs du groupe Invités ne peuvent pas télécharger de fichiers sur le site.
Connectez-vous au site avec votre identifiant et mot de passe ou si vous êtes un nouvel utilisateur suivez le processus d'inscription sur le site.


N'importe qui peut critiquer.
Créer quelque chose qui sera critiqué n'est pas donné à tout le monde.


Soutenez l'auteur
Tous les fonds collectés seront reversés à l'auteur de cet article - DarkLane
Merci d'avance!
Qui est en ligne
2 Visiteur(s)  sur le site!
Invité(s): 1
Robot(s) 1
Liste des utilisateurs
Vladimir_Root il y a 13 min
UploadBR il y a 2 heure(s)
Darkmaul il y a 2 heure(s)
DarkLane il y a 2 heure(s)
web_master il y a 2 heure(s)
happyguy il y a 4 heure(s)
feniks il y a 5 heure(s)
filmaito il y a 5 heure(s)
jason il y a 6 heure(s)
Obi Wan il y a 6 heure(s)
Md Aakib Ansari il y a 7 heure(s)
makhara il y a 7 heure(s)
wiken22 il y a 9 heure(s)
galax123 il y a 9 heure(s)
gamers il y a 9 heure(s)
xuanda il y a 17 heure(s)
zatch01 il y a 17 heure(s)
neelix il y a 17 heure(s)
Populaires
    Kino Rédemption dle 17.1
  • Kino Rédemption dle 17.1
  • Kino Rédemption est un modèle adaptatif sympa pour les sites Web de films sur DLE 17.1, réalisé dans des couleurs sombres. L'apparence belle et
    DLE Collections Nulled Dle  13.0 - 17.1
  • DLE Collections Nulled Dle 13.0 - 17.1
  • Le module de LazyDev organise un système de collections d'actualités sur divers sujets, dont vous pouvez optimiser les pages pour les moteurs
    Block Buster v2 Modèle de films/séries
  • Block Buster v2 Modèle de films/séries
  • Je vous présente le thème Block Buster v2 pour Dle 17.1, il est idéal pour les sites de films ou de série! Si vous voulez lancer une base de données
    Modèle MOVIETOR pour un site de films Dle 17.1
  • Modèle MOVIETOR pour un site de films Dle 17.1
  • Je vous présentes un autre modèle de film adaptatif de haute qualité et magnifique MOVIETOR pour DLE 17.1, créé pour le torrenting dans des couleurs
    DLE YouWatch 1.2.1
  • DLE YouWatch 1.2.1
  • Le module vous permettra d'afficher les actualités récemment consultées sur votre site Web pour les invités et les utilisateurs enregistrés.
    DLE 17.1 Build 101 (Nulled FR)
  • DLE 17.1 Build 101 (Nulled FR)
  • Nous vous présentons une nouvelle version de notre script DataLife Engine v.17.1. Dans cette version, vous pourrez créer des plans de site améliorés
    TinyImages 1.2 pour DLE
  • TinyImages 1.2 pour DLE
  • Le module vous permet d'optimiser les images téléchargées sans utiliser de services tiers tels que reSmush et TinyPNG. Il offre également une
    Cookie Notice Pro 1.1.0
  • Cookie Notice Pro 1.1.0
  • Ce module facilite la création d'une notification de cookie pour votre site Web. Le module vous permet d'écrire un message
    Happy Birthday v2.2 pour DLE 17.1
  • Happy Birthday v2.2 pour DLE 17.1
  • Module Happy Birthday v2.2 pour CMS DataLife Engine 17.1. Le module a été nettoyé du code redondant. Une nouvelle instruction a également été
    Kino Rédemption dle 16.x - 17.0
  • Kino Rédemption dle 16.x - 17.0
  • Kino Rédemption est un modèle adaptatif sympa pour les sites Web de films sur DLE 16.x - 17.0, réalisé dans des couleurs sombres. L'apparence