PN .8 avec dreamweaver comme éditeur (pntemplates)
Auteur Sujet

Post 
Bonjour,

Avant de poser ma question (et après avoir cherché dans les forums PN Fr et Com), quelques éléments de contexte autour de mon expérience pour mieux comprendre ma préoccupation (désolé, c’est long, mais je suis aussi concis que possible) :

1. Je connais Postnuke depuis 2002. J’ai motorisé surlesplanches.com avec PN. Je ne suis pas « développeur », mais je n’ai jamais hésité à « mettre les mains dedans » essentiellement pour améliorer le design du site en matière de présentation des pages de modules/blocks ou adaptations du vocable (traductions). La meilleure illustration : http://www.surlesplanches.com/Recommend_Us.html (parce que je trouve vraiment bête de demander un email sans en expliquer l’usage qui en sera fait). Résultat : je ne suis pas expert HTML/PHP/MySQL mais j’ai les bases me permettant d’éditer un code PN (ce que je fais le moins possible pour pouvoir bénéficier des mises à jour).

2. En marge de surlesplanches.com/PN, j’ai découvert Dreamweaver, qui, pour la construction de sites dynamiques, propose de merveilleux assistants (générateurs de code) pour des fonctionnalités fiche, liste ou formulaire. Après plusieurs petites expérimentations, j’ai élaboré (sans développement au sens strict, mais beaucoup de « paramétrages », et un apprentissage sur les CSS) un système de gestion d’affaires qui tient la route (cf. http://bop.e-media-management.com/siteD/dm0). Ce faisant, j’avoue avoir une opinion très très positive de Dreamweaver (aujourd'hui CS3) et pour son mode « création » permettant de mettre en page un fichier php sans éditer le code (parce que je ne suis pas développeur).

3. Je suis de loin depuis un an et demi la préparation de la .8 (j’ai notamment eu l’occasion d’explorer sommairement OpenStar) et je suis vivement motivé par cette version, qui, si je l’ai bien compris, désimbrique le « fonctionnel » des modules de la présentation des pages (pnRender/Smarty/… ???) et qui se traduit surtout pour moi par l’édition des fichiers /pntemplates/xxxx_xxxx_xxx.htm. Et ça, c’est vraiment génial ! (je viens d’installer une .8 rc2 sous un easyphp local, et j’avoue que cette .8 me semble tenir ses promesses et récompenser notre attente, mais je me suis déjà exprimé ailleurs sur ce sujet).

Alors voilà ma préoccupation :

Est-il possible d’éditer ces pages /pntemplates/xxxx_xxxx_xxx.htm avec Dreamweaver pour bénéficier de ces qualités Wsiwyg ? … afin, par exemple, qu’un champ soit restitué sous forme d’ « éléments invisibles » Dreamweaver (les petits picto jaunes disant « là, c’est du code »).

J’ai googlisé ma préoccupation (dreamweaver smarty) et j’ai identifié une extension dreamweaver sur le sujet (http://www.scottwilburn.com/2006/05/12/smarty/). Mais, petit problème, les balises interprétées sont délimitées par { et } alors que les balises d’extension de PN ressemble à « <!--[ » et « ]--> ». Alors cette extension ne fait pas l’affaire (mais peut-être peut-on l’adapter ? icon_wink . Toutefois, la piste me semble la bonne (j’ai un peu cherché, après install, des xml définissant les règles de cette extension Dreamweaver mais n’ai rien trouvé).

J’imagine ne pas être le seul à partager cette préoccupation. D’autres auront peut-être trouvé une solution.

Question subsidiaire : à l’examen des pages /pntemplates/xxxx_xxxx_xxx.htm, il faut donc s’approprier une syntaxe et grammaire additionnelles au html. J’ai un peu cherché la doc mais n’ai rien trouvé, car pour le novice que je suis, je ne sais pas si c’est du pnRender, du Smarty, ou du Xanthia … ou encore autre chose ! (Ma principale crainte avec la .8, c’est d’être un peu largué … alors que je ne suis pas du genre à hésiter à investir de mon temps)
Pour assimiler cette syntaxe, quelles sont donc les documentations disponibles (et où ?), en français pour débuter (si possible), et en anglais pour approfondir ?

D’avance merci aux admins, et aux autres.

Laurent

Données personnelles

Post 
Bonjour Laurent,

J'utilise moi aussi Dreamveawer cs3 dans mon cadre professionnel.
Pour te répondre, je l'utilise aussi bien dans les fichiers php que pour les templates, il te permettra en effet d'utiliser le Wsiwyg, néanmoins pour le rendu final, vu que l'inclusion des css se fait de façon dynamique, tu pourras voir réllement le résultat final que par le biais de ton naviguateur.

Pour les balises smartys, je le fais à la main car j'en ai l'habitude maintenant :)

Pour le fonctionnement des modules, je te conseil de regarder le module blank qui explique bien comment est développé un module.
Sinon, regardes la doc officielle => http://community.postnuke.com/Wiki-tag-DeveloperDocs.htm (elle est encore incomplète sur certain point).

Voilà j'espère d'avoir aidé un peu ;)
Données personnelles Accueil

Post 
... je sens donc qu'il va me falloit m'investir sérieusement icon_confused

Mais grâce à ta réponse, j'ai trouvé cela http://community.postnuke.com/Wiki-...teStructure.htm qui me semble introductif ...

Mais je ne sais toujours s'il me faut causer couramment : pnRender ? Xanthia (je suis pas certain, puisque j'ai retenu que mon AutoTheme - adopté avant l'existence de Xanthia - était équivalent) ? smarty ? icon_eek

Sinon, il y a un an, j'avais aussi trouvé cela http://smartydwt.klitsche.org, mais c'était sous MX2004 . Et là les délimiteurs sont du genre < ? smarty: .

Cela m'a l'aire plus ouvert - plein de fichiers xml icon_evil - donc peut-être adaptable à PN ???

Laurent

PS : moi, lorsque je visualise avec Dw un .htm d'un /pntemplates, ça me fait "oups !" dans le dos.

Il est vrai que les CSS sont dynamiques, donc ça ne sera jamais glop (j'y avais pas pensé) ... à moins qu'on ajoute un
  1.  link href=" ... /style.css" rel="stylesheet" type="text/css"  
dans le .htm. Mais dans ce cas, c'est peut-être le moteur qui va faire "oups!" ...

On dira c'qu'on voudra, mais pour maquetter (habiller) et donc designer des templates, c'est tout de même mieux de bosser en wysiwyg surtout avec des trucs comme Dw CS3 !!! Pourquoi s'emm... avec des éditeurs de texte.
Données personnelles

Post 
Pourquoi s'emmerder?
Parce qu'avec un éditeur wysiwyg on prend trop vite de mauvaise habitude qui se paye derrière.
Avec un éditeur de texte tu te contente vite de travailler sur la structure basique de la page : définir les div qui permettent de répartir les blocs de contenu.
Le style ça se travaille dans le css.
Du coup
(méthode creatif)
1 avec ton éditeur de texte tu ponds ta structure basique
2 tu remplis artificiellement ta page (avec du lorem ipsum) en intégrant les types de format qui te seront nécessaire dans chaque bloc: des p, des h1 h2 h3 h4... des ol, ul ... des li , des a etc... histoire de travailler ton design uniquement dans une feuille css à toi
Tu es content de l'aspect de ton thème?
3 tu récupères une feuille css d'un thème standard et tu l'édites pour inclure dans les définitions de style par défaut postnuke tes styles
4 tu récupères un thème qui se rapproche très fortement de ta structure basique et tu lui donnes ta nouvelle feuille de style (en oubliant pas de mettre les bonnes images dans les bons répertoires de thème...

J'ai pas donné dans le détail, mais en gros tu as créé un thème personnel sans réinventer la roue pour tout et surtout en donnant un maximum de chance de validation w3c de ton thème ce qui signifie : rapiditité et qualité d'affichage, meilleure indexation, plus grande accessibilité et potentiellement plus grande portabilité vers les navigateurs non-ordinateur (les pda, webtv etc...).

Le pb des éditeurs wysiwyg, qu'ils s'appellent dw ou kompozer, c'est qu'il leur arrive trop facilement de tripoter un brin en douce le code pour gérer l'aperçu.
En parallèle, le créatif se laisse embarquer par un outil visuel et il se met lui même à bidouiller pour faire rentrer son design contre la qualité du fichier.
Alors en effet dans un premier temps tu as l'impression de développer plus vite... mais dès que tu veux optimiser parce que ça rentre plus dans les cases et que ton template part en vrac, tu te retrouves dans une architecture abracadabrante dans laquelle tu passes des heures à essayer de savoir qui est emboité dans quoi.

C'est un avis perso, mais après avoir adoté DW, j'ai trouvé tellement de bénéfices à revenir aux éditeurs basiques que l'idée de reéinstaller un DW me paraît saugrenue.

Dernier intérêt... tu es à peta ou chnok, ton site foire... tu te connectes vites fait en ssh (si tu peux) et avec un éditeur de base (vim, nano...) tu retouches la structures de ton thème en deux temps trois mouvements.

Les outils de bases: un papier et un crayon pour designer la structure, un editeur genre scite, un firefox avec webdevelopper et fireftp (en addon) et un lamp installé sur une ubuntu (ou autre distrib) et tu travailles on the fly en local ton thème.
Données personnelles Accueil

Post 
Complément d'information, voici un cheatsheet du pnrender .
Données personnelles Accueil

Post 
A MagicVince : Toutes mes excuses. Je ne voulais pas polémiquer ou être dogmatique. Je relatais un usage (le mien, parce que je ne place pas la validation W3C au premier rang de MES priorités - à tord peu être -) et il est vrai que ma dernière phrase ouvrait des portes partisanes. Désolé si j'ai ravivé une braise. Par ailleurs (vu mon niveau : "je ne suis pas développeur"), je ne suis pas certain d'avoir tout capter du propos (trop condensé pour le novice que je suis). Enfin, pour ce qui est de "ne pas réinventer la roue", de ce côté là, c'est bien le premier de mes principes. C'est d'ailleurs pourquoi : je préfère PN à du sur-mesure, je préfère les assistants Dw au codage, je designe (thème PN ou gabarit Dw) à partir de design existant ... parce que je n'ai pas les compétences tout simplement (mais cela ne m'interdit de les développer). Nous sommes donc bien d'accord icon_wink

A Makeu : une page de référence est probablement bien utile ... mais cela suppose acquis les bases de ... pnRender. Voici donc la réponse à ma question subsidiare initiale : c'est du côté de pnRender que je dois approfondir. Merci icon_wink Et quant j'aurais digérer le sujet alors la cheatsheet (?!?) me sera bien utile.

Laurent, le newbie
Données personnelles

Post 
Avant de maitriser les subtilités de la bête, voici comment je procédais ...

1/ Dans PNRender, tu valides "Afficher l'information de vérification en commentaire"
afin de voir les zones de ton template dans le source des tes pages Postnuke
2/ tu récupères ta page générée par postnuke avec ton navigateur préféré, IE7 ?;->
3/ Tu édites ta page avec DW ...
4/ Tu sauvegardes ton nouveau css de mort qui tue
5/ Tu sauvegarde ta page qu'est maintenant à ton gout
6/ Tu remplaces tes zones taggées par PNRender par les codes Smarty que tu as dans ton template original
7/ Tu as ton nouveau template accompagné de son css !

Une méthode itérative à la papa qui te permet en plus de faire du versionning.
Vu qu'en étape2, tu peux enregistrer ta page et son css en test1.html test2.html, etc.

Avec l'habitude, l'option firebug de Firefox et un petite éditeur du type notepad++
tu prendras rapidement l'habitude de faire les modifs rapides à la volée,
sans DW et sans cauchemarder sur les synchro, les mises à jour et la gestion des caches divers et variés ...

Le point important est de bien comprendre la structure de PN et la gestion des thèmes,
en cela DW n'est pas d'une grande utilité, bien au contraire ...
Mais il est vrai que cela rassure de commencer dans son environnement habituel ...

Laurent Dubois - Consultant commercial
Réseaux : Ziki Viadeo Xing
Données personnelles Accueil

Post 
Makeu a écrit :
Complément d'information, voici un cheatsheet du pnrender .


Merci Beaucoup !
Je m'étais gardé quelques morceaux dans un txt,
Voilà qui est bien plus propre et plus complet icon_wink

Laurent Dubois - Consultant commercial
Réseaux : Ziki Viadeo Xing
Données personnelles Accueil

Post 
De rien ljvd !

Je confirme que Firebug est un outil indispensable qui te permettra de changer ton css en direct pour voir l'aspect que cela peut donner (mais si les modifes te conviennent, il te faudra les modifiers dans ton fichier css). Mais j'utilise plus firebug pour le debug javascript, cet un outil puissant que je ne peux plus me passer !

Je m'écarte un peu mais dans les modules complémentaires de Firefox, tu as aussi Web developper qui est lui aussi énorme, MeasureIt, Colorzilla et pleins d'autres !
Données personnelles Accueil

Post 
Makeu a écrit :
De rien ljvd !

Je confirme que Firebug est un outil indispensable qui te permettra de changer ton css en direct pour voir l'aspect que cela peut donner (mais si les modifes te conviennent, il te faudra les modifiers dans ton fichier css).

Je testerai le changement en direct à l'occasion.
Makeu a écrit :

Je m'écarte un peu mais dans les modules complémentaires de Firefox, tu as aussi Web developper qui est lui aussi énorme, MeasureIt, Colorzilla et pleins d'autres !

Firefox a des modules très pratiques en effet. Je vois que nous avons un environnement de travail similaire.

Laurent Dubois - Consultant commercial
Réseaux : Ziki Viadeo Xing
Données personnelles Accueil

Post 
Merci pour vos réponses (l'astuce de laurent LJVD - en 7 points - consistant à paramétrer pnRender pour inclure en commentaire les zones, est vraiment bien).

J'ai pris un peu de temps, pour ceux que cela intéresse, pour mettre au point 4 extensions Dreamweaver :

> coloration du code
> accélérateur de saisie (mode code)
> "render" des balises pn (mode création)
> barre d'outils (code et création)

Je pense que cela répond à 80% du besoin exprimé : il manque seulement un petit quelque chose pour un rendu en mode création avec les .css. (A ce propos, saviez-vous que la RC2 est livrée avec 74 fichiers .css !!! Moi qui attache de l'importance à la présentation, j'ai pas fini de chercher icon_wink

Il n'y a pas de raison que mon petit investissement ne soit pas partagé (pour ceux que cela intéresse).

Ces 4 extensions Dreamweaver pour Postnuke .8 sont disponibles ici. Mais je n'assurerais aucun support.

Laurent
Données personnelles

Post 
Ton url est morte ??

Ce projet est vraiment intéressant !!!

Si d'autres personnes sont intéressées pour le faire évoluer, serais-tu d'accord ?

A+


Gilles  ><>°
Données personnelles Accueil

Post 
Bravo laurenth,

Tu es l'auteur de ses 4 extensions ?

Je vais les tester !
Données personnelles Accueil

Post 
à makeu : ben oui.

Je me suis inspiré de choses qui avait été faite pour du smarty {} ...

Ce n'est pas trop dur (fô lire la doc) mais cela demande du temps (quelques jours).

A gilles : tout à fait ouvert à une reprise (je peux refiler les sources : des bêtes xml) [nota : sauf pb hébergement, l'url fonctionne ...]


laurent
Données personnelles
Post 
J'ajoute à cela que j'ai préféré packager 4 extensions à une seule parce qu'à la lecture des réponses qui m'avaient été faites, il semble que certains n'utiliseront que le CodeColoring (dans l'éditeur de code), alors que d'autres préféreront le "render" (mode création).

Question aux connaisseurs de Dw : est-il utile d'ajouter une famille pnRender à la "bibliothèque de balises" (extension TagLibraries) ? Moi, je n'utilise jamais cette bibliothèque de balise parce que je n'ai pas saisi son utilité.

J'utilise depuis une semaine ces 4 extensions pour une implémentation pn8 : thème et pntemplates\*.htm pour commencer. Pour le moment, je trouve cela très pratique. Les pntemplates\*.htm sont beaucoup plus compréhensibles donc adaptables (personnalisables ... dans les dossiers qui vont bien dans MonThemeAMoi).

Have fun with these extensions icon_smile

laurent
Données personnelles