Modules de Unes : nouveautés 1/3

le Jeudi 2 Février 2012

Modules de Unes : nouveautés 1/3
L'utilisation du framework javascript JQuery en front office nous ouvre un champ de nouvelles possibilités pour les modules de Une de votre site.

Du coup, j'ai pas mal de choses à vous présenter concernant ces modules qui sont très importants pour réussir votre home page. Je vais découper la présentation des nouveautés sur deux notes. Dans celle-ci, je vais vous parler des 4 nouveaux modules réservés à la zone de titre du site.

Jusqu'à présent, vous utilisiez les modules de Une dans la zone centrale. Avec ces 4 là, vous allez pouvoir enrichir la zone de titre. Si vous optez pour un module de Une dans cette zone, sachez qu'il ne sera pas affiché dans les pages internes mais uniquement sur la home page.

Il y a donc 4 types de présentations différents. Passons les en revue

Moderne 8, le plus visuel

J'ai choisi d'illustrer la note avec Moderne 8 (image ci-dessus)

Moderne 8 est le module le plus visuel. Il se compose d'une grande image, qui occupe toute la largeur du gabarit. Le titre et les meta informations associées à l'article (description, auteur, date, ...) s'affichent sur un carré en opacité sur l'image.

Moderne 8 permet de publier jusqu'à 5 articles à la Une. Un pager sous forme de "bullets" (petits ronds style iOS) permet de naviguer entre les différents articles. Une opacité est automatiquement appliquée sur les bullets.

Au niveau des transitions d'affichage, vous avez le choix entre 2 effets :
- Slide : effet de glissement lors d'un passage d'un article à l'autre
- Fade : effet de fondu 

Il est possibe de choisir un défilement automatique, et de régler la temporisation du défilement. 

Vous remarquerez au passage que l'interface de paramétrage du module a été améliorée. Les options sont contextuelles et apparaissent en fonction de leur activation ou non. Cela évite de surcharger l'interface inutilement, et rend plus intuitif le paramétrage.

Moderne 9, sobre et élégant

Modules de Unes : nouveautés 1/3
Moderne 9 est un type de présentation classique mais contenant des petites subtilités qui font toute la différence.

A gauche, le titre et les méta-données de l'article. A droite, sur la moitié du module, la photo associée. Une image de taille moyenne suffit donc pour habiller ce module.

Notez l'effet ombré en CSS3 sur les contours de l'image. L'ombre est positionnée à l'extérieur de la bordure.

Moderne 9 peut accueillir jusqu'à 5 articles en Une. La navigation s'effectue à partir du pager Bullets. L'effet de transition est de type Fade.

Moderne 10, des flèches en CSS3

Modules de Unes : nouveautés 1/3
Moderne 10 affiche la photo dans la partie gauche du module. La taille est moyenne et panoramique. Une ombre en CSS est appliquée à l'intérieur de la bordure de l'image. Sur la partie droite, on retrouve le titre et les meta données de l'article.

Avec Moderne 10, vous pouvez placer jusqu'à 5 articles à la Une. Comme effet de transition entre les articles, vous pouvez choisir entre Slide et Fade. Le défilement automatique est possible.

La particularité de Moderne 10 réside dans les flèches qui permettent de naviguer entre les articles. Les flèches sont à l'extérieur du gabarit. Ce ne sont pas des images, mais des flèches réalisées entièrement en CSS3. Non seulement cela permet d'accéler la vitesse d'affichage, mais surtout cela permet de les personnaliser facilement. Pour cela, vous n'avez qu'à intervenir sur la police Pager du module. Vous pourrez ainsi jouer sur leurs couleurs.

Si les possibilités de personnalisation des flèches CSS par défaut ne vous conviennent pas, vous pouvez les remplacer par des images personelles. Dans ce cas là, il vous faudra uploader dans le module 2 images. Une pour la flèche de droite et une pour la flèche de gauche. 

Moderne 11, l'héritier de la Web TV

Modules de Unes : nouveautés 1/3
Moderne 11 est directement inspiré d'un des modules de Une de la Web TV. L'image est à gauche et est assez grande. Sur la droite, en colonne, la liste des 4 articles à la Une.

Pour l'article sélectionné, on retouve son titre et ses meta informations sur un bandeau horizontal en opacité sur l'image. La couleur de l'opacité correspond à la police dominante et reste ainsi en accord avec la couleur de fond du module. La couleur de l'article sélectionné correspond à la couleur de background de la police titre. 

L'effet Fade est utilisé pour la transition entre les articles. Le défilement automatique est possible et vous pouvez également régler la césure sur la description des articles au niveau des 4 positions, de façon à travailler finement vos slogans ou vos accroches.

A suivre ...

Nous venons de voir les nouveautés réservées à la zone de titre des CMS.

Dans des prochaines notes, je vous présenterai d'autres nouveautés concernant les modules de Une du CMS et de la Web TV.


Jerome Granados
Jérôme s'occupe de la promotion de WMaker. Il accompagne les prospects dans la découverte de la... En savoir plus sur cet auteur


Vos commentaires
Du plus récent au plus ancien | Du plus ancien au plus récent

32.Posté par Frédéric Aznar le 27/02/2012 18:48 | Alerter
Utilisez le formulaire ci-dessous pour envoyer une alerte au responsable du site concernant ce commentaire :
Annuler
Twitter
Il serait absolument génial de pouvoir un jour mixer articles, rubriques ou dossiers dans le module de "Une" ... cela semble complexe mais ouvrirait de belles perspectives.

31.Posté par Lesia PIETRI le 06/02/2012 13:08 | Alerter
Utilisez le formulaire ci-dessous pour envoyer une alerte au responsable du site concernant ce commentaire :
Annuler
@Yann
Oui nous sommes au courant du problème, comme je l'ai précisé dans mon précédent commentaire il sera rapidement fixé.

30.Posté par Yann le 06/02/2012 11:52 | Alerter
Utilisez le formulaire ci-dessous pour envoyer une alerte au responsable du site concernant ce commentaire :
Annuler
@Lesia
A priori les modules 8 à 11 ne sont pas dispos en zone titre dans le mode brouillon (enfin nous on a pas trouvé)

29.Posté par Lesia PIETRI le 06/02/2012 10:30 | Alerter
Utilisez le formulaire ci-dessous pour envoyer une alerte au responsable du site concernant ce commentaire :
Annuler
@Philippe Nieuwbourg
Ce n'est en aucun cas une contrainte technique mais tout simplement une contrainte ergonomique. En effet il est difficile d'imaginer et d'intégrer ces modes dans une colonne de 600px de large. Les articles mis en avant ne seraientt pas lisibles et l'on n'obtiendrai plus l'effet escompté. Je peux comprendre que pour la plupart ces modes ne sont pas facile à intégrer dans un design déjà établi mais n'oubliez pas que vous disposez du mode Brouillon pour tester tout cela (dont les problèmes seront très rapidement fixés). Enfin nous n'avons pas oublié les modes de la colonne centrale qui ont tous été améliorés et accompagnés d'un nouveau mode tout aussi beau que ceux dans la zone de titre.

28.Posté par Le Pape Laurent le 06/02/2012 09:34 | Alerter
Utilisez le formulaire ci-dessous pour envoyer une alerte au responsable du site concernant ce commentaire :
Annuler
@Jerome Granados
Bonjour,
Mon module (9) de une est bien dans la partie supérieure mais aucune image n'apparaît...
Du coup, seul l'ancien module situé sur la 2 eme partie fonctionne. Evidemment, mon cache a été vidé (sur Safari et Chrome) mais rien :(

27.Posté par Philippe Nieuwbourg le 06/02/2012 07:38 | Alerter
Utilisez le formulaire ci-dessous pour envoyer une alerte au responsable du site concernant ce commentaire :
Annuler
@ Jérome : quand vous dites "A la différence de Moderne 7 dont je parlerai plus tard et qui s'utilise en zone centrale, M8 à M11 s'utilisent en zone de titre"... j'ai du mal à comprendre la raison technique de cette contrainte...
Pour beaucoup de sites, la maquette est pensée, calculée, construite dans WM, et on ne peut pas comme ça d'un coup de tête tout changer entre le titre et le module central. Du coup ce genre de limitations ne permet pas de bénéficier des nouveautés ou même de les tester.
S'il y a une raison technique, je comprendrais parfaitement, mais là, je ne la vois pas vraiment...

26.Posté par ve le 06/02/2012 00:08 | Alerter
Utilisez le formulaire ci-dessous pour envoyer une alerte au responsable du site concernant ce commentaire :
Annuler
Ce n'est pas que je n'apprécie pas vos MAJ et vos innovations. Mais je n'aime pas du tout que chaque changement produise des effets sur non désirés sur mon site.
Je constate un dysfonctionnement ou un problème esthétique,et je me précipite sur votre blog pour voir ce qui en est la cause...
Ne pouvez-vous pas vous débrouiller pour ne pas impacter nos mises en page en cours ?
Bonne journée

25.Posté par Next 51 le 04/02/2012 15:05 | Alerter
Utilisez le formulaire ci-dessous pour envoyer une alerte au responsable du site concernant ce commentaire :
Annuler
Retour:
J'ai installé via Firefox, le module 8 : Fonctionne
En revanche, je ne peux mettre que 3 articles max, pas 5, et ce malgré le paramètrage qui en propose 5.
Pas bien grave, je pense que ça bug...


24.Posté par Yann le 03/02/2012 12:42 | Alerter
Utilisez le formulaire ci-dessous pour envoyer une alerte au responsable du site concernant ce commentaire :
Annuler
Post sur le support à propos de ces modules mais, malgré le caractère urgent (mise en page de notre home modifiée sans que l'on ait changé de module de Une), toujours pas de réponses. :(
J'essaye donc par ce biais.
Merci d'avance.

23.Posté par ccubestef le 03/02/2012 02:24 | Alerter
Utilisez le formulaire ci-dessous pour envoyer une alerte au responsable du site concernant ce commentaire :
Annuler
c'est carrément génial :) j'attendais ça depuis longtemps merci ^_-

22.Posté par Florian le 03/02/2012 01:04 | Alerter
Utilisez le formulaire ci-dessous pour envoyer une alerte au responsable du site concernant ce commentaire :
Annuler
@andré
le module 7 est n'est disponible que dans les modules de la zone centrale du site de la home page.
le module 8,9,10 est disponible si vous ajoutez un module à la une dans la zone titre (la zone du haut).

Petite info pour ceux qui utilise Chrome, pour vider la cache, il suffit de cliquer sur Préférences, puis Options avancées, puis "Effacer les données de navigation", enfin, n'oubliez pas de cocher la case "vider le cache".

Ensuite, retourner sur le la gestion du design, rafraichissez la page, vous trouverez les modules à leurs places avec tous les visuels :)

@+, Florian

21.Posté par André le 02/02/2012 23:52 | Alerter
Utilisez le formulaire ci-dessous pour envoyer une alerte au responsable du site concernant ce commentaire :
Annuler
En fait après vérification, je n'ai que le module 7 de disponible (les 8, 9 et 10 je ne les ai pas). Et je comprends pas pourquoi une fois configuré comme il faut, la une avec le module 7 est toute déformée...

20.Posté par André le 02/02/2012 23:38 | Alerter
Utilisez le formulaire ci-dessous pour envoyer une alerte au responsable du site concernant ce commentaire :
Annuler
Bonsoir, c'est normal que je ne puisse pas bénéficier de cette nouveauté dans mes modules ?

Merci

19.Posté par Jerome PIETRI le 02/02/2012 21:40 | Alerter
Utilisez le formulaire ci-dessous pour envoyer une alerte au responsable du site concernant ce commentaire :
Annuler
@17 Koyolite Tseila
@15 Yann
@14 HARDOUIN Nathalie

Mais oui ca marche, fait nous une capture d'écran sans oublier de nous préciser où est votre Module de Une, le supporte détecte votre navigateur et nous permettra de vous faire un retour rapide.

Ici Chrome Macbook Air OK :)

18.Posté par Jean-Mathieu Marchetti le 02/02/2012 21:37 | Alerter
Utilisez le formulaire ci-dessous pour envoyer une alerte au responsable du site concernant ce commentaire :
Annuler
@ tous ceux qui ont des problèmes :

Nous avons procédé à une mise à jour javascript importante dans le backoffice au niveau du module de une, pensez donc à vider correctement le cache de votre navigateur.

Cela résoudra votre problème.

17.Posté par Koyolite Tseila le 02/02/2012 20:40 | Alerter
Utilisez le formulaire ci-dessous pour envoyer une alerte au responsable du site concernant ce commentaire :
Annuler
Facebook
Je confirme, le module est tout blanc chez moi aussi :(

16.Posté par Koyolite Tseila le 02/02/2012 20:40 | Alerter
Utilisez le formulaire ci-dessous pour envoyer une alerte au responsable du site concernant ce commentaire :
Annuler
Facebook
Je confirme, le module est tout blanc chez moi aussi :(

15.Posté par Yann le 02/02/2012 19:42 | Alerter
Utilisez le formulaire ci-dessous pour envoyer une alerte au responsable du site concernant ce commentaire :
Annuler
Idem, marche pas

14.Posté par HARDOUIN Nathalie le 02/02/2012 18:33 | Alerter
Utilisez le formulaire ci-dessous pour envoyer une alerte au responsable du site concernant ce commentaire :
Annuler
Pour moi c'est pareil sous FF même cache vidé ça ne fonctionne pas.

13.Posté par MMC le 02/02/2012 17:43 | Alerter
Utilisez le formulaire ci-dessous pour envoyer une alerte au responsable du site concernant ce commentaire :
Annuler
On arrête par le progrès avec Wmaker. Bravo à toute l'équipe pour le développement régulier de nouvelles fonctionnalités qui permettent à nos supports d'être toujours à la page !

Mohammed

1 2