Optimiser simplement les images sous wordpress

Optimiser Worpdress est une priorité

Aujourd’hui les règles SEO imposées par Google prennent en compte les performances de votre site internet. De ce fait il analyse le temps de réponse de votre site pour les usages depuis les ordinateurs et les mobiles. 

Beaucoups de règles rentrent en comptes pour l’optimisation de votre site. Ici, vous trouverez une série d’articles afin de vous présenter comment optimiser votre site internet. 

Optimiser la compression des images

Par défaut WordPress vous fait confiance, il garde en mémoire l’image que vous lui envoyez puis crée des formats d’affichages de cette dernière (petite, moyenne et grande). 

A l’utilisation de votre image, lorsque vous la choisissez depuis votre librairie il est courant que vous ne soyez pas sensibilisé au choix de sa dimension. Alors que ce ci améliore les temps de chargement de votre site et ainsi votre note sur Google par rapport à l’image original. 

Exemple ci-dessous ou vous pouvez choisir sa dimension en bas à droite
smush optimisation wordpress

 

Mais où intervient Smush ?

Smush arrive en complément en définissant  : 

  • Une taille en pixel maximum à l’upload
    • Afin d’éviter les images trop volumineuses
    • Il redimensionne automatiquement
  • Compresse les images avec un pourcentage de qualité
    • Réduit le poids de l’image à envoyer depuis le serveur (70% conseillé)
  • Permettra le lazy load dont on parlera dans un autre article
  • Et mettra à disposition un CDN dans sa version pro. 

Maintenant vous n’aurez plus besoin de vous soucier de la dimension de vos images même si vous oubliez de choisir un format optimisé pour l’affichage de cette dernière, puisque Smush passera derrière vous pour compresser les images bien trop lourdes. 

Mais il reste conseillé de bien choisir son format d’affichage et ne pas garder le format original. 

Smush vous permettra aussi d’avoir un rapport sur l’espace économiser sur le serveur grâce à lui. Car réduire la dimension des images est aussi bon pour votre infra.

smush optimisation wordpress 

Extension de partage sur les réseaux sociaux pour WordPress

La frustration sur les extensions de partage pour les réseaux sociaux

Sur WordPress les extensions gratuites sont de plus en plus rares. La belle époque est révolue. Seul Drupal arrive encore à garder une communauté qui fournie des extensions avancées gratuites sans compléments financiers. 

Sur WordPress de nos jours trouver une extension entièrement gratuite, facile à mettre en place et performantes pour partager sur les réseaux sociaux est devenu compliqué. 

Et je n’en ai pas trouvé ! 

Le choix de social pug

Après plusieurs recherches et essais à votre place j’ai trouvé diverses extensions. 

La problématique se résume rapidement à : 

  • Si les mises en pages avancées sont gratuites alors on doit se créer un compte sur un service tiers comme Addthis
  • Si le plugin ne nécessite pas d’inscription sur un service tiers alors on nous demande de passer à la caisse pour débloquer des réseaux sociaux ou une mise en page avancée. 

Social Pug, elle ne vous oblige pas à créer de compte sur des services tiers et ses mises en pages gratuites restent totalement acceptables en terme de design et personnalisable par votre propre thème. De plus il propose deux types de positionnements par défaut. Flottant sur la page ou en inline dans le contenu. Sans avoir à tripatouiller le module.

Il est aussi facilement responsif. 

Aujourd’hui je l’utilise sur mes deux sites (1 et 2) et comble toutes mes attentes. Certes ce n’est pas une révolution mais il fait un bon travail sur son scope gratuit sans vous frustrer. 

Essayez le !

SQLite – Installer wordpress sans base de données MYSQL

Installer WordPress sans base de données Mysql – SQLite

Les bases SQLite sont des bibliothèques écrites en langage C qui propose un moteur de base de données relationnelle accessible par le langage SQL.

Contrairement aux serveurs de bases de données traditionnels, comme MySQL ou PostgreSQL, sa particularité est de ne pas reproduire le schéma habituel client-serveur mais d’être directement intégrée aux programmes. L’intégralité de la base de données (déclarations, tables, index et données) est stockée dans un fichier à plat au près de votre projet. Ici notre wordpress.

Comment le mettre en place ?

Déjà, il faut savoir que la compatibilité annoncé s’arrête avec la version 4.1.24 mais je l’ai personnellement testé sous WordPress 4.9.8 et l’extension reste à 100% fonctionnelle.

Pour se faire :

  1. Télécharger l’extension SQLite intégration
  2. Copier l’extension dans wp-content/plugins
    1. Pour avoir wp-content/plugins/sqlite-integration
  3. Copier le fichier db.php présent dans wp-content/plugins/sqlite-integration à la racine de wp-content
    1. Pour avoir wp-content/db.php
  4. Editer le fichier wp-config-sample.php en le renommant wp-config.php et en rajoutant dedans
      1. define(‘DB_FILE’, ‘.ht.sqlite’);
      2. define(‘DB_DIR’, ‘/your-project-path/’);
  5. Accéder à votre site et l’installation se fait automatiquement.

Attention, Apache ou Nginx doivent avoir le droit en écriture dans le dossier ou est la base de donnée.
De plus, si vous avez une installation fraiche de wordpress et que vous avez une boucle de redirection, ajoutez ces ligne dans le .htaccess pour apache afin de résoudre correctement les path de l’application.

# BEGIN WordPress
<IfModule mod_rewrite.c>
RewriteEngine On
RewriteBase /
RewriteRule ^index\.php$ - [L]
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule . /index.php [L]
</IfModule>
# END WordPress

Et voilà, un WordPress sur une base SQLite, utile pour un site secondaire quand vous n’avez plus de place sur votre base principale, si votre projet doit être facilement transposable, …

 

 

Drupal 8 entityQuery – Récupérer une entité avec les valeurs de ses champs [En résumé]

Drupal

La class entityQuery de drupal permet de récupérer une entité ou une liste d’entités.

Tout les types d’entités sont pris en compte, c’est à dire les node, block, user, paragraphs, …

Une utilisation basique :

$query = \Drupal::entityQuery('node')
->condition('status', 1)
->condition('type', 'article')   
->condition('field_example', 'cheveux'); $nids = $query->execute();

Ici nous récupérons les entités de type article, publié qui comportent dans le champs field_example la valeur égale à cheveux. Un tableau est ainsi renvoyé avec les nodes comportant ces valeurs.

Fences – Drupal nettoyez les wrappers de vos champs

Drupal

Présentation rapide de Fences, l’ami de vos projets Drupal

La frustration courante de Drupal est le rendu natif de ses champs. Les valeurs d’un champs sont rendues au niveau du template dans des wrappers verbeux et toujours accompagnés de balises “<div>”. Fences est là pour vous aider.

Exemple du rendu d’un champs sous drupal : 

<div class="field field-name-field-test field-type-text field-label-above">
  <div class="field-label">Le label de mon champs</div>

  <div class="field-items">
    <div class="field-item even">Mon paragraphe ...</div>
  </div>
</div>

Les problèmes ?

  1. N’est pas nativement SEO friendly pour specifier un h2 par exemple sur l’emploi d’un champs
  2. L’imbrication de div, un mauvais ratio code/contenu peut être approché
  3. La structure du DOM se complexifie trop facilement
  4. Les balises HTML5 non supportés
  5. La personnalisation du rendu plus long en créant par exemple un thème pour votre field ou ressortir les données correctement dans le tpl de votre node, …

Bien sûr Fences n’est pas indispensable, on peut faire sans si on a compris la logique de Drupal. Mais il peut être sympa à implémenter dans vos projets ou la structure de rendu de vos node n’est pas évoluées et peut être simplement gérée avec le gestionnaire d’affichage de Drupal. Fences peut apparaître comme complément à la mise en forme de votre site et de son rendu. Mais aussi pour les projets plus évolués pour une gestion des fields plus évolués dans votre propre process.

Fences

Vous l’aurez compris Fences permet d’optimiser le rendu de vos champs. Une belle optimisation configurable simplement lors de la création de votre champs en choisissant son container.
Fences vous permet tout comme le système natif de Drupal de créer une nouvelle sortie de vos champs et de les mettre en forme à l’aide d’un template associé.

Exemple :

<h3 class="field-label">Le label de mon champs</h3>

<p class="field-foobar">Mon paragraphe ...</p>

Bien sûr vous n’êtes pas obligé d’utiliser Fences, et il n’est pas la seule solution. D’autres alternatives sont présentés sur la fiche du module mais il est à mon unique sens le plus rapide à configurer. Notez tout de même que sa configuration est exportable dans des Features.

Télécharger Fences pour Drupal 7 en version stable : Module
Le module est en cours de développement pour Drupal 8.

Faille de sécurité critique – PhpMailer

Phpmailer security

Le beau cadeau de PhpMailer pour la période des fêtes !

Une faille de sécurité a été découverte dans la librairie PhpMailer utilisée dans la plupart des sites web à technologies open sources (Php). Cette librairie permet de gérer simplement l’envoie des emails via le protocole SMTP.

Toutes les version inférieurs à la 5.2.18 sont vulnérables, il est donc conseillé de mettre à jours la libvrairie au sein de vos applications, ou de mettre à jours les plugins/modules utilisant cette librairie sous vos CMS préférés comme WordPress, Joomla ou Drupal. Des mises à jours de sécurités sont alors forcément à venir pour les différents CMS.

Pour le POC rendez-vous ici

Source

Actualité – Un rapide petit tour d’horizon

Actualité

Allez un rapide petit tour de l’actualité, très rapide.

ISS Live – Un rapide petit tour d’horizon !

ISS Live est une application permettant de suivre en direct la position de l’ISS. L’application est accompagnée d’un live de deux caméra. L’une d’entre elle est en HD et vous  permet de faire de beau clichés de la terre. Quant à la seconde la qualité est bien moindre mais la caméra n’est jamais la même. Sur cette dernière vous avez aussi droit aux conversations des astronautes.
L’application est synchronisée avec une carte afin de connaitre en direct la position de la station.
Les utilisateurs peuvent aussi commenter au sein de l’application après avoir créé un compte facilement à l’aide de Google ou Facebook.

Télécharger l’application

Chrome 55 – Consomme moins de ram

Chrome basé sur webkit est aujourd’hui le navigateur internet le plus utilisé (63% du marché). Mais bien qu’il soit le plus utilisé ce dernier est aussi un des plus gourmand, bien loin devant notre petit favori à tous Internet Explorer (pour de la critique). Ainsi avec la version 55 de chrome Google promet une consommation en ram allégé de 50% grâce à une optimisation du corps javascript et l’abandon prononcé de flash au profit de l’html5.

WordPress 4.7 – Released

WordPress 4.7 est enfin disponible depuis le 7 décembre en version finale. Retrouvez ici la liste des nouveautés.

Drupal 7 – End of life

Avec la sortie de Drupal 8 il est légitime de s’inquiéter pour son prédécesseur. Va-t’il continuer à recevoir des mises à jour de sécurité ? La réponse est oui ! Drupal 7 sera maintenu jusqu’à la sortie de Drupal 9 planifié pour 2020. A l’image de Drupal 6 qui s’est vu arrêté 3 mois après la sortie de Drupal 8 nous pourrons alors imaginer le même scénario pour 2020. Bien sur Drupal 7 recevra uniquement les mises à jours de sécurités et non plus les mises à jour correctives ou pour diverses évolutions.

Adminer – Une alternative ultra légère à PhpMyAdmin

Php sql

Adminer ! Un fichier suffit ! 

Vous connaissez sûrement PhpMyAdmin contrairement à Adminer. Cet outil permettant de gérer visuellement vos bases de données, leurs structures et leurs données. Vous l’utilisez depuis des années naturellement car il est fourni avec votre package de développement Apache, Mysql, Php que ce soit sous Windows, Linux ou Mac OS. Une fois que vous devez passer le site en production votre hébergeur favori le met lui aussi naturellement à votre disposition. C’est parfait ! Vous connaissez l’outil, et est présent quasiment partout. Cet outil magique vous permet de faire des import / export de bases, modifier les données, gérer les permissions, créer des requêtes avancées … Oui, il est complet.

Mais voilà, il se peut que demain vous ne preniez pas le temps d’installer PMA car il est long a mettre en place ou que votre hébergeur plus restrictif en terme de sécurité ne vous le met pas à disposition et tout ça alors que vous devez déboguer dans l’urgence ou réaliser des manipulation sur votre base de données.

C’est là qu’entre en jeu Adminer !

Adminer n’est pas un réel concurrent à PhpMyAdmin mais plus une alternative très utile. Il vous permettra de réaliser des opérations similaires à celles proposées par PMA mais le tout en un seul fichier php. Et oui, vous n’aurez qu’a l’uploader sur votre site dans un répertoire accessible en web et l’appeler. Une fois Adminer exécuté vous pouvez renseigner vos informations de connexion. Un visuel de votre serveur SQL apparaît. Vous n’avez plus qu’à utiliser ce dernier bien qu’il soit légèrement moins sexy que PMA. Vous noterez la présence du support multi-langue de l’interface.

Adminer

Une fois vos opérations terminées, prenez soin de supprimer le fichier. Surtout si il a aucunes raisons de rester sur votre serveur.

Ne me croyez pas et comparez PMA et Adminer

Télécharger Adminer ici.

Drupal 7.52 | 8.2.3 – Mis à jour de sécurité moyenne

Drupal

4 nouvelles failles de sécurité sont à combler sur vos sites Drupal !

L’équipe de sécurité a mis à jour le core en version 7.52 pour Drupal 7 et en 8.2.3 pour Drupal 8.
La mis à jour signalée comme modérément critique (13/25) sortie le mercredi 16 Novembre 2016 fixe 4 vulnérabilités.
2 sont présentes seulement sur D7 et 3 sur D8. L’une d’entre elles est donc disponible sur les deux versions de Drupal.

Criticité moyenne

L’une des deux plus urgentes concerne la version 8, une faille dans le mécanisme de translittération permet à une URL formatée d’une manière spéciale de mettre le site hors ligne (déni de service). La translittération permet de nettoyer les noms des fichiers sur Drupal, générer les machines names, ou de url propre vers les contenus. Le but est de retirer tout caractères spéciaux et les remplacer par leurs équivalents. Exemple, un “é” en “e”.

L’autre faille de sécurité la plus importante concerne elle Drupal 7. Apparemment, dans certaines circonstances un utilisateur malveillant pourrait construire sa propre URL de soumission pour un formulaire. L’utilisateur lambda pourrait être redirigé sur un site tiers non officiel et abusé de sa confiance (social engineering/manipulation humaine).

Criticité Faible

Une faille concerne D8, où le cache de la page de réinitialisation de mot de passe était apparemment défini sous de mauvaises conditions de réinitialisation. La page peut afficher du contenu indésirable.

La dernière faille concerne D7 et D8, les hook permettant de surcharger les requêtes afin de récupérer des informations supplémentaires depuis la base de données (hook_query_alter, …) permettraient aux utilisateurs malveillants de récupérer des informations sur les term de taxonomies. La gestion de la restriction était faite sur le tag term_access et non taxonomy_term_access.

 

Il est bien sûr conseillé de mettre vos sites à jour.

Source : SA-CORE-2016-005