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 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:

Personnaliser l'apparence en version mobile de votre forum 09-04-12

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


Personnaliser l'apparence en version mobile de votre forum CategoryL'image de la catégorie sans nouveau message :
Code:
.cat_no_new
Personnaliser l'apparence en version mobile de votre forum Category_newL'image de la catégorie nouveau message :
Code:
.cat_new
Personnaliser l'apparence en version mobile de votre forum Category_lockedL'image de la catégorie verrouillé :
Code:
.cat_locked
Personnaliser l'apparence en version mobile de votre forum Folder_bigL'image du forum sans nouveau message :
Code:
.forum_no_new
Personnaliser l'apparence en version mobile de votre forum Folder_new_bigL'image du forum nouveau message :
Code:
.forum_new
Personnaliser l'apparence en version mobile de votre forum Folder_locked_bigL'image du forum verrouillé :
Code:
.forum_locked


Icône de sujet


Personnaliser l'apparence en version mobile de votre forum Announce_readL'image de sujet Annonce Global normal:
Code:
.folder_global
Personnaliser l'apparence en version mobile de votre forum Announce_unreadL'image de sujet Annonce Global avec nouveau message :
Code:
.folder_global_new
Personnaliser l'apparence en version mobile de votre forum Announce_readL'image de sujet Annonce normal :
Code:
.folder_announce
Personnaliser l'apparence en version mobile de votre forum Announce_unreadL'image de sujet Annonce avec nouveau message :
Code:
.folder_announce_new
Personnaliser l'apparence en version mobile de votre forum Sticky_readL'image de sujet Note normal :
Code:
.folder_sticky
Personnaliser l'apparence en version mobile de votre forum Sticky_unreadL'image de sujet Note avec nouveau message :
Code:
.folder_sticky_new
Personnaliser l'apparence en version mobile de votre forum Topic_read_hotL'image de sujet Populaire normal :
Code:
.folder_hot
Personnaliser l'apparence en version mobile de votre forum Topic_unread_hotL'image de sujet Populaire avec nouveau message :
Code:
.folder_hot_new
Personnaliser l'apparence en version mobile de votre forum Topic_readL'image de sujet Normal sans message :
Code:
.folder_no_new
Personnaliser l'apparence en version mobile de votre forum Topic_unreadL'image de sujet Normal avec nouveau message :
Code:
.folder_new
Personnaliser l'apparence en version mobile de votre forum Topic_read_lockedL'image de sujet Normal verrouillé :
Code:
.folder_locked
Personnaliser l'apparence en version mobile de votre forum Topic_unread_lockedL'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

avatar

Alex Fowl
Membre actif

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

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

- Sujets similaires

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