Bienvenue sur mon blog !

Bon, ma série des « link of the week » s’est un peu transformé en « link of the year », vu la fréquence…

Il faut dire que je ne trouve pas tant que ca de liens intéressants à partager… Voici quand même une dizaine de liens !
Tout d’abord voici 3 sites que j’ai trouvé simplement beaux :

J’ai particulièrement trouvé intéressant et astucieux le parti-prix de « casser » les verticales par les formes de couleur en fond de page. La palette de couleur est elle aussi agréable.

J’aime beaucoup le visuel du header, la structure de la page est intéressante aussi, bref une charte très réussie à mon goût !

Pour ce dernier, je ne suis pas fan de la mise en page, mais j’aime beaucoup la gamme de couleurs utilisée.

Pour continuer, un site de recherche d’icones.

Il en existe déjà plusieurs, en voici une sélection, mais c’est le premier à ma connaissance en français, ce qui est surtout intéressant pour la recherche par critères, on ne sait pas toujours la traduction des termes…

Donc une bonne initiative, qu’il faut à mon soutenir !

Pour finir, voici 6 sites dédiées à Wordpress, mon « top 6″  quand je recherche des infos sur ce moteur ! Wpchannel propose des tutoriaux vidéos, en français, ce qui est vraiment très pratique ! L’auteur « commet » aussi le site Protuts, qui est une mine d’infos, avec des tutoriels aussi. Idem pour Geekeries, Fran6 et les autres indiqués.

Voilà, c’est tout pour cette fois !

Faites tourner :

Bonjour à tous, j’ai pour éventuel projet de lancer prochainement un forum, lié à un blog Wordpress (sur le graphisme). Je cherche donc des solutions pour lier ces 2 supports, et pour l’instant j’ai un peu de mal à mettre en place ça… J’ai commencé par installer Onepress, mais je viens de m’apercevoir que cette solution n’était pas compatible avec la dernière version de Wordpress.

Je trouve plusieurs plugins et solutions diverses, mais il me semble difficile de tout tester… D’où ce message, si quelqu’un a déjà expérimenté ce genre de « mélange » et accepterait de me donner quelques conseils, je suis preneur !

D’ailleurs il n’est pas forcément judicieux d’utiliser phpBB, il existe aussi d’autres systèmes de blogs, peut-être plus adaptés à une utilisation liée à Wordpress. Là aussi, si vous avez des conseils… Merci d’avance !

Faites tourner :

Comme annoncé précédemment, je vais refaire entièrement mon site portfolio. Mon but final est d’avoir un site à la fois attractif et original visuellement, tout en ayant une facilité de mise à jour. J’ai donc opté pour le principe d’un site basé sur le moteur Wordpress, qui me permettra d’avoir un module d’administration « tout fait », mais aussi de bons outils de tris croisés (catégories, tags, moteur de recherche…). La difficulté est donc de partir d’un outil (Wordpress) certes très puissant, mais qui a une structure assez « classique ». Donc un gros travail de personnalisation !

Je suis parti d’un thème de base, pour arriver à cette structure. Vous pouvez passer d’un thème à l’autre via le menu déroulant « theme switcher » (tnet v00, tnet v01…). Pour l’instant aucun travail graphique, cette étape viendra plus tard !

J’ai donc commencé en farfouillant les CSS et les ai modifiés en fonction de ce que je voulais. Pour cette partie, un outil très très pratique est l’extension Firebug de Firefox. Une fois installé, cela ajoute en bas de la fenêtre de Firefox une petite icone, qui permet d’afficher tous le code, structure, css de la page visitées. Indispensable pour bien appréhender comment est construite une page, et donc la modifier.

Regardez par exemple dans la capture d’écran ci-dessous : j’ai activé Firebug et le mode « inspection », ensuite je survole n’importe quel élément dans la page, et en bas s’affiche le code correspondant, la classe CSS, etc. Et à droite les attributs de la classe, dans quel fichier, à quel numéro de ligne, etc.

Donc j’ai modifié les attributs CSS des zones qui m’interessaient, à savoir les sidebar, header, etc. selon le schéma suivant :

Je suis donc parti de ça :

pour arriver à ça :

Donc une page très très large (8000 pixels), divisée en 4 sections. Pour naviguer entre ces sections horizontales, j’ai voulu utiliser une bibliothèque javascript qui permet un défilement progressif dans les liens « ancre » d’une page. Il s’agit de « Tiny scrolling« . Un exemple de site utilisant ce javascript : Horizontal way ou encore celui-ci qui est plus proche de ce que je veux faire.

Pas de souci pour intégrer le javascript à Wordpress, mais première déconvenue, dans mon cas le contenu des pages autres que le portfolio seront en Flash, et les liens dans les Flash ne fonctionnaient pas en « progressif ». Nouveau farfouillage en ligne, pour tomber sur un commentaire sur le site du script, ou une personne fourni une version « personnalisée » du script, qui selon lui fonctionne avec du Flash. Re-installation, cette fois les liens depuis un fichier Flash fonctionnent bien, mais au passage c’est le scroll avec la molette de souris qui ne fonctionne plus ! J’ai donc passé un peu de temps à comparer les 2 fichiers javascripts, pour récupérer la molette sur la version compatible Flash… sachant que je ne suis pas du tout programmeur, ca a été un peu laborieux, mais ca semble fonctionner (sauf sur IE).

Ensuite, il a fallu régler un autre souci : la partie portfolio, donc avec les articles Wordpress, sont en 2e section, donc les liens internes à Wordpress devaient intégrer le lien ancre correspondant. J’ai essayé de jouer avec les réglages de permaliens, sans succés. J’ai donc été demander de l’aide sur le forum Wordpress… La discussion est visible ici. Et donc grâce à l’aide de « Gaz pumped » et « Comme une image« , qui m’a gentiment écrit un filtre php qui permet d’ajouter le lien ancre automatiquement !

Voilà ou j’en suis ! La base « technique » est donc en place, maintenant je vais pouvoir m’atteler à la partie qui m’est plus « facile » : le graphisme ! Et ensuite, le remplissage… A suivre !

Faites tourner :

J’ai pour projet de refaire entièrement mon portfolio en ligne, actuellement en Flash. Tout d’abord parce qu’il ne me plait plus tellement, et que je souhaite une solution qui me facilite les mises à jour. Après moults hésitations, j’essaye de partir sur une base Wordpress, afin de bénéficier du CMS et moteur de recherche intégré. Tout en sachant que j’ai une vision assez précise de ce que je veux au final, et cela ne correspond pas du tout à la structure classique des blogs sous Wordpress. Donc je ne sais pas du tout pour l’instant si cette solution est envisageable, mais je vais au moins essayer !

Comme la personnalisation d’un blog Wordpress est de plus en plus courante, vu l’essor de ce moteur, je vous propose de détailler sur ce blog les différentes étapes de cette réalisation, ça pourra toujours servir à d’autres, et je risque aussi d’avoir par moment besoin d’aide…

Par contre je préfère vous prévenir tout de suite, au vu de mon planning je risque de ne pouvoir travailler que de manière très épisodique sur cette refonte, si ça se trouve ça va s’étaler sur plusieurs mois ! En plus ceux qui me connaissent savent que je spécialiste des projets persos inachevés…

M’enfin, donc la toute première étape a été d’installer Wordress, une nouvelle base de données SQL (pour ne pas mélanger la base du Blog et du futur portfolio), et choisir un thème qui me servira de base, même si je vais être amené à totalement le modifier… Cette version « zéro » est donc visible ici. Le thème utilisé est le « Fervens A », créé par designdisease.com. Ce thème m’a été conseillé sur le forum Wordpress. Ca ressemble pour l’instant à ça :

J’ai juste pour l’instant désactivé les commentaires, et mis quelques billets fictifs, pour que la catégorisation et les mots clés soient actifs. Maintenant il va falloir que j’essaye de modifier la structure complète, je voudrais que cela ressemble au final à ça : essai de structure

Soit un site entièrement horizontal. Bref, ya du boulot pour essayer de mêler les deux… Les thèmes Wordpress étants constitués d’un header, corps, 1 ou 2 sidebars et un footer, je pensais essayer de faire comme cela :

Pas sûr du tout que ce soit réalisable… A suivre !

Faites tourner :

La société Profileo m’a demander de réaliser l’interface du blog et de la boutique d’un projet bien sympathique : De Sab à Tom. Le principe est simple : Sab parcourt le monde, déniche des objets d’artisanat local, et les envoie à Tom qui les vends… Donc des objets uniques, et le principe n’est pas simplement un concept ou un coup de buzz, Sab et Tom existent bien ! Il y a donc le blog sur lequel ils parlent de leurs voyage, racontent comment ça se passe, et en parallèle la boutique ou vous pourrez acheter les objets si vous le souhaitez. Le blog est basé sur le moteur Wordpress. J’ai essayé de faire un header qui « raconte une histoire », et résume graphiquement le principe, en mélant photos et illustrations. Le police utilisée pour le logo est du Caterpillar.

N’hésitez pas à aller voir tout ça par vous-même, pour les encourager !

Faites tourner :