Share
TimThumb è stato uno script di ridimensionamento delle immagini preferito da molto tempo per gli autori dei temi di WordPress. Ma, con i nuovi requisiti per la presentazione del tema WordPress su ThemeForest, dobbiamo dire addio a TimThumb.
Questo articolo ti insegnerà come trasferire i tuoi temi da TimThumb e in un nuovo script di ridimensionamento delle immagini chiamato BFIThumb.
BFIThumb è un progetto open source ed è disponibile su GitHub.
Prima che WordPress avesse la capacità di eseguire il ridimensionamento flessibile delle immagini, l'unica opzione era usare librerie di terze parti come TimThumb. La cosa bella di TimThumb era che era pieno di funzionalità ed era molto facile da usare.
Non hai avuto bisogno di fare molto per farlo funzionare, dovresti semplicemente usare lo script TimThumb come tuo src attributo nel tuo img taggalo e passa l'immagine:
Con un semplice cambiamento, potresti:
Queste funzioni ci hanno permesso di creare immagini fantastiche che non si limitavano alle miniature quadrate.
Una buona ragione è il principale difetto di sicurezza in TimThumb che è stato scoperto ed esposto nella versione 1.10. In breve, c'era un buco del loop che consentiva di eseguire codice dannoso sui server che ospitavano uno script TimThumb.
Molti siti sono stati compromessi a causa di questo - inclusi alcuni dei miei - e anche alcuni degli utenti dei miei temi. Sebbene questo fosse stato risolto nelle versioni successive di TimThumb, molte persone non erano nemmeno a conoscenza del difetto di sicurezza fino a quando non era troppo tardi. Spetta agli autori dei temi e ai proprietari dei siti aggiornare i loro temi o script TimThumb per includere la correzione.
A mio parere, il problema di questa debacle non era dovuto alla falla della sicurezza stessa, ma più a causa del modo in cui questo tipo di problema non poteva essere risolto facilmente su scala globale. Poiché TimThumb era uno script di terze parti senza fronzoli, era difficile per le persone ottenere rapidamente l'aggiornamento per la sicurezza, o anche solo per ricevere una notifica che esisteva un difetto di sicurezza.
Se un difetto di sicurezza di questo livello è stato trovato nel core di WordPress, tuttavia, molto probabilmente verrà corretto subito con un rapido aggiornamento di sicurezza di WordPress e la maggior parte delle persone non sarebbe nemmeno a conoscenza del problema.
Detto questo, potrebbe essere meglio usare una funzione WordPress per eseguire il ridimensionamento delle immagini.
Quindi, dobbiamo eliminare TimThumb dai nostri temi WordPress. Come autori di temi su ThemeForest, forse la ragione più ovvia è quella TimThumb non è più consentito con l'implementazione dei nuovi requisiti di partecipazione ai temi di WordPress di Envato.
Fortunatamente per noi, quando è stato rilasciato WordPress 3.5, abbiamo introdotto la classe WP Image Editor. Questa classe ha alcune funzioni di base per ruotare, ritagliare e ridimensionare le immagini. Ora abbiamo il ridimensionamento delle immagini integrato in WordPress!
Probabilmente una delle migliori caratteristiche della classe WP Image Editor è quella supporta sia le librerie GD che ImageMagick (a differenza di TimThumb che supporta solo GD). Ciò significa che i nostri temi possono supportare più installazioni di WordPress.
Questo è come useresti il WP_Image_Editor classe:
Accentsconagua
// Restituisce un'implementazione che estende WP_Image_Editor $ image = wp_get_image_editor ('cool_image.jpg'); if (! is_wp_error ($ image)) $ image-> ridimensiona (400, 300, true); $ image-> save ('new_image.jpg'); WP Image Editor è semplice, ma un po 'carente per le nostre intenzioni. Dovrai chiaramente creare la tua funzione di wrapper in modo che non dovrai usare un mucchio di codice ogni volta che vuoi visualizzare un'immagine ridimensionata.
Un'altra cosa da notare è che il wp_get_image_editor la funzione accetta solo un percorso di file immagine, dovrai anche aggiungere alla funzione wrapper un metodo per convertirlo nell'URL dell'immagine.
A parte la necessità di creare una funzione wrapper, ci sono alcune lacune nella sostituzione diretta di TimThumb con WP_Image_Editor classe:
Sarebbe bello se avessimo qualcosa che incorpori le caratteristiche sia della classe WP Image Editor sia di TimThumb. Questo è il motivo per cui ho creato lo script BFIThumb.
Vorrei presentarvi un nuovo ridimensionatore di immagini chiamato BFIThumb. BFIThumb è stato creato con questi punti in mente:
WP_Image_Editor per eseguire la manipolazione dell'immagine - L'uso di questa classe di WordPress consente meno bug, poiché la maggior parte del processo non viene eseguita dal nostro codice. Ciò significa che possiamo anche fornire il ridimensionamento per entrambe le librerie GD e ImageMagick.src attributo del tuo img tag. Il percorso dell'immagine ridimensionata verrebbe restituito dalla funzione. Ciò consente un codice più leggibile e un tempo di transizione più semplice.WP_Image_Editor e aggiunge più funzionalità.BFIThumb è stato creato per essere simile all'utilizzo di TimThumb. La funzione principale che devi chiamare è bfi_thumb. Simile a TimThumb, utilizzerai questa funzione in src attributo del tuo img tag. Questa funzione acquisisce un URL dell'immagine insieme ad una serie di parametri, quindi restituisce l'URL dell'immagine elaborata.
Ecco l'utilizzo di base della funzione, suddiviso per spiegare cosa succede:
// Include la libreria require_once ('BFI_Thumb.php'); // I nostri parametri, esegui un ridimensionamento $ params = array ('width' => 400, 'height' => 300); // Ottieni l'URL della nostra immagine elaborata $ image = bfi_thumb ('URL-to-immagine.jpg', $ params); // Stampa il nostro tag img echo "
"; Per eseguire il ridimensionamento e il ritaglio, devi solo inserire i parametri necessari:
"; // Ridimensiona solo per larghezza, l'altezza si adatta al rapporto corretto $ params = array ('width' => 400); $ image = bfi_thumb ('URL-a-immagine.jpg', $ params); // Ridimensiona solo per altezza, la larghezza si adatta al rapporto corretto $ params = array ('height' => 300); $ image = bfi_thumb ('URL-a-immagine.jpg', $ params); // Ridimensiona per larghezza e altezza e ritaglia $ params = array ('width' => 400, 'height' => 300, 'crop' => true); $ image = bfi_thumb ('URL-a-immagine.jpg', $ params); I filtri immagine sono molto utili e, se usati correttamente, possono abilitare fantastici effetti nei tuoi temi. Ad esempio, il in scala di grigi il filtro immagine può essere utilizzato per creare immagini in bianco e nero che si colorano quando si posiziona il puntatore del mouse.
Ho anche avuto un uso per il opacità filtro quando avevo bisogno di rendere l'immagine di sfondo opaca per mostrare un po 'del colore di sfondo.
// Grayscale $ params = array ('grayscale' => true); $ image = bfi_thumb ('URL-a-immagine.jpg', $ params); // Colorize $ params = array ('color' => '# ff0000'); $ image = bfi_thumb ('URL-a-immagine.jpg', $ params); // Negate $ params = array ('negate' => true); $ image = bfi_thumb ('URL-a-immagine.jpg', $ params); // Cambia opacità (rende l'immagine in un PNG) $ params = array ('opacity' => 80); // 80% opaco $ image = bfi_thumb ('URL-a-immagine.jpg', $ params); // Parametri multipli $ params = array ('width' => 400, 'height' => 300, 'grayscale' => true, 'colorize' => '# ff0000'); $ image = bfi_thumb ('URL-a-immagine.jpg', $ params); In questo articolo abbiamo imparato come rimuovere la nostra dipendenza da TimThumb e passare ad un approccio più orientato verso WordPress per eseguire il ridimensionamento delle immagini usando BFIThumb. Con questo approccio, possiamo eseguire un ridimensionamento flessibile delle immagini e utilizzare anche alcuni dei filtri immagine che abbiamo apprezzato in TimThumb.
Speriamo che questo piccolo script possa aiutarti nella transizione da TimThumb. Se hai suggerimenti per nuove funzionalità per rendere questo script di ridimensionamento delle immagini migliore, lascia un commento qui sotto.
Apprezzo molto qualsiasi commento, commento e suggerimento.
Cosa stai sostituendo con TimThumb? Useresti BFIThumb nel tuo prossimo tema WordPress? Fatemi sapere cosa ne pensate!
