[RESOLU] CSS et $HOOK_HEADER pour w3c

micmic · October 15, 2009

Bonjour ,

j'aimerais valider mon site internet en w3c mais j ai une erreur :
lorsque j insère un module (slide) les css associé a ce slide s'intègre directement dans le body alors qu il devrait etre dans le header

<link rel="stylesheet" type="text/css" href="{$module_dir}slickslider.css" />

j ai une variable dans le header.tpl $HOOK_HEADER

est il possible d assigné mon link dans le header pour que ce css qoit dans le header et non dans le body

quelque chose dans le style :

$HOOK_HEADER .='<link rel="stylesheet" type="text/css" href="{$module_dir}slickslider.css" />';

Cordialement

Cegiel · October 15, 2009

Bonjour,

J'ai plus simple.

Tu crées la function suivante dans le module :

   /**
     * Insert a .css file in the <head>
     *
     * @file string Name of the CSS file (ex. 'module.css')
     * @media string Media of the CSS link file (ex. 'all', 'media')
     */
   function css_file($file = '', $media = 'all')
   {
       global $css_files;

       if($file == '')
       {
           $file = $this->name.'.css';
       }

       // Insert the default css file
       $css_files[$this->_path.'css/'.$file] = $media;

   }

Et pour passer ton appel de css dans le head, tu appelles la fonctions dans la class du module :

$this->css_file('slickslider.css');

Cordialement.

PS : pour les js, tu peux faire aussi :

   /**
     * Insert a .js file in the <head>
     *
     * @file string Name of the JS file (ex. 'module.js')
     */
   function js_file($file = '')
   {
       global $js_files;

       if($file == '')
       {
           $file = $this->name.'.js';
       }

       // Insert the default css file
       $js_files[] = $this->_path.'js/'.$file;

   }

micmic · October 15, 2009

Merci pour ce conseil voici mon fichier slicksliders.php ou jai rajouté la fonction


class slickslider extends Module
{
   function __construct()
   {
       $this->name = 'slickslider';
       $this->tab = 'Home';
       $this->version = 1.0;

       parent::__construct(); // The parent construct is required for translations

       $this->page = basename(__FILE__, '.php');
       $this->displayName = $this->l('Slick slider module');
       $this->description = $this->l('Slider module modified for presta by Iamcaptain');

   }

   function install()
   {
       if (!parent::install())
           return false;
       if (!$this->registerHook('home'))
           return false;
       return true;
   }

   function hookHome($params)
   {
       global $smarty;
       return $this->display(__FILE__, 'slickslider.tpl');

   }    
  /**
     * Insert a .css file in the <head>
     *
     * @file string Name of the CSS file (ex. 'module.css')
     * @media string Media of the CSS link file (ex. 'all', 'media')
     */

  function css_file($file = '', $media = 'all')
   {
       global $css_files;

       if($file == '')
       {
           $file = $this->name.'.css';
       }

       // Insert the default css file
       $css_files[$this->_path.'css/'.$file] = $media;

   }

Puis dans module je dois mettre l appel de fonction

$this->css_file('slickslider.css');

mais le problème c'est ou dois je mettre cette appel dans la Class Module.php , dans la construction ?

Cegiel · October 15, 2009

Micmic,

Il faut le mettre dans le hookHome(), comme ça :

class slickslider extends Module
{
   function __construct()
   {
       $this->name = 'slickslider';
       $this->tab = 'Home';
       $this->version = 1.0;

       parent::__construct(); // The parent construct is required for translations

       $this->page = basename(__FILE__, '.php');
       $this->displayName = $this->l('Slick slider module');
       $this->description = $this->l('Slider module modified for presta by Iamcaptain');

   }

   function install()
   {
       if (!parent::install())
           return false;
       if (!$this->registerHook('home'))
           return false;
       return true;
   }

   function hookHome($params)
   {
       global $smarty;

       $this->css_file('slickslider.css');
       return $this->display(__FILE__, 'slickslider.tpl');
   }    

   /**
     * Insert a .css file in the <head>
     *
     * @file string Name of the CSS file (ex. 'module.css')
     * @media string Media of the CSS link file (ex. 'all', 'media')
     */

   function css_file($file = '', $media = 'all')
   {
       global $css_files;

       if($file == '')
       {
           $file = $this->name.'.css';
       }

       // Insert the default css file
       $css_files[$this->_path.'css/'.$file] = $media;

   }
}

Mais attention, ça fonctionne uniquement si le css est dans un sous-dossier "css" de ton module.

Si le css est directement dans le dossier du module, la fonction sera :

   /**
     * Insert a .css file in the <head>
     *
     * @file string Name of the CSS file (ex. 'module.css')
     * @media string Media of the CSS link file (ex. 'all', 'media')
     */

   function css_file($file = '', $media = 'all')
   {
       global $css_files;

       if($file == '')
       {
           $file = $this->name.'.css';
       }

       // Insert the default css file
       $css_files[$this->_path.$file] = $media;

   }

micmic · October 15, 2009

cela ne fonctionne pas j ai pas le css dans mon header , meme si le lien n'est pas bon il devrait m afficher le link
mais la rien pas de link dans mon header correspondant a slickslider.css

<?php

class slickslider extends Module
{
   function __construct()
   {
       $this->name = 'slickslider';
       $this->tab = 'Home';
       $this->version = 1.0;

       parent::__construct(); // The parent construct is required for translations

       $this->page = basename(__FILE__, '.php');
       $this->displayName = $this->l('Slick slider module');
       $this->description = $this->l('Slider module modified for presta by Iamcaptain');

   }

   function install()
   {
       if (!parent::install())
           return false;
       if (!$this->registerHook('home'))
           return false;
       return true;
   }

   function hookHome($params)
   {
       global $smarty;

   $this->css_file('slickslider.css'); 
       return $this->display(__FILE__, 'slickslider.tpl');

   }                                    
/**
     * Insert a .css file in the <head>
     *
     * @file string Name of the CSS file (ex. 'module.css')
     * @media string Media of the CSS link file (ex. 'all', 'media')
     */

   function css_file($file = '', $media = 'all')
   {
       global $css_files;

       if($file == '')
       {
           $file = $this->name.'.css';
       }

       // Insert the default css file
       $css_files[$this->_path.$file] = $media;

   }


}

?>

le css ce trouve bien dans le dossier de mon module a coté du php
ou est donc l erreur c'est tt a fait le genre de fonction que je recherche .

Cordialement

Yoya · October 15, 2009

Hello,
vraiment pas mal le coup du $css_files[] dans le header.php, j'avais pas vu que çà existait.
Merci pour le coup de projecteur Cegiel.

Pierre

Yoya · October 15, 2009

function hookHome($params)
   {
       global $smarty;
       global $css_files;
       $css_files[$this->_path.'slickslider.css'] = 'all';
       return $this->display(__FILE__, 'slickslider.tpl');
   }

Et juste ainsi, sa doit fonctionner non ?

micmic · October 15, 2009

bonjour pierre ,

merci pour ton conseil je viens de tester mais cela ne fonctionne toujours pas snif

Pourtant j ai bien dans mon header .php :

if(isset($css_files) AND !empty($css_files)) $smarty->assign('css_files', $css_files);
if(isset($js_files) AND !empty($js_files)) $smarty->assign('js_files', $js_files);

Cordialement

Yoya · October 15, 2009

Hum...
Bien zarbos : je viens de le tester chez moi à l'instant çà fonctionne.

As tu bien çà aussi dans ton header.tpl (ligne 16 à 20 chez moi) :

{if isset($css_files)}
   {foreach from=$css_files key=css_uri item=media}
   <link href="{$css_uri}" rel="stylesheet" type="text/css" media="{$media}" />
   {/foreach}
{/if}

si oui, remplace momentanement par :

{if isset($css_files)}
   {foreach from=$css_files key=css_uri item=media}
       < script >
       alert('{$css_uri}');
       < /script >
   <link href="{$css_uri}" rel="stylesheet" type="text/css" media="{$media}" />
   {/foreach}
{/if}

Sa va poper de l'alert javascript avec les url des fichiers css chargés : regarde si tu vois le tiens passer et si oui, s'il n'y a pas un probleme d'url.

edit: enleve les espace autour de < script > et < /script >

Cegiel · October 15, 2009

Re,

Désolé, il fallait faire l'appel à cette fonction dans le hookTop()... Je ne savais pas que ça ne marche pas dans les autres hooks.

En pièce jointe, le module slickslider avec le "css" et les "js" dans le <head>. J'ai testé sur une boutique 1.2.4. Ca fonctionne.

Cordialement.

slickslider.zip

Yoya · October 15, 2009

Ok merci de l'info Cegiel : t'as trouvé çà comment ?

Cegiel · October 15, 2009

Re,

En fait, j'étais il y a quelques temps sur le déloppement d'un module de connexion en ajax. Ce module utilise le hookTop().
Et me rendant compte qu'en appelant des css en plein <body>, le site n'était plus 3WC.

J'avais essayé de bidouiller avec un hookHeader sans succès c'est en regardant les header.php et header.tpl que j'ai vu ces deux variables globales. J'ai donc créé les petites fonctions css_file() et js_file() en me disant que ça pourrait resservir. Mais je n'avais testé ailleurs que dans le hookTop(), d'où erreur.

Cordialement.

micmic · October 15, 2009

a yes merci Cegiel ca fonctionne si je le met aussi dans le top . :-)

J ai plusieurs modules a modifier pour gérer les CSS dans le head pour que mon site soit au norme W3C

Merci aussi a yoya971 pour ca petite fonction en popup js qui est bien utile pour la verif .;-)

Cordialement

Yoya · October 15, 2009

Ok
En fait je me demandais plutot pourquoi sa marchait que dans le hook_top mais je viens de comprendre : dans le hook_home, la variable $css_files serat bien renseigné mais pas 'injectée' par header.tpl bien sur ....

Merci en tout cas!

Tout est bien qui fini bien : le w3c peut etre fier de nous

micmic · October 15, 2009

Et Hop au normes W3c merci encore
grace a ca, cela ma permis de comprendre bcp de chose sur le fonctionnement des modules

:gulp:

[RESOLU] CSS et $HOOK_HEADER pour w3c

Recommended Posts

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Link to comment

Share on other sites

Create an account or sign in to comment

Create an account

Sign in