Généralités

Evaluez vos connaissances Artisteer 4

Connaissez-vous bien Artisteer 4 ?

Ce quiz sur Artisteer 4 vous permet de tester vos connaissances et également de réviser les fondamentaux.

Ce petit module a été réalisé avec la solution auteur iSpring Suite 8.

quiz Artisteer 4

Si vous n’avez pas réussi ce quiz, replongez-vous dans les ressources Artisteer. Il est essentiel de bien comprendre les concepts de base d’Artisteer.

Vous pensez avoir besoin de suivre une formation à Artisteer ? Nous proposons désormais un programme de formation à Artisteer 4 avec deux formules : la formule traditionnelle en présentiel (formation intra-entreprise) et la formule e-Learning.

Avec la formule e-Learning, vous suivez le programme de formation à Artisteer 4 de manière autonome. Vous vous formez où vous voulez et quand vous voulez. Les modules e-Learning sont accessibles depuis un ordinateur, un tablette ou un smartphone, 24 heures sur 24, et 7 jours sur 7.

Caractéristiques Clefs de Themler

L’intérêt pour Themler est grandissant, et nous continuons à recevoir beaucoup de questions. Il est donc essentiel de vous apporter des précisions sur Themler, ce que nous allons encore faire aujourd’hui.

Il est important de souligner que pour utiliser Themler vous devez être connecté à internet et à votre compte Themler. La licence Themler étant liée à un compte utilisateur donné, vous pouvez installer la licence sur deux machines, et l’utiliser de n’importe quelle machine dès lors que vous êtes connecté à votre compte utilisateur Themler.

Themler en 8 Points

1. Création de Thèmes et de Templates pour HTML, les CMS et les Plates-formes E-Commerce

Avec Themler, vous créez des thèmes modernes et uniques pour les CMS et les plates-formes e-commerce les plus répandus du marché (WordPress, Joomla, Drupal, VirtueMart pour Joomla, WooCommerce pour WordPress, Magento et PrestaShop).

2. Fonctionnement sur n’importe quelle Plate-Forme

Themler peut être installé dans votre CMS sur votre système d’hébergement web et utilisé avec les navigateurs Chrome et FireFox sur Windows, Mac et Linux. Vous devez télécharger Themler for CMS.

Vous noterez que Themler requiert 64 Mo de mémoire PHP.

Themler peut aussi s’exécuter comme une application bureau sur Windows… et prochainement sur Mac. Vous devez télécharger Themler Desktop.

3. Création du Nec plus ultra des Thèmes avec les Outils de Themler

Themler inclut d’excellents outils pour créer des thèmes modernes sophistiqués avec des fonctionnalités évoluées (animations, transitions, contrôles riches et extensions). Pour la conception de contenu à fort impact, Themler fournit des shortcodes personnalisables et une bibliothèque intégrée d’icônes vectoriels.

Un shortcode est une balise de texte dans un format spécial, que l’on place dans une page ou un article, et que le CMS interprète automatiquement. Les shortcodes permettent d’ajouter des fonctionnalités sans programmation. Les shortcodes Themler sont uniquement supportés dans les thèmes WordPress et Joomla.

Liste des shortcodes Themler :

  • Bouton (Button)
  • Boîte (Box)
  • Groupe de Texte (Text Group)
  • Icône (Icon)
  • Colonne (Column)
  • Curseur (Slider)
  • Vidéo
  • Google Map

Shortcode Themler Google Map

Regardez dès maintenant la vidéo sur l’utilisation des shortcodes dans Themler.

4. Mise en Forme Personnalisée avec le Glisser-Déposer

Themler propose une interface intuitive de type Glisser-Déposer. Vous êtes libre de sélectionner n’importe lequel des très nombreux contrôles disponibles, des widgets et des sidebars, et de les positionner où bon vous semble.

Vous pouvez créer un nombre illimité de positions de widgets et de colonnes qui peuvent être placés partout et n’importe où.

Vous contrôlez la largeur du site, de la zone de contenu et des sidebars.

Themler utilise la grille de Bootstrap* à 24 colonnes pour les Mises en forme Boxed et Wide.

5. Meilleure Adaptation basée sur Bootstrap3/HTML5

Les thèmes entièrement adaptatifs ont un rendu incroyable sur n’importe quelle taille d’écran. Vous pouvez personnaliser l’apparence de chaque aspect du thème pour chaque mode adaptatif (PC de bureau, PC portable, Tablette et Téléphone).

6. Edition en Live

Vous visualisez vos données et votre contenu CMS tout en créant vos thèmes dans Themler.

7. Thèmes Multi-Templates

Vous pouvez créer un nombre illimité de templates de page pour les pages, les articles, les pages produits de la boutique en ligne, et plus. Vous personnalisez la mise en forme de chaque template de page séparément.

Les contrôles peuvent être partagés entre les templates et personnalisés à votre guise.

8. Import de Projets depuis Artisteer

Les projets Artisteer peuvent être importés dans Themler dès lors qu’ils ont été exportés en tant que Template Themler dans Artisteer 4.3.

 

*Bootstrap est un framework HTML, CSS et JS pour développer des projets mobiles et adaptatifs pour le web.

Insertion d’Images dans Artisteer

Un Template créé avec Artisteer comprend deux parties :

  • Le Design, qui spécifie la forme, à savoir l’apparence des pages web (la manière dont le contenu est présenté)
  • Le Contenu, qui spécifie le fond, à savoir le contenu de la page web (textes, images, liens, etc.)

A partir de la version 4.0 d’Artisteer, il est possible de créer des templates avec du Contenu, et de les importer dans le CMS. La création de Contenu dans Artisteer est facultative.

Optimisation des Images

Lorsque vous insérez des images dans votre projet Artisteer, vous veillerez à toujours les optimiser/compresser au préalable, Artisteer n’étant pas un programme d’édition d’images.

Insertion d’Images dans le Contenu

Lorsque vous insérez des images dans le Contenu (onglet Editer > groupe Insérer > Image), vous veillerez (si possible) à les ajouter en utilisant l’option Depuis une URL

insertion d'images dans le contenu du template Artisteer

Cela permet de réduire la taille du projet Artisteer, et ce surtout lorsque vous avez beaucoup d’images. Mais cela implique que vous hébergiez (uploadiez) au préalable vos images sur un serveur web, puisque dans ce cas vous devez renseigner l’URL de l’image (adresse web de l’image) : http://

Un Upload (téléchargement d’un fichier depuis un poste local vers un serveur web) est le contraire de Download (téléchargement d’un fichier depuis un serveur web vers un poste local). Pour « uploader » un fichier, on utilise généralement un client ftp (logiciel permettant d’envoyer le fichier sur le serveur web). FileZilla est un client FTP gratuit.

Insertion d’Images dans l’En-têteinsertion d'images dans l'en-tête du template Artisteer

L’En-tête est un élément du Design. C’est un élément de type conteneur qui contient plusieurs éléments : le logo de la société, un slogan, une image, etc.

Lorsque vous insérez des images dans l’En-tête (onglet En-tête > groupe Insérer > Image), vous pouvez insérer des images disponibles dans la galerie Artisteer, ou des images stockées sur votre ordinateur (option Depuis fichier…).

Mais vous ne pouvez pas renseigner l’URL d’une image.

Vous pouvez également insérer des images dans l’En-tête en utilisant le contrôle ImageLink (onglet En-tête > groupe Insérer > Contrôles > ImageLink). Cette option vous permet de paramétrer un lien cliquable sur l’image, et aussi de définir la visibilité de l’image, à savoir sur quel(s) type(s) d’écran elle doit s’afficher (utile pour le Responsive Design).

Remarques

1. Artisteer ne conserve pas les fichiers images originaux dans le fichier projet .artx, mais uniquement les fichiers redimensionnés.

2. Le projet Artisteer est enregistré dans un format binaire natif propre à Artisteer. Le fichier .artx contient tous les composants du Design du projet et le Contenu.

Découvrez la Newsletter de Kapitec Software

Il y a cinq ans, Kapitec Software devenait le distributeur français du logiciel Artisteer. Un an plus tard, nous mettions en ligne le site artisteer-france.fr dédié à Artisteer.

L’objectif était de vous offrir sur un même site toute une série d’informations et de ressources utiles sur Artisteer, et ce en langue française.

Mais saviez-vous que Kapitec Software distribue d’autres marques ?

Nous vous proposons de découvrir sur notre site corporate toute notre offre logicielle :

Connaissez-vous la newsletter de Kapitec Software ?

En vous inscrivant à la newsletter sur le site kapitec.com, vous serez informé(e) des nouveautés de l’offre logicielle commercialisée par Kapitec Software, et des nouveaux articles et tutoriels disponibles. La newsletter reste le moyen le plus efficace pour vous tenir informé(e) de l’actualité et vous offrir du contenu technique, susceptible de vous intéresser dans le cadre de votre activité.

Nous vous invitons à lire l’un de nos derniers articles publiés, qui propose une présentation détaillée de Adobe® Presenter version 9, logiciel qui permet de créer du contenu interactif à partir de présentations Microsoft PowerPoint. Un article sur Adobe® Captivate® 7 (composé de deux parties) vous sera proposé prochainement.

 

Disponibilité de la Version 4.2 Officielle d’Artisteer pour Windows

La Version 4.2 du logiciel Artisteer pour Windows est officiellement disponible.

Nouveautés d’Artisteer 4.2

  • Support des thèmes Tumblr
    • L’export des thèmes Tumblr est disponible dans les éditions Standard et Personnel.
  • Aperçu des modes de conception « responsive » – Personnalisation du template « responsive »
    • Pour accéder à la Vue Responsive, cliquez sur l’option Responsive View qui se trouve dans l’angle supérieur droit de la fenêtre Artisteer :

Artisteer 4.2 Vue responsive

    • Le mode « Responsive par défaut » génère le template en fonction de règles codées en dur. Par exemple, les images et les formes sont placées dans des positions spécifiques.
    • Ce mode permet de visualiser le rendu du template sur différents supports : PC de bureau, tablette au format portrait ou paysage, et téléphone au format portrait ou paysage.
    • Le mode « responsive personnalisé » permet d’éditer le template responsive : il est alors possible de déplacer les objets dans l’En-tête (formes, images, etc.) par glisser-déposer.
  • Feuille
    • Il est désormais possible de spécifier une texture ou une image d’arrière-plan pour la Feuille.
  • En-tête/Curseur
    • Le contrôle ImageLink permet d’insérer une image qui apparaît sur l’En-tête, et de paramétrer un lien. Cela peut être utile pour ajouter un logo sur un Diaporama dans l’En-tête, par exemple. Il est possible d’ajouter plusieurs contrôles ImageLink. De plus, leur visibilité (affichage ou non) peut être spécifiée selon le support sur lequel le site web est affiché. Pour ajouter un contrôle ImageLink, sélectionnez Contrôles > ImageLink dans l’onglet En-tête du ruban.
    • L’élément Curseur (Slider) est un nouvel élément de la mise en forme dans lequel vous pouvez ajouter un Diaporama. Sa hauteur est paramétrable.

Artisteer 4.2 Onglet Curseur

    • Chaque diapositive (slide) du Diaporama est cliquable. Cela est particulièrement intéressant pour faire des montages de bannières.
  • Edition de Contenu
    • Il est désormais possible de dupliquer des pages avec la mise en forme et avec les sous-pages associées.
  • HTML personnalisé dans la section <HEAD>
    • Cela est par exemple utile pour ajouter le code Google Analytics.
  • Support du dernier JQuery
    • Cela améliore la compatibilité des templates avec les derniers modules Joomla et widgets WordPress.
  • Amélioration du support pour WordPress et Joomla (versions Joomla jusqu’à la version 3.1).

Correctifs

Correctifs apportées entre Artisteer 4.2 RC et la version 4.2 officielle (build 60623) :

  • Templates Blogger : problème au niveau du titre et du slogan
  • Diaporama : transparence de la bordure d’image
  • Panneau du Diaporama : plantage
  • Forme visible en Mode Responsive
  • Widget jQuery UI Slider
  • Mode Responsive : bordure de cellule
  • Aperçu dans le Navigateur : absence d’Opera 17
  • Remplissage des messages système Joomla, etc.

La version 4.2 est uniquement disponible pour Windows. Aucune information concernant la plate-forme Mac n’est disponible à ce jour.

Pour rappel : La documentation utilisateur d’Artisteer est uniquement disponible en anglais. Vous disposez toutefois d’un grand nombre de ressources en français sur ce site. Des mises à jour des ressources ont dernièrement été effectuées.

Note Importante

A partir de la version 4.2, Artisteer requiert de disposer d’une connexion internet lors de l’export des templates Joomla, WordPress et Drupal.

Il est également à noter que le template exporté peut être automatiquement mis à jour lors de l’export, aussi l’éditeur n’aura pas toujours besoin de publier des nouvelles versions Artisteer pour procéder à de petites améliorations ou corriger certains bogues.

Les clients, qui pour des raisons de sécurité interne à leur organisation, ne peuvent être connectés à internet, devront donc continuer à utiliser Artisteer 4.1.

Mettre à jour sa Licence Artisteer

Vous pouvez télécharger Artisteer version 4.2 build 60623 à partir du lien de téléchargement qui vous a été fourni au moment de votre achat, ou en passant par le formulaire d’évaluation.

Important – Si le service de mise à jour de votre licence a expiré, cette version fonctionnera en mode EVALUATION. Vous pouvez à tout moment renouveler votre service de mise à jour Artisteer pour continuer à bénéficier des nouvelles versions.

Vous devez alors acheter un Service de Mise à Jour :

  • référence SMJ1A-ART-SE-SUPL pour l’édition Standard
  • référence SMJ1A-ART-PE-SUPL pour l’édition Personnel

Support

Nous rappelons que Kapitec Software est le distributeur du logiciel Artisteer en France et que nous ne sommes pas une filiale de l’éditeur.

En conséquence, nous assurons uniquement le support pour les licences Artisteer qui ont été achetées et/ou dont le service de mise à jour a été renouvelé via Kapitec Software ou l’un de nos revendeurs français. Pour les clients ayant acheté par un autre biais, et qui ont besoin de faire appel au support, ils doivent contacter le support de leur revendeur. Merci pour votre compréhension.

Lorsque vous contactez le support, merci de :

  • la version (build) et l’édition du logiciel Artisteer utilisée (Standard ou Personnel)
    • Sélectionnez le menu Fichier > A Propos d’Artisteer
  • le CMS utilisé
  • la Clé de Licence (aussi appelée numéro de série)
  • le détail du problème ou de la question

Formation

Nouveau ! Programme de Formation Artisteer

Le cours Création de Templates et de Sites Web avec Artisteer 4.2 est dispensé en :

  • intra-entreprise (dans les locaux de l’entreprise)
  • en ligne (via un logiciel de partage d’écran et de conférence web)

Pour en savoir plus sur le cours Artisteer…

A Découvrir

Intégration du Code de Web Analytics sur votre Site

Si vous utilisez un outil de Web Analytics (mesure d’audience) pour votre site web, vous devrez intégrer du code spécifique sur votre site pour suivre le trafic.

Selon l’outil utilisé, ce code permettant le suivi des visiteurs est appelé « page tag » ou « pixel ». Ce code est appelé lors du chargement d’une page ; c’est ce qui permet la collecte des données du trafic. Si ce code est mis en fin de page, seules les pages complètement chargées sont alors recensées. Ce code doit être présent sur toutes les pages du site dès lors que vous voulez suivre le trafic sur toutes les pages.

Intégration du Page Tag ou Pixel

Pour éviter d’avoir à marquer individuellement chacune des pages de votre site avec le code dit de « base » ou « standard », il vous faut l’intégrer de sorte à ce qu’il soit automatiquement appelé lors du chargement de la page web.

Vous avez le choix entre deux méthodes.

Méthode 1 – Edition du fichier commun .php

Une fois le template Artisteer exporté, ouvrez le fichier commun .php et ajoutez le code de tracking.

Remarque : Pour savoir quel fichier commun éditer (footer.php – header.php) reportez-vous à la documentation de l’outil que vous utilisez pour connaître les recommandations de l’éditeur, à savoir si le code doit ou non être mis en fin de page.

Méthode 2 – Ajout d’un widget ou module

La seconde méthode consiste à ajouter un widget (ou module), selon le CMS utilisé, de type TEXTE/HTML et d’y renseigner le code de tracking.

Si l’éditeur de votre outil de Web Analytics recommande de le placer en fin de page, vous  positionnerez alors le widget dans une position footer.

Exemple : Vous utilisez WordPress – Le code de tracking doit être mis en fin de page

  • Allez dans le back end WordPress, puis cliquez sur Apparence > Widgets
  • Ajoutez un widget de type Texte dans la position Footer Widget Area
  • Ne renseignez pas le titre du widget pour qu’il ne soit pas visible côté visiteurs
  • Renseignez le code dans la zone principale du widget
  • Sélectionnez l’option Show widget on: All pages (pour que ce widget soit présent sur toutes les pages du site)
  • puis cliquez sur Enregistrer

Vous pourrez vérifier que votre code de tracking est bien présent sur votre page en ouvrant votre navigateur web. Renseignez l’URL de votre site web puis affichez le code source de la page :

  • avec Firefox : utilisez le raccourci clavier Ctrl+U
  • avec Internet Explorer : sélectionnez le menu Affichage > Source

Les Outils de Web Analytics

Il existe de nombreux outils, dont Google Analytics qui est très largement répandu de par sa gratuité. Les outils « commerciaux » (payants) offrent de nombreux avantages.

Kapitec Software recommande Webtrekk en tant que solution d’analyse d’audience. Webtrekk offre une solution de Web Analytics à la fois puissante, flexible et personnalisable. Webtrekk permet d’analyser, d’optimiser et de piloter de manière optimale les sites web.

En savoir plus sur Webtrekk…