Tutoriels



Édouard Duplessis
15 mai 2011

Charger différentes feuilles de style par page sous WordPress

Ok premier article de blog depuis très longtemps et en plus je me lance a faire un petit tutoriel, donc s.v.p. un peu de compassion… :)

Est-ce qu’il vous est déjà arriver de vouloir charger un certain script et/ou feuille de style seulement lorsque une page est demandé. Exemple une page de contact avec une carte interactive google ou une page de complètement différente de votre site et vous voulez avoir une page de css spécialement pour elle.

Rien de plus simple, il existe un hook qui permet de savoir quel page est charger et ce hook est juste avant « wp_head », donc il vous permet de charger votre script avec wp_enqueue_script() ou wp_euqueue_style().

Pour faire ce petit bijoux de code ouvrer votre fichier functions.php de votre thème.

//ajout d'une function dans le hook 'template_redirect'

add_action('template_redirect','custom_stylesheet');

function custom_stylesheet(){

    if(is_front_page()){

        wp_enqueue_style('homestyle', get_stylesheet_directory_uri().'home.css',false, null);

    }else{

        wp_enqueue_style('style', get_stylesheet_uri(),false,null);

    }

}

Voila c’est aussi simple que ça. Si c’est notre front page on charge la feuille de style home.css qui se trouve dans le dossier de notre thème(child) sans dépendance et sans version. Sinon on charge la feuille de style par défault style.css

Et surtout ne jamais faire ça directement dans votre header.php, utiliser toujours wp_enqueue_style() ou wp_enqueue_scrypt() pour charger vos js et css.





yannick
19 avril 2011

Recherche apache solr pour drupal 6 sous Ubuntu 10.04

J’ai décidé d’écrire ce petit guide pour l’intégration du module de recherche apache solr sous drupal parce que je devais l’intégrer à un projet et que la procédure expliquée à même le module m’a laissé un peu sur mon apétit. En efftet, si on suit le petit guide, tout se passe bien sauf pour un détail : l’installation du serveur apache solr. Je voulais pouvoir l’installer comme un service et non avoir à le partir directement avec la commande java, ce qui est très peu pratique pour un site web « live ». Seul bémol, cela vous prendra un serveur dédié ou un VPS pour povoir procéder à cette installation sinon, bien sûr, sur votre serveur local.

Installation de java

Tout d’abord, il faut avoir une version d’un java jdk pour rouler le serveur apache solr. Personnellement, j’y ai été avec celle de sun, mais vous pouvez (j’imagine !) utiliser la version qui vous convient.

su root
apt-get install sun-java6-jdk

Assurez-vous que tout s’est bien passé en tapant la commande

java -version

Vous devriez voir des informations concernant la version de java nouvellement installée.

Installation et configuration du serveur solr-jetty

apt-get install solr-jetty

À la fin de l’installation, le serveur ne démarrera pas puisqu’il faut aller éditer le fichier de configuration d’abord.

nano /etc/default/jetty

Voici les paramètres de configuration que j’ai utilisé

#mettre a 0 pour que le serveur puisse démarrer
NO_START=0
#vous pouvez le laisser à 8080, mais par défaut, le module drupal utilise 8983
JETTY_PORT=8983
#mettre le chemin de votre java jdk
JAVA_HOME=/usr/lib/jvm/java-6-sun

Démarrez le serveur solr-jetty

/etc/init.d/jetty start

Vérifier que tout fonctionne bien au http://localhost:8983/solr où 8983 est le numero du port que vous avez mis dans la configuration plus haut. Vous devriez arriver sur une page de bienvenue disant Welcome to Solr avec un lien vers l’admin. Si cela ne fonctionne pas, revérifiez vos paramètres de configuration. Vous pouvez vérifier aussi que tous les droits de lecture sont configurés pour tous sur les fichiers sous /etc/solr/conf et /user/share/solr.

Installation du module Apache Solr Search Integration

Si vous êtes rendu ici, vous n’êtes pas très loin de la réussite. Téléchargez le fichier de la version la plus récente pour drupal 6 à l’adresse http://drupal.org/project/apachesolr et extraire le contenu dossier dans le répertoire /sites/all/modules de votre installation drupal. Téléchargez le client php pour apache solr (la révision 22) comme suit :

cd [/chemin/vers/modules]/apachesolr/
svn checkout -r22 http://solr-php-client.googlecode.com/svn/trunk/ SolrPhpClient

Si vous n’avez pas l’application subversion (pour utiliser la commande svn), vous pouvez l’installer avec

apt-get install subversion

ou tout simplement télécharger le client php pour solr à l’adresse suivante http://solr-php-client.googlecode.com/files/SolrPhpClient.r22.2009-11-09.tgz et extraire le dossier sous le répertoire du module apachesolr.

Normalement, vous devriez avoir un dossier SolrPhpClient dans le répertoire du module apachesolr.

note: Si votre projet drupal est dans un système de révision et que vous utilisez la commande svn pour vous appropriez le client php, n’oubliez pas de supprimer les dossiers .svn avant de faire un commit !

Vous pouvez maintenant procéder à l’installation du module via l’interface de drupal (Apache Solr Framework && Apache Solr Search). Rendez vous à la configuration du module (admin/settings/apachesolr/settings) et normalement, vous devriez voir les messages suivant :

Apache Solr: Your site has contacted the Apache Solr server.
Apache Solr PHP Client Library: Correct version "Revision: 22".

Si vous avez un message d’erreur disant que le site ne peut contacter le serveur apache solr, assurez-vous que le port est bien le même que celui entré dans la configuration de jetty. Normalement, localhost pour l’hôte et /solr comme chemin devrait être correct.

Il ne reste plus qu’une seule étape pour que le tout fonctionne : copier les fichiers schema.xml et solrconfig.xml, disponibles dans le répertoire du module apachesolr dans le dossier de configuration de jetty :

cd [/chemin/vers/modules]/apachesolr/
mv /etc/solr/conf/schema.xml /etc/solr/conf/schema.xml.bak
mv /etc/solr/conf/solrconfig.xml /etc/solr/conf/solrconfig.xml.bak
cp schema.xml /etc/solr/conf/schema.xml
cp solrconfig.xml /etc/solr/conf/solrconfig.xml

le serveur devra aussi écrire dans le répertoire /usr/share/solr pour créer les index de recherche. Il faut donc changer le propriétaire du répertoire pour jetty :

chown -R jetty:jetty /usr/share/solr

et redémarrer le serveur solr-jetty

/etc/init.d/jetty stop
/etc/init.d/jetty start

visitez les pages http://localhost:8983/solr/admin/file/?file=schema.xml et http://localhost:8983/solr/admin/file/?file=solrconfig.xml et assurez-vous que l’attribut name des balise <config> et <schema> contient bien drupal-[version]

Et voilà, vous pouvez maintenant pleinement profiter du pouvoir de la recherche avec apache solr sous drupal 6. J’espère que ce guide a pu vous être utile, n’hésitez pas à y laisser des commentaires !

sudo mv /etc/solr/conf/schema.xml /etc/solr/conf/schema.xml.bak




François Viens
2 septembre 2010

Bilinguisme et WordPress : plugins et astuces

La fin de semaine dernière se tenait l’anti-conférence (pas mal le même format qu’une conférence standard!) WordCamp Montréal qui en était à la 2e édition. Pour l’occasion, non seulement QuiboWeb s’était trouvé des T-Shirts, en plus, nous avions trouvé un conférencier, Yannick Carrière, qui a parlé de bilinguisme et WordPress, une réalité avec laquelle les concepteurs Web du Québec doivent jongler dans leur day to day. Vous pouvez consulter les slides, en gros, le plugin WPML Multilingual CMS est à ce jour la solution la plus intéressante pour la majorité des cas.

View more presentations from yannickcg.

J’ai également pris une vidéo avec mon Iphone, le son est approximatif… il faut absolument mettre des écouteurs ou le volume dans le tapis pour bien en profiter… Bon visionnement!

Bilinguisme et WordPress : plugins et astuces from Quibo Web on Vimeo.





yannick
19 mai 2010

Insertion d’images dans une zone texte en drupal 6.x avec WYSIWYG image upload et TinyMCE

Il est très pratique de pouvoir insérer des images dans une boîte de contenu plutôt que de passer par un champ CCK. Voici une façon simple d’y parvenir. J’ai décidé de le faire avec TinyMCE, mais le créateur du module d’insertion d’images affirme que cela fonctionne avec tous les éditeurs supportés par le module WYSIWYG.

Vous aurez besoin des modules drupal suivants :

  • WYSIWYG (éditeur HTML)
  • WYSIWYG image upload (ajoute la fonctionnalité à l’éditeur d’insertion d’images)
  • jQuery Update (version 6.x-2.x-dev – une version plus récente de jQuery de celle qui est incluse pas défaut avec drupal)
  • jQuery UI (inclut la possibilité de se servir des fonctionnalités de jQuery UI)
  • jQuery UI Dialog (une boite de dialogue provenant de jQuery UI)
  • imageAPI (permet la manipulation d’images)
  • ImageCache (permet d’avoir plusieurs alternatives de grandeur d’image pour une seule image)

Au niveau PHP, vous aurez besoin de l’un des modules suivants pour permettre la manipulation d’images :

Pour commencer, vous aurez besoin d’un autre fichier, il s’agit de la version 1.7.2 de jQuery UI. Il faut ensuite extraire le fichier .zip dans le répertoire du module jquery_ui. Renommez le dossier jquery-ui-1.7.2 pour jquery.ui. Normalement, tous les sous dossiers de jquery-ui (demos, docs, external etc…) doivent se retrouver sous …modules/jquery_ui/jquery.ui/.

Ensuite, il vous faut TinyMCE, la version « main package ». Il faut extraire ce fichier .zip sous /sites/all/libraries/, de sorte que le fichier tiny_mce.js se retrouve a cet emplacement : /sites/all/libraries/tinymce/jscripts/tiny_mce/tiny_mce.js. Vous pouvez ensuite procéder à l’installation de tous les modules. Le choix de cet éditeur reste personnel et une fois le module WYSIWYG installé, vous pourrez en choisir un autre de votre choix. Je ne peux confirmer que l’insertion d’images fonctionnera par contre.

Activez maintenant tous ces modules…

Sous administer > site configuration > wysiwyg, il faut éditer les profils ‘filtered HTML » et « full HTML ». Dans la configuration du profil sous lequel vous voulez l’insertion d’images, dans buttons et plugins, activez image uploading (normalement dans les derniers boutons). N’oubliez pas d’éditer les fonctionnalités pour chaque profil sinon, des paramètres par défaut seront utilisés. Vous pourrez maintenant insérer des images en cliquant sur  dans l’éditeur pour ajouter une image à partir d’une boite de dialogue. Vous pouvez installer aussi (si ce n’est déjà fait) le « image browser » qui vient avec WYSIWYG image upload et qui permet de garder une librairie d’images que l’on peut réutiliser !

Et voilà, bonne insertion d’images !