Principe général

L'objectif du plugin est de venir modifier le markup HTML généré par WordPress afin d'y appliquer son propre markup selon le mode d'implémentation choisi.

Une zone est appelée location dans le plugin. Chaque location est composée de plusieurs tailles d'images, une image par défaut et selon le mode une image à taille minimale chargée si le JS est désactivé.

Cela se transcrit par deux fichiers JSON se situant dans le thème ( /assets/conf-img/ ). Le premier fichier est celui contenant toutes les tailles d'images que le theme aura besoin : image-sizes.json

[{
    "small": [],
    "img-300-200": {
        "width": "300",
        "height": "200",
        "crop": true
    },
    "img-600-100": {
        "width": "600",
        "height": "100",
        "crop": true
    },
}]

Le second fichier est celui contenant l'ensemble des informations pour une location : images-locations.json

[
  {
    "ad-square": [
      {
        "srcsets": [
          {
          	"srcset" : "",
            "size": "img-350-292"
          },
          {
          	"srcset" : "2x",
            "size": "img-700-584"
          }
        ],
        "default_img": "thumb-350-292.jpg",
        "img_base": "img-300-250"
      }
    ]
  }
]

• ad-square = nom de la location qui sera utilisée dans le thème
• srcsets = liste des tailles d'images pour constituer le responsive image
• default_img = image par défaut si aucune contribution faite dans le back office
• img_base = taille d'image minimale pour l'affichage sans JS