website ~ lien avec screenshot du site

Cette action permet de faire des liens avec une image du site.

On récupère le screenshot fait par l'API Google PageSpeed Insights. La vignette est recréée tous les 30 jours.

➠ website : Affiche un screenshot d'un site avec un lien.

Cliquer pour lire la documentation

syntaxe {up website=URL}
par defaut, le texte affiche sous la vignette est l'URL sans http://
author LOMART version UP-1.4 license GNU/GPLv3 tags Widget
  • website: URL du site
  • link = 1: affiche le lien au-dessous du screenshot
  • link-text: texte affiche pour le lien et alt
  • target = _blank: ou _self pour ouvrir le site dans le meme onglet
  • renew = 30: nombre de jours pour actualiser les vignettes. 0 = jamais (v2.2)
  • timeout = 15: delai pour recupérer les infos du serveur Google (v2.2)
  • style: classes et style inline pour bloc
  • class: classe(s) pour bloc (obsolete)
  • css-head (base-css): regles CSS definies par le webmaster (ajout dans le head) v1.8

    La version simple

    {up website=https://lomart.fr}

    Il suffit d'indiquer l'URL complète du site.

    UP va générer une vignette du site à l'aide de l'API Google PageSpeed Insights. Une seule taille d'image de 500x348px est disponible. L'attribut alt de l'image contient le nom du site sans le http.

    Avec quelques paramètres

    {up website=https://lomart.fr/extensions/lm-custom 
    | link-text=LM-Custom 
    | style=text-align:center 
    | target=_self}

    Nous modifions le comportement par défaut:

    • link-text : le texte utilisé pour le lien sous la vignette et sa balise alt (à la place de l'URL). link=0, permet de ne pas afficher de lien sous l'image.
    • style permet d'aligner le contenu
    • target=_self : oblige le lien a s'ouvrir dans le même onglet/fenêtre

    Il est possible d'afficher uniquement la vignette avec l'option link=0

    Une galerie de sites amis


    Pour cette galerie, j'utilise 3 actions UP :

    • addCssHead pour définir des règles spécifiques pour cette galerie. Cela évite de les définir dans chaque action website
    • flexAuto pour afficher les sites dans une grille flexible. Remarquez que l'ID est forcé pour l'utiliser dans addcsshead
    • website une ligne par site

    Le code est très clair et facilitera les mises à jour de la liste des sites.

    {up addcsshead=#websites div[text-align:center]#websites img[box-shadow:0 2px 2px 2px rgba(0,0,0,0.2); margin-bottom:10px]#websites img:hover[box-shadow:0 3px 6px 4px rgba(0,0,0,0.4)];}
    {up flexauto=4 | tablet=3 | mobile=2 | style=fg-gap | id=websites}
      {up website=https://kb.joomla.fr}
      {up website=https://www.breezingforms.eddy-vh.com}
      {up website=https://forum.joomla.fr}
      {up website=https://cinnk.com/joomla/3/le-livre-pour-tous | link-text=cinnk.com - le livre pour tous}
      {up website=https://www.conseilgouz.com}
      {up website=https://github.com/cavo789/joomla_free/tree/master/src | link-text=Github-cavo789 - outils Joomla}
    {/up flexauto}

    En cas d'erreur

    {up website=https://un_site_inexistant.fr}
    
    ➜ UP.website : https://un_site_inexistant.fr : URL non valide 

    en cas de page inexistante ou d'url incorrecte, un message sera affiché.

    Si vous avez un message "Cette adresse met trop de temps pour répondre" :

    • pour la racine d'un site, essayez d'ajouter un slash en fin. ex : //up.lomart.fr/ 
    • Google observe un delai en cas de demandes rapprochées. Essayez de générer vos pages par petits paquets.

    Gestion du cache

    La récupération du screenshot par l'API Google PageSpeed Insights demande une dizaine de secondes.

    Pour éviter cette latence, une copie est sauvegardée dans le dossier /media/plg_content_up/website. La vignette est automatiquement recréée selon la fréquence définie par l'option renew (30 jours par défaut). renew=0 permet de ne jamais régénérer les vignettes.
    Vous pouvez forcer la génération en supprimant le fichier dans le dossier cache.

    Attention : Lors de la création de la page ou si vous supprimez toutes les vignettes d'un coup, toutes les vignettes doivent être créées, ce qui peut être très long. Lors des régénérations des vignettes, un délai de 15 minutes est observé entre chaque demande pour ne pas gêner les internautes.

    Depuis la version 1.4 de UP, il est possible au webmaster d'indiquer ses préférences pour le site. Consulter : Programmation : personnaliser une action.

    Version 2.2 : nouvelles options

    • timeout : 15s par défaut, cette option est la durée d'interrogation du serveur avant abandon. A adapter en fonction de la rapidité de réponse de ce dernier.
    • renew : 30 par défaut est le nombre de jours entre les regénérations des vignettes. 0 permet de ne jamais régénérer les vignettes
    breezingforms.eddy-vh.com

    L'option renew est utile si le site répond mal, mais également si vous préférez un autre screenshot que celui retourné par l'URL.
    Un exemple : la page du site www.breezingforms.eddy-vh.com qui parle de UP affiche une fenêtre modale pour le RGPD qui cache le contenu.
    Pour éviter cela, j'ai fait une copie d'écran de la page sans la fenêtre modale pour remplacer l'image générée par l'action dans /media/plg_content_up/website. Sa taille doit être de 500x348px
    Le shortcode est identique avec juste l'ajout de l'option renew=0 pour ne jamais remplacer le screenshot.
    {up website=https://www.breezingforms.eddy-vh.com/pas-a-pas/formulaire-dynamique-avec-affichage-en-popup | link-text=breezingforms.eddy-vh.com | renew=0}