Project:Omega.org

Par Dave Sag, 02/04/2002

Traduit par Sylvain, 25/11/2002

Dans son article récent paru sur O’Reilly à propos des filtres d’exportation de iPhoto, Derrick Story a fait référence au filtre BetterHTMLExport décrit par Simeon Leifer.

BetterHTMLExport, qui en est à la version 1.3 au moment ou j’écris cet article (NdT: et au moment où je traduis, il en est à la version 1.6.3), offre des améliorations notables par rapport au filtre d’exportation fourni par défaut. Et cela inclu pour vous la possibilité de créer vos propres gabarits.

Dans cet article, je vais vous guider tout au long de la procédure de création de votre ensemble de gabarits. Je suppose que vous connaissez un minimum de HTML et que vous avez suivi les instructions pour installer BetterHTMLExport.iPhotoExporter en copiant l’intégralité du dossier « BetterHTMLExport.iPhotoExporter » dans le dossier « iPhoto/Contents/Plugins ». (Pour ouvrir un paquetage faire Contrôle+Clic sur l’icône de iPhoto et sélectionnez « Afficher le contenu du progiciel » ).

Premièrement, si vous ne l’avez pas déjà fait, sélectionnez quelques images dans iPhoto, cliquez sur « Partager », puis « Exporter ». Si vous avez correctement installé BetterHTMLExport vous verrez son onglet dans le haut du dialogue de partage, comme cela est visible ci-contre.

Le gabarit fourni en standard par BetterHTMLExport n’est pas mauvais, mais il n’est certainement pas exceptionnel. La comparaison qui suit montre les différences entre le gabarit standard et celui que j’ai créé. Le code HTML de mon nouveau gabarit intègre également une description appropriée et les mots-clés.

Les copies d’écran suivantes mettent en exergue les différences entre le modèle standard et celui, plus détaillé et plus attractif, que nous ferons. Vous pouvez cliquer sur l’une ou l’autre des images pour consulter en détail les deux résultats. Les liens s’ouvrent dans de nouvelles fenêtres (NdT: les liens pointent sur les pages générées par l’auteur sur le site O’Reilly).

Image du résultat par défaut.	Image du résultat avec mon nouveau gabarit

Pour tout ce qui sort du cadre du plus évident des exemples, vous allez souhaiter créer vos propres gabarits.

Vous allez devoir créer le dossier suivant (NdT le caractère « ~ » représente vos dossier « Départ ») :

~/Bibliothèque/BetterHTMLExport/templates

Utilisez le Contrôle-Clic sur iPhoto pour afficher le contenu du paquetage et copiez le contenu du dossier de gabarits dans le dossier que vous venez juste de créer. Renommez les fichiers comme suit :

Maintenant, si vous avez installé les outils de développement d’OS X vous avez l’éditeur de PropertyList écrit par Apple. Ce n’est rien de plus qu’un éditeur XML pour modifier des listes de propriétés. Si vous n’avez pas l’éditeur de PropertyList vous pouvez utiliser n’importe quel éditeur de texte pour modifier vos listes de propriétés.

Utilisez l’éditeur de PropertyList pour éditer vos fichiers plists.	Ou vous pouvez utiliser un éditeur de texte.

La première chose que vous voudrez faire est de modifier le fichier my.plist. Les propriétés que vous devez changer sont image_template_name, index_template_name,template_description et template_name. L’élément template_name définit le nom qui sera affiché dans le menu pop-up des gabarits dans iPhoto. L’élément template_description peut contenir ce que vous voulez, et les noms de fichiers doivent correspondre aux noms des fichiers que vous venez de créer. En supposant que tout fonctionne correctement, votre plist devrait ressembler à celle de l’image ci-dessus.

Si ce n’est pas le cas, ne paniquez pas. J’ai zippé ce gabarit d’exemple et il est disponible à http://www.davesag.com/BHTMLXtemplate.zip. Allez le récupérer.

Une petite remarque à propos de l’élément « default » dans la plist. C’est une fonctionnalité non documentée, mais relativement évidente. Si l”élément « default » est présent, et qu’il vaut « 1 », alors BetterHTMLExport en fait votre gabarit par défault. Si plus d’un gabarit contient ce marqueur alors BetterHTMLExport prendra le premier qu’il trouve comme gabarit par défaut. Quand vous serez satisfait de votre nouveau gabarit, je vous suggère d’en faire votre gabarit par défaut et de supprimer l’élément « default » des autres.

Sortez de iPhoto et relancez le. Sélectionnez un ensemble de photos et choisissez « Partage ». Dans l’onglet de BetterHTMLExport cliquez sur le boutton « Advanced options ». Si tout fonctionne correctement vous devriez voir votre nouveau gabarit apparraître dans le menu pop-up templates. Nous pouvons maintenant passer à l’édition proprement dite des gabarits.

BetterHTMLExport fournit un ensemble de balises spéciales encadrées par des crochets « [...] ». Toute personne habituée des langages à balise n’aura aucun problème à les déchiffrer. Le langage de balise comprend les commandes suivantes. Notez que ces balises sont décrites plus largement dans la documentation qui accompagne BetterHTMLExport.

Une étude attentive du code des gabarits que vous avez dans myindex.template et myimage.template est tout ce dont vous avez besoin pour voir des exemples de ce langage en pleine action. À titre d’exemple, je vais mettre en lumière un changement notable dans myimage.template.

La ligne 21 du gabarit d’origine, dans notre cas le fichier courant, on trouve les lignes affichées ci-dessous. Le changement de code à effectuer est affiché en gras.

[if directnavif showDirectNavigation == YES]
<td>
<table border="0" cellspacing="2">
[each navrowseach directRows directTable]
<tr>
[each navcolseach directColumn directRows]
[if curimgpgif directColumn.imagePageNumber == currentImagePageNumber]
<td>
<b>
[directColumn.imagePageNumber]
</b>
</td>
[else curimgpgif]
<td>
<a href="[directColumn.imagePageName]">
[directColumn.imagePageNumber]
</a>
</td>
[endif curimgpgif]
[endeach navcolseach]
</tr>
[endeach navrowseach]
</table>
</td>

[else directnavif]
<td align="center"><a href="../[indexFileName]#[imagePageName]">
[if showimgtitleif showImageTitles == YES]
<h2>[imageTitle]</h2>
[else showimgtitleif]
<font size="-2">index</font>
[endif showimgtitleif]
</a></td>	

[endif directnavif]

Ici l’objectif est que si l’utilisateur a choisi de ne pas afficher les liens de navigation, comme il peut le faire via une case à cocher de l’IHM de BetterHTMLExport, alors nous devrions afficher le titre entre les deux boutons de navigation, avec un lien de retour sur la page d’index. Bien sûr, si nous n’affichons pas le titre, nous devons seulement afficher le mot « index ».

En dessous de la photo nous voulons ajouter un code très similaire. Si l’utilisateur a coché « show title » mais n’a pas coché « direct to page navigation » nous afficherons simplement le mot « index » à la place du titre de la photo. C’est plus joli que voir le titre de l’image apparaître à la fois en début et en pied de page.

Les autres modifications sont esthétiques et concernent le positionnement de l’image dans une table ainsi qu’à un positionnement propre du texte de dessous.

Le nouveau gabarit insère également la description et les mots clés en méta-tag dans la section d’en-tête de la page.

BetterHTMLExport 1.3 est fourni avec un gabarit appellé « Kitchen Sink » qui exporte toutes les données qui sont à sa disposition. Étudiez ces gabarits et la documentation fournie par Simeon, vous y trouverez une profusion de renseignements pertinents.

Textes originaux en anglais sur O’Reilly : Better Templates for iPhoto’s BetterHTMLExport par Dave Sag.

quentin Les iApplications de Mac OS X iPhoto, Mac OS X