Category

Aide et astuces

Personnaliser l'accès au tableau de bord Wordpress

Personnaliser l’accès au tableau de bord WordPress

By | Aide et astuces, côté serveur, Plugin Wordpress, Wordpress 3.6, Wordpress 3.7, Wordpress 3.8, wordpress 3.9, wordpress 4.0, Wordpress 4.1 | One Comment

Pour personnaliser l’accès au tableau de bord WordPress il existe deux méthodes:  le plug’in HC Custom WP-Admin URL et la redirection 301.

 

Je n’apprendrais rien à personne en disant que l’accès au tableau de bord de WordPress se fait en ajoutant /wp-admin à la suite de l’adresse de votre de blog. Tout le monde le sait, même les hackers ! D’où l’intérêt de personnaliser cette dernière. Car si le hacker ne sait pas comment parvenir jusqu’à la page du login, alors sa tentative de piratage de votre blog se compliquera très sérieusement.

L’idée est de trouver un bon compromis entre simplicités pour vos collaborateurs ou clients et complication pour les hackers. Donc choisissez bien le mot de substitution à /wp-admin.

Pour personnaliser sa page de connexion WordPress deux solutions possibles : à l’aide du plug’in HC Custom WP-Admin URL ou bien en éditant le fichier .htaccess situer à la racine du serveur.

Dans tous les cas l’idée est de faire une redirection 301. C’est pourquoi votre serveur Apache doit impérativement avoir le module mod_rewrite d’activer.

 

Le plugin HC Custom WP-Admin URL

C’est sans conteste la méthode la plus simple. Dans Extensions -> Ajouter recherchez HC Custom WP-Admin URL installez-le puis activez-le.

Personnaliser l’accès au tableau de bord WordPress, rendez-vous dans le menu Réglage -> Permaliens.

En bas de la page localisez le champ wp-admin slug, puis ajouter complétez-le avec le mot de votre choix.

Une fois remplacé fait un test avec le nouveau mot puis avec le bon vieux /wp-admin. Il y a de forte chance que cela fonctionne encore avec /wp-admin et /wp-login, car il ne faut pas oublier que WordPress génère un cookies lorsque l’on ouvre une session. Par conséquent, supprimez vos cookies et refait un test.

Pour ceux qui viennent d’activer le module mod_rewrite, modifier les permaliens est un excellant moyen de savoir si cela a été fait correctement.

Le fichier .htaccess

Localisez ou créez un fichier .htaccess à la racine de votre site WordPress puis ajouter la ligne de code suivante :


RewriteRule ^pseudo-text$ http://VOTRE_BLOG.com/wp-admin [NC,L]
RewriteRule ^pseudo-text$ http://VOTRE_BLOG.com/wp-login.php [NC,L]

Pour rappel, le fichier .htaccess permet de passer des instructions à Apaches lorsque l’on n’a pas accès au fichier de configuration d’Apache.

pseudo-texte$ est le mot qui remplacera /wp-admin.

http://VOTRE_BLOG.com/wp-admin  et http://VOTRE_BLOG.com/wp-login.php sont les liens par défauts.

Ultimate Coming Soon Page

Ultimate Coming Soon Page – Faire un page de maintenance d’attente pour un site wordpress

By | Aide et astuces, Le graphisme et wordpress, Plugin Wordpress, Thèmes Wordpress | No Comments

Votre site est en travaux ? Faites patienter vos internautes avec Ultimate Coming Soon Page.

Qu’ils soient en développement, en maintenance en refonte totale ou en attente d’événement particulier, nos sites Web sont un peu comme des vitrines de magasins. Toujours en évolution. Ce qui impose de rendre temporairement nos sites WordPress inaccessible au public.

Ultimate Coming Soon Page est un plugin de type freemium (entendez par cela, gratuit pour les fonctions principales, donc largement utilisables) permettant de substituer l’intégralité des pages de votre site Web par une page unique qu’il est possible de personnaliser à l’extrême.

Pour ceux qui ne se sentent pas l’âme d’un intégrateur Web, la version payante offre des modèles de pages avec décompteur intégré de qualité.

 Installer Ultimate Coming Soon Page : Un choix efficace et personnalisable

L’installation est très classique. Rendez-vous dans le tableau de bord de WordPress, -> Extensions -> Ajouter : taper Ultimate Coming Soon Page. Puis activer le plugin. A ce stade, la page indiquant aux internautes que le site est en travaux n’apparaît pas encore.

Configurer Ultimate Coming Soon Page : Voici les quelques astuces de réglages rapides.

Pour activer et configurer Ultimate Coming Soon Page, allez dans Réglages -> Coming Soon.
La page est divisé en deux panels : les réglages (Settings) et l’apparence (Style).

1. Les réglages:

Le premier réglage de ce panel (Enable : Yes) permet d’activer la page Coming Soon. Par cette page en entièrement blanche. Cliquez sur preview pour en avoir un aperçu.
A présent votre site n’est plus visible par les internautes. Seuls les utilisateurs connectés peuvent le voir.
Le texte est l’image seront à renseigner dans les champs suivants: Image, Heading, Description.
Avec Custom HTML il est possible d’utiliser n’importe quelles balises HTML, y compris la balise <script>. Ce qui est très pratique pour insérer du code JavaScript.

2. Style:

Inutile de présenter ce panel, le titre parle de lui-même. Tout ce qui aura été saisi dans Les réglages pourra être mis en forme ici : couleur ou image de fond, effet de bruit sur l’image de fond, personnalisation de la couleur du texte, choix de la police d’écriture via Google WebFont, copyright et même un champ Custom CSS.
Ce plugin est vraiment à la hauteur des plus exigeants en matière de Web design.

Sortie de WordPress 4.1 pour des améliorations très appréciables

By | Aide et astuces, Wordpress 4.1 | No Comments

WordPress sort donc sa nouvelle mise à jour, et même s’il ne s’agit que d’une mise à jour face aux changements qu’on a pu voir sur la version 4.0 ou pour le lancement de WordPress 3.0, beaucoup de nouveautés se présentent à nous, et plutôt agréables.

Donc, à retenir de façon exhaustive:

  • L’arrivée du nouveau thème annuel : Twenty Fifteen.
  • L’intégration d’un changement de langage directement à travers l’interface, plus besoin de copier-coller les fichiers  en .po et .mo.
  • Quelques changements techniques mineurs mais appréciables, comme le suivi du WYSIWYG (le distraction-free) lorsqu’on descend une page, pour plus d’efficacité dans le traitement du contenu. C’est d’ailleurs un point clair qui indique une nouvelle fois que le contenu reste la première des choses à bien traiter sur un site web (je ne parle pas de Google vous le pensez bien !)
  • La possibilité d’ajouter directement les vidéos vine, les fameuses vidéos courtes de type twitter, qui nous rappel l’importance des réseaux sociaux.

Un maj qui portent un message également à travers l’intégration du thème Twenty Fifteen et l’intégration Vine : C’est l’importance prépondérante du responsive, au service du mobile qui va devenir la première plate forme de consultation web à partir de l’année prochaine, loin devant le PC qui va prendre la troisième place.

Les sites se doivent donc d’être responsive, adaptés au mobile, tout autant que les boutiques en lignes qui doivent faire l’object d’une attention toute particulière sur ce point.

 

MP6 ou comment profiter du nouveau design à venir de la version 3.7 de WordPress.

By | Aide et astuces | No Comments

wordpress-sans-mp6wordpress-avec-mp6C’est un secret! Mal gardé mais un secret qui permet aussi à la futur version 3.7 de wordpress de faire du bruit.

Nous avons donc tester cette version de MP6 qui s’avère effectivement plutôt agréable.

Après avoir fait la recherche du plugin, la description nous indique un plugin secret mais surtout simplificateur de notre habituel administration de wordpress.

Cette administration n’est autre que celle que l’on connait depuis quelques mois sur l’administration de « wordpress en ligne ». A nouveau la version final serveur attend les tests de la version online pour s’approprier le style et les nouveautés de wordpress.
Alors qu’on attends avec impatience la version 8 de drupal, il semble que wordpress préparer également une version avec de gros changements.

MP6 permet donc d’administrer votre site comme le sera l’admin de WordPress 3.7.

Pour résumé les grands changements, c’est plus noir, plus jolie et un gros effort a été fait du côté des ico, ce qui rend l’administration plus agréable. Ceux qui passes du temps dessus comme les blogeurs pourront donc profiter d’un espace plus agréable à la rentrée.

Pour les développeurs rien de nouveau hormis le fait de présenter à ses clients, un outil plus affiné et donc plus agréable.

Télécharger l’extension MP6

wp-editor-wordpress

Editeur de code pour WordPress : Modifier ses thèmes et ses plugins comme sur Dreamweaver ou Notepad +

By | Aide et astuces, Plugin Wordpress, Référencement Wordpress, Thèmes Wordpress | No Comments

Le meilleur éditeur de code à l’intérieur de WordPress : Le choix de Wp-Editor.

editeur code couleur wordpressNotre solution après en avoir essayé de très nombreuses extensions dédiées à la personnalisation de l’environnement du code, c’est le plug-in WP editor.

Il remplace ce qui est installé par défaut dans l’éditeur de thème de la page PHP ou de votre feuille de style CSS. Cette fonction en place nativement dans WordPress depuis 2 ans, ne permet néanmoins pas une vue habituelle, telle que le permettent des logiciels comme Dreamweaver ou Notepad +.
Avec les intégrations de couleurs, l’environnement vous permet tout de suite de faire des modifications puisque les balises HTML, les balises PHP, et tout type de code apparaissent directement pour permettre de faire des modifications comme si vous étiez sur un éditeur de type Dreamweaver.

Au delà des couleurs dans le code, vous pourrez également apprécier la numérotation des lignes dans l’éditeur de texte.

La numérotation de lignes est bien pratique, puisque désormais, beaucoup font les modifications directement à partir de l’inspecteur d’élément proposé par Firefox ou par Chrome. Cette éditeur de texte intégrant la numérotation de lignes, il est alors plus facile de faire un copier coller de l’inspecteur à l’éditeur, puis de faire le modification ajustée pour la validation définitive.

Rapide et efficace il s’agit de la meilleure solution d’aujourd’hui sur WordPress pour administrer son code.
Au-delà l’avantage est également de pouvoir aller dans les fichiers CSS même si ces derniers sont localisés dans des dossiers. Après avoir changé les droits d’écriture et de permissions sur vos fichiers à partir de votre logiciel ftp, il vous sera alors possible de modifier l’intégralité du code présent sur votre site.
Cette extension fait partie des 10 meilleurs plugins à utiliser systématiquement dans un site WordPress.

Quelque soit le thème ou le plugin sur lequel vous travaillez, Wp-Editor s’associe à votre feuille et vous permettra ainsi la modification pour une personnalisation plus rapide et plus efficace. Vous allez donc grâce à cela progressivement quitter vos éditeurs de texte, et ainsi travailler de plus en plus directement en ligne pour laisser au local que les débuts de votre site.

Au delà, n’oublions pas que le référencement sur WordPress passe par une optimisation du code, c’est donc l’un des outils nécessaire pour tous ceux qui souhaitent avancer sur le sujet;)

simple 301 redirect

Simple 301 redirect pour gérer les redirections 301

By | Aide et astuces, côté serveur, Plugin Wordpress, Référencement Wordpress | No Comments

Faire une redirection 301 sur WordPress à l’aide de extension Simple 301 redirect.

Si nous utilisons WordPress pour un blog ou un site vitrine, c’est essentiellement pour ses qualités de référencement naturel sur Google. Or Google souhaite simplifier les URL (changements depuis Penguin et Panda) cela nous impose pour les sites les plus anciens d’ajuster certaines pages web afin de maximiser leur fabrication sans pour autant perdre la puissance de la page.

Si la page ne change pas en revanche l’URL, elle va être modifiée.
Alors, pour ne pas perdre la puissance du Netlinking, nous opérons une redirection 301 de l’ancienne page vers la nouvelle page.
Cette redirection, sur la nouvelle URL, peut être faite de différentes manières sur WordPress.

  • Soit à l’aide d’un fichier Htaccess, qui va répertorier les modifications et dans lequel on peut mettre une succession de lignes correspondantes à toutes les URL qui vont être changées et sur lesquelles on souhaite poser une redirection 301.
  • Soit par l’intégration d’un plugin pour gérer la redirection 301, qui fera donc tout le boulot à notre place.

Une extension wordpress de redirection 301 simple, et rapide de configuration pour garder le positionnement de vos pages référencées sur Google.

La première méthode est pratique lorsqu’il s’agit d’automatiser un site largement référencé contenant plusieurs centaines de pages. Mais s’il s’agit d’une simple modification pour une optimisation de votre référencement naturel sur certaines pages, une extension très simple va vous aider à faire cela sur WordPress. L’extension s’appelle simple 301 redirect.

Elle porte plutôt bien son nom puisqu’elle s’active et se paramètre en quelques clics

Du côté gauche vous rentrez les anciennes URL, du côté droit la nouvelle URL, puis vous valider. Par la suite en faisant le test dans votre navigateur, vous pourrez observer qu’en tapant l’ancienne adresse de votre page Web vous tombez directement sur la nouvelle. Il est donc une redirection efficace que l’on observe, mais il y a également une redirection de la puissance Web de la page, ce qui est nécessaire et indispensable si on veut conserver la puissance de référencement de positionnement de l’ancienne page.

Simple 301 redirect est a priori à la référence pour des ajustements de quelques pages ou articles. Mais si jamais cette redirection n’est que provisoire, pensez aux redirections 302 qui sont là pour les sites en travaux.
Pour le reste n’oubliez pas qu’une redirection 301 communique et transmet toute la puissance de l’ancien de la nouvelle page. Attention donc aux pages pénalisées page Penguin : si vous êtes victime d’un déclassement d’une page, il n’est pas forcément malin d’utiliser une redirection 301…

Google Web Font sous WordPress

Utiliser Google Web Font sous WordPress

By | Aide et astuces, Le graphisme et wordpress | No Comments

Utiliser Google Web Font sous WordPress s’effectue en 5 étapes. Relativement simple, il est accessible à tous, même pour ceux qui ne possèdent pas de compte Google.

 

Qu’est-ce que Google Web Font ?

Google Web Font est un site Internet proposé par Google, permettant d’ajouter plus facilement des polices d’écriture à votre site Web. En effet, par défaut les navigateurs Web prennent en compte 9 polices d’écriture qui sont : Arial, Georgia, Helvetica, Lucida, Palatino, Tahoma, Times, Trebuchet et Verdana.
Sans Google Web Font, ajouter des polices d’écriture personnaliser peut vite devenir un vrai casse-tête:

Premier problème, il existe plusieurs formats de fichier pour les polices d’écriture, et les navigateurs Web prennent en en charge qu’un seul formats de fichiers et bien entendu de l’un à l’autre ce n’est pas toujours le même format qui est supporté. Par conséquent, il faut pas moins de 4 fichiers pour que la police d’écriture personnalisé s’affiche correctement sur tous les navigateurs. Sans compter le fichier JavaScript pour les version d’IE6 et IE7.

Second problème, est que c’est fameux fichiers seront hébergé sur votre serveur xAMP, plus précisément dans un dossier situé à la racine du thème actif. Lors du téléchargement de la page, le navigateur devra également télécharger la police d’écriture. Avec une connexion Internet 3G ou bas débit cela ralentis l’ouverture de la page.

C’est pour pallier à ces problèmes que Google à mis en place Google Web Font. Le site héberge une galerie de 629 polices d’écriture à ce jour.Avec ce concept on sélectionne sa/ses police(s) d’écriture et on ajoutez les lignes de codes adéquate dans le fichier CSS.Le téléchargement de la page est moins long car il s’effectue en parallèle sur les serveurs Google pendant que votre navigateur charge la page de votre site.

Rendez-vous sur la page d’accueil de Google Web Font, puis choisissez une police de caractère.

Google Web Font sous WordPress-2

Dans cet exemple c’est la police Chango qui sera utilisé. Cliquez sur le bouton Quik-use en bas à gauche de la police d’écriture (ici case orange).

Dans les étapes 1 et 2 permettent modifier quelques paramètre de la police d’écriture. Ces réglages diffèrent quelques peut d’une police à l’autre.

Dans l’étape 3 se trouve une ligne de code HTML semblable à celle-ci:

Ouvrez le fichier &lt;strong&gt;header.php&lt;/strong&gt; de votre thème et dans le bloc &lt;strong&gt;head&lt;/strong&gt; àjouter cette ligne de code :


Dans l’étape 4 se trouve une ligne de code CSS semblable à celle-ci:

font-family: 'Chango', cursive;

Cette ligne de code sera à ajouter dans le/les fichiers CSS de votre thème. Dans l’example ci-dessous la police Chango sera utiliser pour les balises H1 :

h1 {

font-family: 'Chango', cursive;

}

Comme toute police d’écriture, il sera possible de changer la couleur, la taille, mettre en gras, italique, souligné…

wp-cron

WP-Cron pour planifier des tâches récurentes

By | Aide et astuces, sauvegarde wordpress | No Comments

WP-Cron est un programme qui permet d’exécuter périodiquement un script.

Historiquement Cron (contraction de chrono table) est un programme d’arrière-plan (ou deamon) développer pour les systèmes UNIX. Par la suite les descendants d’UNIX (BSD, Darwin, Linux…) en ont hérité.

Et WordPress dans tout ça ?

WordPress possède ça propre version de Cron appelé WP-Cron. Bien entendu il n’a de Cron que le nom. Comme beaucoup d’autres programmes UNIX, Cron est entré dans les moeurs. Dire d’aujourd’hui « faire un Cron » cela veut dire que l’on crée une planification.

Programmer une tâche unique

Sans le savoir, à chaque fois qu’une page ou un article est publié en différé (Publier tout de suite Modifier), l’utilisateur délègue la publication à WP-Cron.

Sous le capot, cela revient à faire appel à la fonction wp_schedule_single_event() avec comme paramètres la date/heure et une action du type hook. Il s’agit d’une fonction contenant le script que devra exécuter WP-Cron. Mais avant d’utiliser wp_schedule_single_event() WordPress préconise de vérifier si l’exécution du script n’a pas déjà été panifier à l’aide de la fonction wp_next_scheduled.Dans le cas contraire, la fonction retourne la date de la prochaine exécution.

// création de la tâche sous forme de fonction

add_action('action_hook', 'cron_script');

function cron_script {
	// le code source de la tâche figure ici
}

// vérification et planification de la tâche

if( !wp_next_scheduled('action_hook')){
	wp_schedule_single_event( time() + 3600, 'action_hook');
}

La fonction wp_schedule_single_event() à deux arguments obligatoires:

  • La date à laquelle le script sera exécuté. Pour cela il faut fournir un timestamp, comme dans l’exemple ci-dessous avec time() qui retourne l’heure courante, mesurée en secondes depuis le début de l’époque UNIX, (1er janvier 1970 00:00:00 GMT) plus 3600 secondes pour ajouter 1 heure.
  • Le nom du hook associé à la tâche action_hook.

Déprogrammer une tâche

WordPress stocke la date de la prochaine exécution d’une tâche planifiée dans la table wp_options. Pour la déprogrammer, il faut utiliser la fonction wp_clear_scheduled_hook() en précisant le hook associé à la tâche. Soit, action_hook.

<?php wp_clear_scheduled_hook('action_hook'); ?>
sticky menu

Créer un sticky menu en CSS

By | Aide et astuces, Le graphisme et wordpress, Thèmes Wordpress | No Comments

Le sticky menu est une des nouvelles tendances du webdesign. Cela consiste, à maintenir le menu principal collé en haut de la fenêtre du navigateur, lors du défilement vertical des pages.

Il est possible de créer un simple sticky menu à l’aide de la propriété CSS position: fixed. C’est la méthode qui va être présenté ici. L’avantage de cette méthode, c’est qu’elle est simple et donc à portée de tous. L’inconvenant est qu’il n’est pas possible de bloquer le menu seul. Il faudra bloquer tous l’entête de la page. Pour les thèmes ayant un en-tête fin (200px de haut environ) cela ne posera pas de problème, pour les autres oui. Car pendant le défilement vertical de la page cet en-tête figé sera trop imposant sur les écrans de petites tailles.

Pour ceux qui possède un en-tête trop volumineux, il est préférable d’utiliser un plugin, voir même de Jquery. Avec cette méthode, seul le menu sera maintenu en haut de page, le reste de l’en-tête disparaitra.

Pour créer un sticky menu, il faut commencer par repérer la balise div qui englobe la totalité du header de votre site. Généralement appelé header. Pour la localiser facilement, afficher la page d’accueil de votre site puis utiliser les outils de développement de votre navigateur web. Une fois localisé, ouvrez le fichier style.css de votre thème à l’aide de votre éditeur de texte préféré, puis en fin de fichier ajouter le code suivant :

.header {
	position: fixed;
	left: 10%;
	z-index: 1000;
	background-color: #FFF;
}

Dans l’exemple ci-dessus, l’en-tête du thème se trouve dans : div class= »header »
.

  • position: fixed. Permet de maintenir l’en-tête haut de la page pendant le défilement vertical.
  • left. Par défaut, l’élément vient se caller dans le coin supérieur gauche du navigateur, utilisez left pour recentrer l’en-tête.
  • z-index. Si le menu passe en dessous du contenu, ajoutez également la propriété z-index et le contenue passe en dessous.
  • background-color. Ajoutez en un car pendant le défilement de la page, le contenue peut être visible dans les espaces vides du header.

Pour la propriété left préférez une valeur en pourcentage, cela permet une meilleure intégration en responsiv web design. Ou bien, faite un en-tête faisant toute la largeur de la fenêtre du navigateur. La propriété left prendra la valeur auto

.header {
	position: fixed;
	left: auto;
	width: 100%;
	z-index: 1000;
	background-color: #FFF;
}

Pour finir, repérer la balise div qui contient le contenu de la page, généralement appelé : content, container ou wrap. Ajouter lui un padding-top dont la valeur correspond à la hauteur de l’en-tête.

Ai to canvas

Ai to canvas – Exporter un fichier AI en Canvas HTML5

By | Aide et astuces, Le graphisme et wordpress | No Comments

Ai to canvas est un plugin pour Illustrator développé par Mikes Wanson, permettant d’exporter des tracés vectoriels dans le caneva HTML5.

Qu’est-ce que le Canva HTML ?

Canva est une balise HTML5. Elle s’utilise conjointement avec le langage JavaScript pour créer des tracés vectoriels statiques ou animer.
Le code source des tracés et des animations est en JavaScript. La balise <canvas></canvas> est placée là où les tracés vectoriels et leurs animations devront figurer.

Installer Ai to Canevas

1. Télécharger le plugin sur le blog officiel de l’éditeur.

Nota: Choisissez bien le plugin en fonction de votre version d’Illustrator, CSS3, CS4, CS5, CS6 ou CC. Les versions CS6 et CC sont disponibles en version 32bits et 64btis. Là encore il ne faut pas se tromper.

Pour connaitre votre version d’Illustrator allez dans le menu Aide -> A propos d’Illustrator…

2. Une fois téléchargé, dézippez le fichier, puis placer le dans le dossier des modules.

Pour les versions:

    • Windows 32bits: C:Program Files(x86)AdobeAdobe Illustrator CSxPlug-ins
    • Pour les versions Windows 64bits: C:Program FilesAdobeAdobe Illustrator CSx (64 Bit)Plug-ins
    • Mac: /Applications/Adobe Illustrator CSx/Plug-ins

Comment utiliser Ai to canevas ?

L’utilisation de Ai to canevas est très simple. Créez un nouveau document Illustrator, puis réaliser un tracé votre vectoriel.
Une fois votre tracé vectoriel achevé, allez dans Fichier -> Exporter…. Dans type sélectionnez canevas (*.HTML)., puis Enregistrer.

Un fichier au format .html sera alors créé, et votre navigateur Web par défaut ouvrira ce dernier permettant ainsi de visualiser le résultat.

Le canvas dans WordPress

Le fichier HTML créé par Ai to canvas ne peut pas être utilisé tel quel sur votre site. Il va falloir ouvrir le fichier avec un éditeur de texte pour en extraire les parties importantes. A savoir, le contenu dans des balises <script></script> et <canvas></canvas>.

Dans WordPress, créez une nouvelle page, puis copiez/collez la balise <canvas></canvas> et sont contenu. Cliquez sur Publier pour enregistrer votre travail.

Quant au script JavaScript, copiez/collez le (sans les balises <script></script> ) dans un nouveau fichier, puis enregistrez-le avec l’extension .js. Pour notre exemple ce sera: canvas.js.
A la racine de votre thème, créez un sous-dossier js si il n’est pas déjà présent, puis placez-y votre fichier.js à l’intérieur.

Ouvrez à présent, le fichier header.php situé dans le dossier racine de votre thème. Localiser la balise fermante </head> et ajouter le code HTML suivant juste au-dessus de cette dernière:

...
	<script type='text/javascript' src="js/canvas.js"></script>
</head>

Pour aller plus loin

Bien que l’image soit de type vectoriel elle n’en est pas pour autant responsive. Pour remédier à cela, ajoutez dans votre fichier CSS.

canvas#canvas {
	width: 100%;
}

Cet article a pour but de présenter le plugin AI to canvas ou plutôt une introduction à celui-ci afin de permettre au plus grand nombre de créer simplement des tracés vectoriels et de les exploiter au sein d’un page WordPress..

C’est pourquoi la fonction animation ne sera pas décrite dans cet article, car trop difficile pour ceux qui ne maitrisent pas JavaScript.
Pour les plus courageux, rendez-vous sur le site officiel, pour y trouver des tutoriels, des exemples ainsi que des vidéos faites par Mikes Wanson en personne.