web-dev-qa-db-fra.com

Redimensionner les images à la taille réelle utilisée dans l'éditeur?

Existe-t-il un moyen de redimensionner les images à la taille réelle dans laquelle elles seront affichées? J'ai des utilisateurs qui importent une grande image et la redimensionnent ensuite dans l'éditeur visuel. C'est facile, car ils peuvent simplement faire glisser l'image jusqu'à la taille souhaitée, sans avoir à ouvrir un éditeur d'image, redimensionner, enregistrer et télécharger en pièce jointe. Bien entendu, cela se traduit parfois par une image de 100 pixels de large dans le message, mais de 1500 pixels en réalité.

Est-ce qu'il y a un plugin qui fait ça quand un nouveau post est sauvegardé? Je souhaite conserver l'image existante en taille réelle (pour la liaison ou les redimensionnements ultérieurs), mais pour ajouter une taille supplémentaire (et l'enregistrer dans l'objet _wp_attachment_metadata), cette publication a donc la taille correcte, ainsi qu'une référence à la pièce jointe en taille réelle.

Bien entendu, tous les postes existants doivent également être traités une fois. Les balises <img> peuvent ne contenir qu'une width, juste une height ou aucune: elles doivent toutes être nettoyées pour qu'elles aient toutes la bonne width, height et une image de cette taille.

20
Jan Fabry

J'ai créé deux plugins qui, ensemble, devraient résoudre mes besoins. Ils en sont actuellement aux premiers stades alpha et tous les commentaires sont les bienvenus.

Le plugin de base est un Resizer à la demande . Ce plugin surveille les demandes de fichiers non existants dans le répertoire uploads et crée des images de la taille demandée si nécessaire. Par exemple, image-200x100.jpg va créer et renvoyer image.jpg, mais redimensionné à 200 par 100 pixels. L'image est enregistrée sous ce nom dans l'annuaire. Les autres demandes sont traitées directement par le serveur.

Le second plugin, Redimensionne les tags img , modifie les tags <img> afin que leurs attributs src incluent des données de largeur et/ou de hauteur. Cela permet au premier plugin de servir les images correctes. Ensemble, ils font ce que je veux, et je n'ai besoin que de créer une fonction run-once pour convertir toutes les publications existantes, mais cela devrait être facile (je ne veux pas me connecter à the_content pour quelque chose qui ne devrait être exécuté qu'une seule fois).

Un troisième plugin "bonus", Images intermédiaires virtuelles , intercepte la création des images intermédiaires lors du téléchargement d'une nouvelle image dans WordPress. Comme elles sont toujours créées par le premier plug-in si nécessaire, cela vous permet de spécifier plusieurs tailles d'image sans occuper d'espace disque, à moins qu'elles ne soient réellement utilisées. Ce n'est pas nécessaire pour que les deux premiers fonctionnent, mais c'était un ajout facile, et cela souligne le fait que je dois toujours travailler avec l'éditeur d'images WordPress, mais je le ferai lorsque je crée mon éditeur de vignettes , qui utilisera également le premier plugin.

11
Jan Fabry

J'ai cherché dans le répertoire du plugin "resize" ou "crop" (ce dernier pour une autre question ), et noté mes conclusions dans un tableur Google public . La recherche de plugin est très déroutante dans ses résultats (la dernière page de la recherche "resize" indique "145-150 sur 273 plugins"), j'en ai peut-être oublié quelques-uns. Notes semi-connexes: tout le monde semble penser que le monde a besoin d'un autre plug-in de diaporama. Peu de gens semblent se rendre compte que content_save_pre est peut-être un meilleur filtre pour effectuer des analyses syntaxiques lourdes que the_content.

Je n'ai encore testé aucun de ces plugins, mais voici une liste de plugins qui semble faire ce que je veux. J'ai ajouté le numéro de version "Compatible jusqu'à" entre parenthèses.

Pensées personnelles: Les quatre premières réécrivent l'URL sur une page dynamique (quelque chose comme /wp-content/plugins/my-plugin/image.php?src=[original src]&w=100&h=50), avec différentes formes de mise en cache. Je préfère une image réelle créée selon les besoins, similaire à l'approche adoptée par ImageScaler. Cependant, je scinderais ceci (et inclurais la suggestion de hakre dans les commentaires) et réécrirais d'abord toutes les URL de /wp-content/uploads/2010/11/image.jpg à /wp-content/uploads/2010/11/image-100x50.jpg, puis laisserais un script créer les images manquantes. La première demande pour cette image crée l'image, toutes les demandes suivantes utilisent cette image créée. Cela me permet également de partager la fonctionnalité entre différents plugins. Je vais poster cette solution dans une réponse séparée.

Ces plugins limitent les images à une certaine taille maximale (en quoi est-ce différent de spécifier $content_width?):

  • JP-redesign-images , vérifie les images fusionnées et surdimensionnées (uniquement si elles sont trop grandes, pas si elles sont simplement redimensionnées) (3.0.1)
  • Hungred Image Fit , vérifie les images trop grandes (3.0.0)

Le plugin suivant est intéressant pour d'autres raisons:

Ceci est un post de wiki de communauté, il peut donc être mis à jour si vous trouvez de nouveaux plugins.

4
Jan Fabry

Wordpress propose trois tailles par défaut (petite, moyenne et grande) pouvant être configurées. Si vous les utilisez, Wordpress crée des copies redimensionnées. C’est probablement un bon style que d’utiliser ces éléments et de définir le nombre afin qu’ils correspondent au style actuel. Il en résulte que les images n'ont pas des tailles différentes sur toute la page et permettent des réglages globaux lorsque le thème change.

0
Raphael

Le plug-in Image Pro récemment publié semble faire exactement cela. Je ne m'étais pas encore testé, la démo est très impressionnante, notez une compatibilité de navigateur médiocre (Firefox uniquement).

0
Rarst

Pourquoi ne pas utiliser timthumb et variable variable pour modifier automatiquement la taille/les dimensions de l’image et les niveaux de zoom? De cette façon, les tailles d'image originales peuvent toujours être conservées. Si vous avez besoin d'exemples sur cette ligne, faites le moi savoir.

0
NetConstructor.com