Article Technique
Artisteer et le Flash
Flash dans l’en-tête de la template
Vous pouvez ajouter du Flash dans votre template Artisteer.
Dans Artisteer il vous faut cliquer sur l’onglet En-tête, puis l’icône Flash (qui déroule alors un menu). Vous pouvez sélectionner l’un des fichiers pré-définis de la galerie ou insérer votre propre fichier .swf (option Depuis fichier…).
Lorsque vous choisissez d’insérer votre propre fichier, une boîte de dialogue s’affiche vous permettant d’insérer votre fichier Flash. Le fichier Flash étant inséré (ou sélectionné parmi ceux disponibles en standard dans Artisteer), l’option Position devient active. Vous pouvez alors :
-
Aligner votre vidéo
-
Redimensionner :
- Redimensionner la zone de l’En-tête en fonction de la taille de votre vidéo Flash
- Redimensionner la zone de la vidéo Flash en fonction de la zone de l’En-tête
- Utiliser la taille originale de la vidéo Flash
- Redimensionner manuellement avec l’ascenseur à droite de la boîte
Lorsque vous activez l’en-tête Flash, il vous faut garder à l’esprit les points suivants :
1. Afin de lire votre film Flash, un lecteur Flash doit être installé pour votre navigateur. De la même manière, les visiteurs de votre site web devront avoir un lecteur Flash installé dans leur navigateur.
2. Vous ne pouvez pas insérer des fichiers .xml dans l’en-tête. Seuls les films .swf sont supportés.
3. Actuellement seule la fonctionnalité Flash d’arrière-plan est implémentée. Dans le cas où vous choisissez de redimensionner l’en-tête à la taille de la vidéo Flash, ou de redimmensionner la vidéo Flash à la taille de votre en-tête, le film Flash est redimensionné de sorte à remplir intégralement la zone de l’en-tête dans Artisteer 3 ou la zone de l’en-tête excepté pour le Bloc de Texte dans Artisteer 2.
4. Il existe plusieurs options pour ajuster les paramètres Flash disponibles dans la boîte de dialogue des options avancées Flash (Onglet En-tête – Section Flash – Options Flash…). Si vous voulez que ces options paramétrées pour les films Flash intégrés à Artisteer fonctionnent avec vos propres fichiers Flash, vous devez avoir les paramètres suivants dans votre fichier Flash :
- color1 (valeur hexadécimal)
- alpha1 (transparence entre 0.01 et 1)
- framerate1 (cadres par seconde, valeur par défaut = 30)
- loop (vrai/faux)
- wmode (fenêtre, opaque, transparent)
Remarque : Les informations sur les paramètres sont principalement destinées aux développeurs Flash. Ce n’est pas à l’utilisateur de procéder à des modifications des fichiers flash à sa disposition.
Options Flash avancées
Les options avancées aident à gérer le mode de lecture, l’affichage, la vitesse, et la qualité des vidéos Flash. Vous pouvez également utiliser des paramètres personnalisés pour modifier la vidéo Flash. Certaines options peuvent être désactivées.
- Jeu automatique : Sélectionnez Oui pour que l’image soit jouée automatiquement, et Non pour activer un autre mode de lecture.
- Répéter : Sélectionnez Oui pour que le Flash soit joué en boucle, et Non pour ne le jouer qu’une seule fois.
- Mode : Choix entre le mode Transparent, Opaque ou Fenêtre.
- En mode Transparent, l’arrière-plan de la page HTML s’affiche au travers de toutes les parties transparentes du film. Cette option peut réduire les performances de l’animation.
- En mode Opaque, le film cache tout ce qui est derrière sur la page.
- En mode Fenêtre, le film est joué dans sa propre fenêtre rectangulaire sur une page web.
- Transparence : Précisez la transparence du film Flash, soit une valeur comprise 0 et 100%.
- Qualité : Sélectionnez le type de qualité à savoir Optimisé, Elevé, Moyen ou Faible.
- Paramètres : Indiquez les paramètres personnalisés pour modifier la manière dont le fichier Flash est lu.
Flash dans le contenu du site
Après avoir exporté votre conception (template) depuis Artisteer, vous pouvez intégrer des films Flash dans vos pages. Vous trouverez sur internet de nombreux tutoriaux à cet effet. Mais voici toutefois une astuce qui pourra s’avérer utile pour de nombreux utilisateurs du logiciel Artisteer.
Si vous avez un menu déroulant sur votre site, vous pouvez rencontrer un problème avec des sous-menus cachés derrière votre vidéo flash… Dans ce cas, il vous faut ajuster les paramètres du fichier Flash intégré. Voici comment procéder :
- Ajoutez les paramètres suivants à la balise OBJECT :
<param name= »wmode » value= »transparent » />
<param name= »background » value= »transparent » />
<param name= »windowless » value= »true » /> - Ajoutez ce paramètre à la balise EMBED :
wmode= »transparent »
Les Positions Joomla
Sous Joomla, chaque template dispose d’un certain nombre de positions dans lesquelles sont placés les différents modules.
A partir de la version 3.1 de Artisteer vous pouvez choisir l’une de ces options de nommage de positions pour Joomla 1.6-1.7 :
- « position-1, position-2… » pour le nouveau nommage de positions Joomla 1.6-1.7 comme dans la template par défaut Beez2
- « left, right, top, bottom » pour le nommage de positions à la manière Joomla 1.5 (pour des raisons de compatibilité)
Dans le cadre de la mise à jour d’un site web existant depuis Joomla 1.5 vers Joomla 1.6-1.7 il faut sélectionner le type de nommage « left, right, top, bottom » qui sera compatible avec la dernière version de Joomla et qui évitera d’avoir à réajuster les blocs.
Tutoriel : Installer des Templates Joomla
Ce tutoriel vous explique comment installer de nouvelles templates Joomla.
Depuis la version 1.6 de Joomla, les templates ne peuvent plus être installés par ftp.
Il faut au préalable exporter la template Joomla dans Artisteer en tant qu’archive .zip et la charger par l’interface d’administration de Joomla.
Exporter la Template
1. Lancez Artisteer et ouvrez votre projet .artx (format spécifique à Artisteer).
2. Sélectionnez le menu Fichier -> Exporter -> Modèle Joomla.
Dans la boîte de dialogue (Exporter) qui s’affiche précisez la bonne version de Joomla, 1.5 ou 1.6-1.7, ainsi que les bonnes positions pour Joomla 1.6-1.7.
3. Cliquez sur le bouton Exporter.
Installer la Template
Pour installer une template Joomla exportée en tant qu’archive .zip, connectez-vous à votre interface d’administration Joomla et procédez comme suit :
1. Sélectionnez le menu Extensions puis le sous-menu Installer/Désinstaller.
2. Sur l’écran Gestion des extensions : Installer choisissez la première option : Archive à transférer.
3. Cliquez sur le bouton Parcourir et sélectionnez votre fichier (template) .zip sur votre ordinateur.
4. Cliquez enfin sur le bouton Transfert de Fichier & Installation pour installer la template.
Remarque importante
Si une template portant un même nom existe déjà, il faut renommer ou supprimer la template existante avant d’installer une nouvelle template ayant le même nom.
La template étant installée, il convient de l’activer :
1. Dans le menu Extensions sélectionnez le sous-menu Gestion des templates. Cet écran vous permet de gérer les templates site et administrateur.
2. Sur l’écran Gestion des templates : site cochez votre template.
3. Appuyez sur le bouton Défaut pour l’activer en tant que template par défaut.
Remarque sur la localisation des templates sur le serveur
Toutes les templates sont installées dans un répertoire templates. Il y a deux répertoires templates :
- « [chemin-Joomla]/templates/matemplate » pour les templates du site
- « [chemin-Joomla]/administrator/templates/matemplateadmin » pour les templates de la section administration
Tutoriel : Personnaliser le Pied de Page de la template pour WordPress
Ce tutoriel vous explique comment personnaliser le pied de page d’une template Artisteer pour WordPress.
Personnalisation du Pied de Page d’une Template Artisteer 2
Pour personnaliser le pied de page de la template Artisteer 2, il vous faut aller dans l’administration de WordPress 2.6+ :
Apparence -> Pied de Page
afin d’éditer le code HTML
Par exemple :
<a href= »http://www.monsite.com/monsite/contact/ »>Contact</a> | <a href= »http://www.monsite.com/monsite/mentions-legales/ »>Mentions Légales</a> | <br />2011 © monsite.com.
Ce code affiche :
- un hyperlien Contact qui renvoie à la page Contact
- un hyperlien Mentions Légales qui renvoie à la page Mentions Légales
- 2011 © monsite.com
Remarque : Le contenu du pied de page sera placé dans le conteneur Paragraphe (<p>).
Personnalisation du Pied de Page d’une Template Artisteer 3
A partir de la version 3 du logiciel Artisteer, le pied-de-page peut être personnalisé directement dans Artisteer.
Cliquez sur l’onglet Pied de page puis le lien Texte.
Une fenêtre « Editeur HTML » s’affiche avec ce contenu :
<p><a href= »# »>Link1</a> | <a href= »# »>Link2</a> | <a href= »# »>Link3</a></p><p>Copyright © %YEAR%. All Rights Reserved.</p>
Il vous suffit d’éditer ce code.
Tutoriel : Installer des thèmes WordPress
Ce tutoriel vous explique comment installer des nouveaux thèmes WordPress.
Installation du Thème WordPress en tant que Dossier
1 - Accédez à votre serveur web en utilisant un client FTP ou des outils d’administration de serveur web
2 - Dans le répertoire d’installation WordPress, naviguez jusqu’au répertoire themes dans lequel se trouvent les thèmes disponibles, à savoir : ../wp-content/themes
3 - Copiez ou uploadez dans ce répertoire le dossier de votre template réalisée avec Artisteer et exportée via Artisteer que nous appellerons MaTemplate
Ce qui nous donne <WordPressFolder>\wp-content\themes\<MaTemplate>
4 - Connectez-vous à votre console d’administration WordPress et cliquez sur le menu Apparence puis Thèmes
Sélectionnez le thème que vous venez d’installer (MaTemplate) dans la liste des thèmes disponibles et cliquez sur le bouton Activer. Votre thème MaTemplate est désormais en ligne.
Installation du Thème WordPress en tant qu’Archive .zip
Il est à noter qu’avec WordPress version 2.8, 2.9 ou 3.0, il existe un autre moyen d’installer des thèmes. Vous pouvez installer un thème au format .zip à partir de son chemin.
1 - Exportez votre thème WordPress en tant qu’archive .zip
2 - Connectez-vous à votre console d’administration WordPress et
- avec WordPress 2.8/2.9 : allez sur l’écran Installer des thèmes - Envoyer accessible via le menu Apparence -> Ajouter de nouveaux thèmes puis cliquez sur le lien Envoyer…
- avec WordPress 3.0 : cliquez sur Apparence puis Thèmes. L’écran Thèmes se présente avec deux onglets : Gérer les thèmes – Installer des thèmes. Cliquez sur Installer des thèmes puis le lien Envoyer
3 - Cliquez sur le bouton Parcourir… pour sélectionner votre fichier .zip sur votre disque en local
4 - Cliquez sur le bouton Installer maintenant pour installer le thème
Comment personnaliser le pied de page de la template Joomla ?
Personnaliser le Pied de Page
Pour personnaliser le pied de page de la template via l’administration Joomla, placez un ou plusieurs modules dans la position copyright. Cela aura pour effet de remplacer le texte de copyright par défaut inclus dans le pied de page de la template Joomla par le nouveau contenu fourni par le module.
Voici comment procéder :
1. Allez dans l’administration de Joomla -> Extensions -> Gestion de Module
2. Cliquez sur Nouveau, puis sélectionnez HTML Personnalisé, puis cliquez sur Suivant
3. Dans les propriétés du module renseignez ainsi les champs :
Titre – Montrer le titre : Non
Position : copyright
Personnaliser l’affichage : renseignez le contenu du pied de page souhaité
4. Enregistrez vos changements
Vous pouvez maintenant utiliser ce nouveau module créé pour la personnalisation du pied de page sans avoir à utiliser de modules supplémentaires.
Comment appliquer un style de menu Artisteer à un menu Joomla ?
Appliquer un Style de Menu Artisteer à un Menu Joomla
Une des questions récurrentes est la suivante : Comment appliquer un style de menu conçu avec Artisteer sur votre menu Joomla ?
Voici donc comment procéder.
Pour utiliser un style de menu conçu avec Artisteer avec Joomla :
- Allez dans l’administration de Joomla -> Extensions -> Gestion de Module
- Ouvrez un menu existant ou créez un nouveau menu que vous placerez en position user3
La position user3 peut uniquement contenir un seul menu ou aucun.
Les Positions Joomla
A Propos de Joomla
Pour rappel…
- Joomla 1.6 est supporté à partir de la version 2.6 du logiciel Artisteer.
- Les versions 2.6 et 3.0 du logiciel Artisteer nécessitent de disposer de PHP version 5.x pour Joomla ; c’est un pré-requis.
- Vous pouvez utiliser Joomla 1.5 avec les versions 2.6 et 3.0 du logiciel Artisteer.
- Depuis la version 1.6 de Joomla, les templates ne peuvent plus être installées via ftp. Vous devez exporter votre template Joomla dans Artisteer en tant qu’archive .zip et la charger par l’interface d’administration de Joomla.
Comment créer un menu vertical avec Artisteer et Joomla ?
Les Menus Verticaux avec Joomla
Une des questions qui revient en permanence est la suivante : Comment faire pour que le style de menu vertical configuré dans Artisteer s’affiche sur un site réalisé en Joomla ?
A partir de la version 2.4 du logiciel Artisteer, vous pouvez utiliser le Suffixe de classe de module art-vmenu pour appliquer le style de menu vertical Artisteer à votre module de menu dans Joomla.
Voici donc comment procéder.
Création du Menu Vertical
Pour cela, il vous faut procéder comme suite :
- Connectez-vous à votre administration Joomla et allez dans le menu Extensions, puis Gestion des modules.
Sélectionnez le module que vous voulez éditer. - Dans les Paramètres du module, renseignez le champ Suffixe de classe de module avec la valeur suivante : art-vmenu
- Si vous créez un menu vertical qui s’ouvre sur un clic souris, veillez à désactiver la mise en cache.
REMARQUE : Si vous voulez remplacer le préfixe par défaut dans Artisteer à savoir art-vmenu (menu Fichier -> Exporter -> Options CSS -> Préfixe CSS) par un préfixe personnalisé, vous devez impérativement ajouter le préfixe CSS personnalisé dans le champ Suffixe de classe de module de Joomla.
Création d’un Menu Vertical avec des sous-éléments
Pour créer un menu vertical avec des sous-éléments, voici comment procéder :
- Activez les multi-niveaux dans Artisteer : Onglet Menu Vertical - Sous-éléments - Niveaux. Assurez-vous que le Sous-élément Vertical fonctionne au sein de la template prévisualisée dans Artisteer.
- Créez un menu avec des éléments de sous-menu dans Joomla. Les éléments de sous-menu doivent chacun avoir des éléments parent spécifiés.
- Activez les niveaux multiples dans votre module menu (Style de menu - « Affichage des sous-menus - Vertical »).
- Utilisez le Suffixe de classe de module : art-vmenu pour appliquer le style de menu vertical aux modules menu souhaité.
REMARQUE : Les sous-éléments n’apparaissent pas lors du passage de la souris, mais seulement lorsque vous cliquez sur l’élément parent (excepté pour les menus ouverts où tous les sous-éléments sont visibles).
Blog Artisteer
Le blog artisteer-france reprend du service… Vous y trouverez régulièrement de nouvelles astuces…



Chargement