Template Yootheme Warp 7 - positionner : son menu mobile & son logo mobile

Publié par Thierry Tardif. Publié dans Tutoriels Joomla

Warp 7 et Internet Explorer 8

Avec la nouveauté du warp 7 chez Yootheme, un certain nombre de modifications on été apportées aux paramètres des templates tels que nous les connaissions sous warp 6.
Notamment nous avons noté un changement dans la dénomination des positions à affecter pour le "menu mobile" et "logo mobile".
Ces éléments sont visualisés lorsque le template est en mode responsive, c'est dire vu sous smartphones ou tablettes de largeur de résolution inférieure à 1024px.

Vous trouverez sur cette page le détails des templates produit sous warp 7 par Yootheme.

Avant de choisir un template Yootheme warp 7, sachez qu'il n'y aucun support pour Internet explorer 8 de la part de Yootheme. Ce qui, à notre avis, n'est pas un choix judicieux de Yootheme, car ce jour (19/10/13) IE8 est utilisé par plus de 9% des internautes "WorldWide" comme nous le montre cette page http://gs.statcounter.com/#browser_version-ww-monthly-201209-201309

Nous avons testé le plugin "Super Fossil" pour Joomla (http://mustaqsheikh.github.io/plg_superfossil/) mais il ne permet pas de résoudre la non adaptation des templates Yootheme warp7 à IE8

Aussi si vous choisissez d'utiliser un template warp 7 nous vous recommandons d'installer une extension telle que "Browser Update Warning" (http://extensions.joomla.org/extensions/site-management/browsers-a-web-standards/20111) pour avertir vos internautes que votre site n'est pas compatible IE8 et les inviter à utiliser un autre navigateur.

Template Yootheme warp 7 position pour le Menu Mobile: offcanvas

Vous devez dans un premier temps dupliquer le module de votre menu principal et le nommer par exemple menu mobile.
Puis assigner ce module dupliqué à la position offcanvas

Template Yootheme warp 7 position du logo Mobile: logo-small

Créez dans un premier temps un nouveau module Contenu personnalisé, et insérez-y votre "logo mobile" puis affectez le à la position logo-small
Attention si vous utilisez JCE comme éditeur de texte, par défaut, JCE rajoute un paragraphe encapsulant l'image de logo, ce qui aura pour effet de mal le positionner.
Pour remédier à ce problème cliquer sur le lien [Toggle Editor] en haut à gauche au dessus de votre éditeur de texte, ce qui vous permettra de modifier le code source du module.
Pour l'étape suivante n'utilisez pas le bouton "Source code editor" de JCE car vous n'arriverez pas à supprimer les balises <p> et</p>.
Supprimer la balise <p> avant votre image de logo et la balise </p> après votre logo.
Puis cliquez sur le bouton Enregistrer.