La guida completa alle miniature in primo piano e alle dimensioni dell'immagine in WordPress

Un'immagine vale più di mille parole, a meno che non sia stata ridimensionata in modo inappropriato, nel qual caso è un po 'imbarazzante. WordPress contiene potenti strumenti per ridimensionare immagini e miniature, ma è necessario sapere come gestirli.
Continua a leggere per tutto ciò che devi sapere sulle dimensioni delle immagini in WordPress e gestire le immagini in primo piano.
Modifica di PHP in file WordPress
Questo post contiene codice PHP per WordPress. Potresti voler leggere il nostro corso accelerato PHP gratuito prima di provare qualsiasi modifica sul tuo tema.
Se non ti senti a tuo agio ad aprire i tuoi file tema, o non vuoi perché saranno persi con i futuri aggiornamenti dei temi, puoi usare il plugin My Custom Functions per aggiungere invece i blocchi di codice.
Nozioni di base sulle dimensioni dell'immagine di WordPress
Nel pannello di amministrazione di WordPress, probabilmente conosci già Impostazioni > Media.
Queste sono le tre dimensioni di immagine predefinite, che WordPress chiama: miniatura , media e grande . La dimensione della miniatura ha un'impostazione speciale da ritagliare nella dimensione esatta specificata qui. Non è necessario che sia una dimensione rapporto 1: 1, puoi impostarla come preferisci.
Quando il ritaglio è abilitato, le immagini saranno ridimensionate e centrate, quindi tutto ciò che non va bene verrà scartato.
Le impostazioni medie e grandi funzionano in modo leggermente diverso, in quanto specificerai le dimensioni massime per larghezza e altezza e le immagini verranno ridimensionate di conseguenza. Se l'immagine è troppo piccola, quelle dimensioni dell'immagine non verranno create.
Quando carichi una nuova immagine, l'originale viene salvato e disponibile per l'inserimento in un post a grandezza originale e le altre dimensioni di immagine registrate vengono create automaticamente.
Aggiunta di dimensioni immagine personalizzate in WordPress
Le tre dimensioni definite di default in WordPress potrebbero non essere sufficienti, motivo per cui temi e plug-in possono aggiungere le proprie dimensioni personalizzate. Se sei a tuo agio nel modificare i file del tema, puoi farlo anche tu.
Apri la cartella dei temi e cerca il file functions.php . Aggiungi il seguente codice, uno per ciascuna dimensione dell'immagine che desideri definire:
add_image_size( 'my-thumbnail', 400, 200, true);
Ogni nuova dimensione dell'immagine ha bisogno di un nome, larghezza e altezza, e se le immagini debbano o meno ritagliarsi esattamente a questa dimensione ( vero o falso ). Per le parti strutturali di un tema o di un widget, in genere si vorrebbe ritagliare in modo da non rompere il layout.
Potresti essere tentato di creare molte dimensioni di immagine personalizzate, ma dovresti farlo con parsimonia. Ogni dimensione dell'immagine che definisci verrà generata per ogni singola immagine che carichi, anche se l'hai intesa solo per noi con l'immagine in primo piano.
Quindi, se hai sette dimensioni di immagine personalizzate, più le tre di default, ogni immagine caricata genererà 10 piccole copie di se stesso. Se consideri che un singolo post possa contenere 10 immagini, 100 file vengono creati solo per quel post.
Non è possibile creare una dimensione immagine personalizzata e specificarla dovrebbe essere utilizzata solo per le immagini presenti.
Inoltre, anche se non usi più una certa dimensione personalizzata e hai cancellato quel codice (o cambiato temi), le vecchie immagini rimarranno sul server per sempre. WordPress non cancellerà le immagini inutilizzate per te. Su un sito vecchio o grande come MakeUseOf, ciò significa che alcune centinaia di gigabyte sono sprecate per la memorizzazione di immagini che non vengono più utilizzate.
Per i siti più piccoli, il plugin Media Cleaner può essere d'aiuto, ma eseguire sempre un backup completo.
Dimensioni immagine personalizzate da utilizzare nei contenuti dei post
Per impostazione predefinita, le dimensioni personalizzate dell'immagine non vengono visualizzate nella casella a discesa quando si inserisce un'immagine in un post. L'unica cosa che vedrai è Miniatura, Media, Grande e Dimensione Completa (a seconda delle dimensioni dell'immagine originale, poiché non sarà ingrandita).
Se vuoi che anche le dimensioni personalizzate siano nell'elenco, avremo bisogno di un po 'più di codice. Di nuovo, aggiungi al tuo file functions.php :
function image_sizes_to_mediapicker( €default_sizes ) { return array_merge( €default_sizes, array( 'my-thumbnail' => __( 'My Thumbail Size' ), ) ); } add_filter( 'image_size_names_choose', 'image_sizes_to_mediapicker' );
Funziona filtrando l'elenco di selezione dei media. Uniamo l'array della lista delle dimensioni originali con qualsiasi nuova dimensione che vogliamo anche elencata. Cambia "my-thumbnail" e "My Thumbnail Size" alla tua dimensione personalizzata, e il nome descrittivo leggibile dall'uomo che vorresti elencasse come.
Opzioni di immagine in primo piano di WordPress
Le immagini in evidenza sono una singola immagine associata a un post, ma non necessariamente inserite nel contenuto del post. Sono spesso usati dai temi nell'intestazione, nella prima pagina o nella barra laterale. Tuttavia, in termini di ridimensionamento delle immagini, non vengono trattati in modo diverso rispetto alle immagini normali.
Per ogni dimensione definita, qualsiasi immagine caricata verrà duplicata e ridimensionata, inclusa l'immagine in primo piano.
Se non vedi l'opzione per impostare l'immagine in primo piano nella scherma
ta di modifica del post, è possibile che il tuo tema non supporti la funzione. Puoi forzare il supporto aggiungendo la seguente riga al file functions.php del tuo tema, ma ti suggerisco caldamente di trovare un nuovo tema.
La mancanza di supporto per qualcosa di così fondamentale come le immagini in primo piano sarebbe indicativa di un codice obsoleto altrove.
add_theme_support('post-thumbnails');
Per utilizzare l'immagine in primo piano nel tuo tema o plugin, usa la funzione the_post_thumbnail () per emettere il tag immagine:
the_post_thumbnail('my-thumbnail',array('class'=>'my_post_thumbnail_css_class'));
La funzione richiede 2 parametri: la dimensione nominata che stai cercando (in questo caso "my-thumbnail") e tutti gli attributi che vuoi passare, come una classe CSS personalizzata.
Se preferisci semplicemente ottenere l'URL effettivo dell'immagine in primo piano rispetto all'HTML richiesto, prova questo (ottenendo la dimensione dell'immagine media in questo esempio):
€thumbnail = wp_get_attachment_image_src(get_post_thumbnail_id(), 'medium'); echo €thumbnail[0];
Rigenerazione delle immagini di anteprima WordPress
Ogni volta che cambi le dimensioni dell'immagine predefinita o crei una dimensione immagine personalizzata, questa verrà applicata solo ai nuovi caricamenti. Tutte le tue immagini esistenti rimangono nelle dimensioni originali.
Se desideri ridimensionare le immagini caricate in precedenza, avrai bisogno di un plug-in. AJAX Thumbnail Rebuild ti consente di selezionare le dimensioni da rigenerare e lentamente lavorerà nel tuo archivio.
Ci sono alcune limitazioni e insidie che dovresti sapere comunque.
Mentre le immagini in primo piano possono essere ridimensionate automaticamente, nessun plug-in può riscrivere i contenuti dei post. Ad esempio, se hai aggiunto un'immagine a un post di grandi dimensioni (che poteva essere 500px alla volta), la modifica della definizione di grandi dimensioni non modifica la dimensione dell'immagine nel post. Rimarrà a 500 px a meno che non si modifichi il post e si reinserisca la stessa immagine con le nuove dimensioni.
Come accennato, se hai molte dimensioni di immagine, genererai molte immagini. Per fortuna, la ricostruzione miniature consente di limitare questo solo alle immagini presenti . Ma ancora una volta, ricorda che questo si applica solo alla tua immagine precedente. Tutti i futuri upload di immagini saranno gestiti da WordPress, il che significa che tutte le dimensioni dell'immagine saranno create per tutto.
Ora sarebbe un ottimo momento per imparare anche la differenza tra JPG e PNG in modo da sapere utilizzare il formato ottimale in futuro.
Porta il tuo sito WordPress al livello successivo
Vuoi modificare il tuo tema WordPress? L'uso del tema delle immagini, dei colori e del posizionamento degli elementi è principalmente definito da CSS e HTML, quindi ti consigliamo di esaminare queste esercitazioni passo-passo per imparare CSS e HTML .
Il tuo sito WordPress si blocca troppo spesso? Stai pagando troppo? Passa a un servizio di hosting noto come InMotion Hosting (sconto speciale MakeUseOf con questo link ) o Bluehost (sconto speciale MakeUseOf con questo link ).
Leggi l'articolo completo: La guida completa alle anteprime e alle dimensioni dell'immagine in primo piano in WordPress
Fonte: Utilizzare