Personnaliser l'apparence en version mobile de votre forum

Voir le sujet précédent Voir le sujet suivant Aller en bas

  • 0

Tutoriel Personnaliser l'apparence en version mobile de votre forum

Message par Alex Fowl le Mer 27 Juil 2011 - 18:37

Personnaliser l'apparence en version mobile de votre forum.


Attention : depuis le 13 juin 2016, une nouvelle version mobile Moderne existe sur les forums. Ce tutoriel est inutile pour cette nouvelle version et ne fonctionnera pas. Il est conseillé d'utiliser la version mobile Moderne.

Ce tutoriel va vous permettre de personnaliser l'apparence de votre forum via le CSS quand celui-ci sera visionné depuis un mobile. Pour tester les codes CSS sur votre navigateur internet depuis un ordinateur, il vous faut simuler un mobile, pour cela vous pouvez télécharger un plugin (ex: pour Firefox ou Opéra User Agent Switcher). Il est possible de simuler un mobile sous Chrome en inspectant l'élément (clic droit puis inspecter l'élément ou F12 sous windows) et en cliquant en haut à gauche sur cette icône:



Exemple:

Notez que pour plus de personnalisation, les templates mobiles peuvent être édités par le fondateur du forum! Plus d'informations dans notre annonce: accès aux templates pour la version mobile

Général


L'image de fond :
Code:
#mpage-body
L'image de fond de haut de page :
Code:
.mobile_title
Texte de haut de page :
Code:
.mobile_title_content
L'image de fond de bas de page :
Code:
.linklist
Texte de bas de page (nécessite la balise !important) :
Code:
.small

Accueil : Catégorie/Forum


Texte principal :
Code:
.mobile_set_content
L'image de fond du texte principal :
Code:
.mobile_set
Sous-texte :
Code:
.mobile_subtitle
Texte commentaire :
Code:
.mobile_comment
Image de fond du sous-texte et texte commentaire :
Code:
.mobile_item
Image de fond du sous-texte et texte commentaire survolé :
Code:
.mobile_item:hover

Icône catégorie/forum


L'image de la catégorie sans nouveau message :
Code:
.cat_no_new
L'image de la catégorie nouveau message :
Code:
.cat_new
L'image de la catégorie verrouillé :
Code:
.cat_locked
L'image du forum sans nouveau message :
Code:
.forum_no_new
L'image du forum nouveau message :
Code:
.forum_new
L'image du forum verrouillé :
Code:
.forum_locked


Icône de sujet


L'image de sujet Annonce Global normal:
Code:
.folder_global
L'image de sujet Annonce Global avec nouveau message :
Code:
.folder_global_new
L'image de sujet Annonce normal :
Code:
.folder_announce
L'image de sujet Annonce avec nouveau message :
Code:
.folder_announce_new
L'image de sujet Note normal :
Code:
.folder_sticky
L'image de sujet Note avec nouveau message :
Code:
.folder_sticky_new
L'image de sujet Populaire normal :
Code:
.folder_hot
L'image de sujet Populaire avec nouveau message :
Code:
.folder_hot_new
L'image de sujet Normal sans message :
Code:
.folder_no_new
L'image de sujet Normal avec nouveau message :
Code:
.folder_new
L'image de sujet Normal verrouillé :
Code:
.folder_locked
L'image de sujet Normal avec nouveau message verrouillé :
Code:
.folder_locked_new

Sujet


L'image de fond et texte du haut du sujet (nécessite la balise !important) :
Code:
.post_header
Contenu du sujet :
Code:
.content
L'image de fond du contenu du sujet :
Code:
#p3


Alex Fowl
Membre actif

Masculin
Messages : 7557
Inscrit(e) le : 28/03/2009

http://www.aidactif.fr
Alex Fowl a été remercié(e) par l'auteur de ce sujet.

Voir le sujet précédent Voir le sujet suivant Revenir en haut


Permission de ce forum:
Vous ne pouvez pas répondre aux sujets dans ce forum