[Magento] Faire des liens

Comment naviguer dans Magento ? Cet article vous aidera à comprendre comment créer des liens vers vos fichiers media, js, skin et autres.

Magento gère les ULR dans les phtml ou les pages CMS grâce à la méthode getBaseUrl() qui se trouve dans la classe store.php (magentoappcodecoreMageCoreModelstore.php). D’autres méthodes alternatives permettent de naviguer tel que getJsUrl() ou getSkinUrl().

URL dans les Phtml
Lien vers la racine de votre site magento : http://www.boutique-magento.com/
Ex 1 :
Ex 2 : ;getUrl(); ? >

Lien vers la page index.php de votre site magento : hhttp://www.boutique-magento.com/index.php/
Ex 1 :

Lien vers le dossier JS : http://www.boutique-magento.com/js/
Ex 1 :
Ex 2 : getJsUrl(); ? >
Ex 3 :
Continuer la lecture

[Prestashop] Les variables globales utiles !

{$base_dir}

Url de votre site web, racine du site. Utile et indispensable lorsque vous insérez des liens, je déconseille fortement de mettre des liens en dur directement dans votre code mais plutôt d’utilisez cette variable et toute les autres qui suivent, car le jour où vous migrez d’hébergement ou de nom de domaine, cela pourrait vous causer beaucoup de problèmes.

{$base_dir_ssl}

Idem via le protocol https.

{$content_dir}

Url vers votre dossier racine du site, peut changer en fonction des paramètres SSL. A ne pas confondre avec {$basedir}, cette variable vous donne l’Url complète jusqu’au dossier racine.

{$img_ps_dir}

Url vers le dossier img situé à la racine de votre boutique.

{$img_dir}

Url vers le dossier img de votre thème.

{$css_dir}

Url vers le dossier css de votre thème.
Continuer la lecture

[WordPress] Comment convertir votre thème en HTML5

Vous avez un blog WordPress, vous n’avez pas peur de mettre les mains dans le « cambouis » ?  Alors mettez à jour votre thème WordPress en HTML5 !

Grâce à cet article, vous allez comprendre la structure globale d’un thème WordPress afin de le convertir en HTML5.
On va modifier les éléments de base tel que l’entête, le corps et le pied de page.

Pour faire d’une page, une page en HTML5, il suffit de changer le doctype de votre document afin d’annoncer que ce dernier sera au format HTML5.  Celui-ci va nous permettre d‘insérer les nouveaux éléments rendant la disposition plus facile et plus efficace.  Le navigateur gère ainsi les éléments qui permettent de fournir des fonctionnalités améliorées, d’offrir une rationalisation du code sémantique et éliminant le besoin de balises supplémentaires.

Étape 1 : entête

Ouvrez votre fichier header.php. Un thème typique écrit en XHTML commencera plus ou moins comme ceci:


    <html xmlns="http://www.w3.org/1999/xhtml" >
    
    <meta http-equiv="Content-Type" content="; charset=" />

Vous devez le modifier comme ceci :


    
    <html id="ie6" >
    
    
    <html id="ie7" >
    
    
    <html id="ie8" >
    
    <html >
    <!--
    
    <meta charset="" />

Ce nouvel en-tête inclut notre doctype HTML5, certaines balises conditionnelles pour IE, et une balise
Continuer la lecture

[Ciné] Les Aventures de Tintin

Date de sortie : 26 Octobre 2011
Réalisateur : Steven Spielberg
Synopsis : Parce qu’il achète la maquette d’un bateau appelé la Licorne, Tintin, un jeune reporter, se retrouve entraîné dans une fantastique aventure à la recherche d’un fabuleux secret. En enquêtant sur une énigme vieille de plusieurs siècles, il contrarie les plans d’Ivan Ivanovitch Sakharine, un homme diabolique convaincu que Tintin a volé un trésor en rapport avec un pirate nommé Rackham le Rouge. Avec l’aide de Milou, son fidèle petit chien blanc, du capitaine Haddock, un vieux loup de mer au mauvais caractère, et de deux policiers maladroits, Dupond et Dupont, Tintin va parcourir la moitié de la planète, et essayer de se montrer plus malin et plus rapide que ses ennemis, tous lancés dans cette course au trésor à la recherche d’une épave engloutie qui semble receler la clé d’une immense fortune… et une redoutable malédiction. De la haute mer aux sables des déserts d’Afrique, Tintin et ses amis vont affronter mille obstacles, risquer leur vie, et prouver que quand on est prêt à prendre tous les risques, rien ne peut vous arrêter…

Mon avis :
Continuer la lecture

[WordPress] Thème en Responsive Design

Bonjour a tous,

Comme vous pouvez le constatez, le blog à subi un petit lifting.

J’ai refait le design avec le thème Yoko : Worpdress (3.1+) gratuit.

Petit rappel, le Responsive Design (design adapté en français) permet, avec la multiplication des terminaux (pc fixe, smartphone, tablette, …) de ne faire qu’un seul site qui sera automatiquement adapté à tout les écrans.

Les fonctionnalités de ce thème sont :

  • Compatibilité avec les navigateurs récents (Chrome, Firefox, Safari, IE8+)
  • Personnalisation des couleurs et du Header
  • Menu de navigation optionnel
  • Commentaires et réponse, intégration de Gravatar
  • Langues : Anglais, Français, Allemand

Yoko est sous licence GPL, donc rien ne vous empêche de l’utiliser comme base pour vos propres thèmes.

Pour le tester, je vous invite donc à redimensionner la fenêtre de votre navigateur ou encore mieux, de le tester avec votre smartphone !

[Ciné] Contagion

Date de sortie : 9 Novembre 2011
Réalisateur : Steven Soderbergh
Synopsis : Une pandémie dévastatrice explose à l’échelle du globe… Au Centre de Prévention et de Contrôle des Maladies, des équipes se mobilisent pour tenter de décrypter le génome du mystérieux virus, qui ne cesse de muter. Le Sous-Directeur Cheever, confronté à un vent de panique collective, est obligé d’exposer la vie d’une jeune et courageuse doctoresse. Tandis que les grands groupes pharmaceutiques se livrent une bataille acharnée pour la mise au point d’un vaccin, le Dr. Leonora Orantes, de l’OMS, s’efforce de remonter aux sources du fléau. Les cas mortels se multiplient, jusqu’à mettre en péril les fondements de la société, et un blogueur militant suscite une panique aussi dangereuse que le virus en déclarant qu’on « cache la vérité » à la population…

Mon avis :
Continuer la lecture

[JS] Blueberry – Slider en responsive design

Blueberry est un plugin jQuery expérimental et open source permettant de faire défiler des images (Slider) dans un environnement fluide (Responsive Web Design). Les utilisateurs utilisent de plus en plus souvent des smartphones pour consulter des pages web ; les intégrateurs web ont donc de plus en plus besoin de maquettes flexibles pour les satisfaire. Voici donc un diaporama adapté à cet usage.

Marquage HTML nécessaire pour utiliser Blueberry :

Continuer la lecture

[JS] Carousel en Responsive Design

Elastislide est un slider / carousel jQuery avec une dose de design responsive pour s’adapter aux différentes résolutions.
Pour créer des pages web responsive, il ne faut pas uniquement penser à la présentation, ajustable avec du CSS. Il faut aussi penser aux fonctionnalités, comme les sliders, slideshow, carousels…

Elastislide permet de résoudre cette problématique, et propose un carousel d’image redimensionnable suivant les dimensions du navigateur.

Côté code, voici ce qu’il faudra mettre en place en HTML:


Continuer la lecture

[Ciné] Real Steel

Date de sortie : 19 Octobre 2011
Réalisateur : Shawn Levy
Synopsis : Dans un futur proche, la boxe a évolué pour devenir un sport high-tech. Charlie Kenton, un ancien boxeur, a perdu toute chance de remporter le championnat depuis que les humains ont été remplacés sur le ring par des robots d’acier de 900 kilos et de 2,40 m de haut. A présent, il n’est plus qu’un manager minable qui utilise des robots bas de gamme fabriqués à partir de pièces de récupération. Il gagne juste assez pour survivre d’un combat à l’autre. Lorsque Charlie touche le fond, il accepte à contrecoeur de faire équipe avec son fils Max, qu’il a perdu de vue depuis des années, pour construire et entraîner un champion. Dans l’arène où tous les coups sont permis, les enjeux sont plus élevés qu’ils ne l’ont jamais été. Contre toute attente, Charlie et Max ont une chance, une seule, de faire leur grand retour…

Mon avis :
Continuer la lecture

[Ciné] Les Trois Mousquetaires

Petite partie détente maintenant ^_^

Je vais vous parler du film « Les Trois Mousquetaires ».

Date de sortie : 12 Octobre 2011
Réalisateur : Paul W.S. Anderson
Synopsis : L’impétueux jeune d’Artagnan et ses trois légendaires compagnons, Athos, Porthos et Aramis vont devoir s’unir et combattre tous ensemble un mystérieux agent double, Mylady de Winter et son employeur crapuleux, le cardinal Richelieu, afin de les empêcher de s’emparer du trône français et d’éviter que l’Europe toute entière sombre dans la guerre.Il s’agit d’une nouvelle adaptation en 3-D du roman « Les Trois mousquetaires » d’Alexandre Dumas…

Mon avis :
Continuer la lecture

Geek au féminin ^_^