Immagini e altri file multimediali sono una parte importante di qualsiasi sito WordPress. Per utilizzarli nel modo migliore, è utile avere una conoscenza approfondita del funzionamento della libreria media di WordPress.
Questa pratica funzionalità di WordPress consente di memorizzare e gestire nel tempo le immagini e gli altri media. Con un po’ di esperienza e qualche semplice trucco, potrete migliorare molto il vostro sito grazie alla Libreria Media.
In questa guida approfondita vi diremo tutto quello che c’è da sapere sulla Libreria Media di WordPress. Vedremo anche come importare e scaricare i contenuti. Tratteremo anche l’editing delle immagini, la gestione dei file a lungo termine e vi offriremo quattro hack per aggiungere funzionalità avanzate.
Cominciamo!
Introduzione alla Libreria Media WordPress
Al suo core, la Libreria Media di WordPress è esattamente ciò che il suo nome lascia intendere: un catalogo di tutti i file (per esempio la favicon del vostro sito) multimediali che avete caricato sul vostro sito:
WordPress supporta una varietà di tipi di media, tra cui:
- Immagini (. jpg, . jpeg, . png, . gif, e . ico).
- File audio (.mp3, .m4a, . ogg, e . wav).
- Video (.mp4, .m4v, . mov, . wmv, . avi, . mpg, . ogv, .3gp, e .3g2).
- PDF.
- Documenti di Word.
- Fogli di calcolo Excel.
- Presentazioni in PowerPoint.
- Documenti Adobe Photoshop.
Ha anche alcune limitate capacità di photo-editing, permettendovi di effettuare le regolazioni necessarie direttamente dalla bacheca.
Purtroppo, WordPress non supporta ancora le immagini webp.
Per accedere alla vostra Libreria Media, vi basta cliccare su Media nella barra laterale del pannello di amministrazione:
Qui sono disponibili alcune opzioni di base.
Per prima cosa, potete stabilire se vedere i vostri file in una lista o in una griglia cliccando sulle rispettive icone:
Potete anche filtrare i file utilizzando i menu a tendina:
Il primo menu vi permette di visualizzare i vostri media per tipo, mentre il secondo filtrerà i contenuti della libreria in base alla data in cui sono stati caricati.
Potete anche utilizzare la barra di ricerca per cercare file specifici in base al nome:
Infine, c’è anche un pulsante Selezione multipla. Questa funzione consente di eliminare dall’installazione di WordPress più file in una volta:
Questo è tutto sulle funzionalità native disponibili nella schermata della libreria media di WordPress.
Come vedremo più avanti, potete fare molte modifiche per migliorarla. Prima, però, dobbiamo vedere come aggiungere file a WordPress.
Come Aggiungere File alla Libreria Media di WordPress
Esistono diversi modi per aggiungere file (ad esempio la favicon del sito) alla libreria multimediale di WordPress. Il primo è quello di andare su Media > Aggiungi nuovo:
Qui potete caricare i file che avete salvato sul computer o su un altro dispositivo:
Potete anche aggiungere i media direttamente dall’editor di WordPress. Nell’Editor a Blocchi, iniziare aggiungendo il blocco corrispondente al tipo di supporto che volete incorporare:
Nel segnaposto che vi appare, selezionate Carica e scegliete un file dal computer:
In alternativa, potete semplicemente trascinare il file dal desktop nel blocco corrispondente.
Nell’Editor Classico è necessario cliccare sul pulsante Aggiungi Media:
Quindi navigate fino alla scheda Carica e selezionate un file dal computer:
È inoltre possibile trascinare e rilasciare i file dal desktop direttamente nell’editor.
In alcuni casi, potrebbe essere necessario caricare manualmente i file multimediali sul vostro sito WordPress via FTP. Potete farlo utilizzando un client come FileZilla.
Una volta connessi al server, navigate su wp-content > uploads:
Caricate i file in questa directory per aggiungerli alla vostra Libreria Media.
Scaricare Contenuti dalla Libreria Media di WordPress
In alcune circostanze, potrebbe essere necessario scaricare i file dalla Libreria Media sul vostro computer. WordPress consente di farlo nativamente navigando su Strumenti > Esporta:
Quindi selezionate l’opzione Media. Se avete bisogno solo di file che sono stati caricati entro un determinato periodo di tempo, potete utilizzare i menu a tendina per specificare la vostra richiesta:
Infine, fate clic sul pulsante Scarica il file di esportazione. In questo modo saranno scaricati sul vostro computer i relativi file multimediali.
Come Modificare le Immagini Nella Libreria Media di WordPress
Come abbiamo accennato in precedenza, WordPress dispone di alcune funzioni native di editing delle immagini. Per accedervi, navigate nella vostra Libreria Media e selezionate il file che desiderate modificare. Quindi, fate clic sul pulsante Modifica immagine:
Questo aprirà l’editor delle immagini:
Potete fare cinque modifiche di base:
Il ritaglio consente di tagliare sezioni dell’immagine:
Ruotando l’immagine si può ruotare l’immagine di 90 gradi in senso orario o antiorario:
Capovolgendo l’immagine la si rifletterà sia verticalmente che orizzontalmente:
Le altre tre impostazioni sono nella barra laterale. La prima consente di modificare le dimensioni dell’immagine ridimensionandola. Basta inserire l’altezza o la larghezza desiderata e l’altro campo si auto-completa. Poi fate clic sul pulsante Scala:
È importante ricordare che il ridimensionamento delle immagini in WordPress può talvolta influire negativamente sulla qualità.
Inoltre, potete prendere solo immagini di grandi dimensioni e ridurne le dimensioni. Non è possibile scalare le immagini a dimensioni maggiori!
Per ritagliare l’immagine in modo che abbia un rapporto dimensioni o dimensioni specifiche, potete utilizzare i campi Rapporto dimensioni e Selezione nella sezione Ritaglia Immagine:
Infine, se volete conservare la miniatura dell’immagine esistente, potete farlo utilizzando le impostazioni delle miniature. Basta selezionare il pulsante di opzione per stabilire la versione dell’immagine a cui desiderate applicare le modifiche:
L’editing predefinito delle immagini di WordPress è utile ma è limitato. Non può sostituire un qualsiasi software che potreste utilizzare per modifiche più estese, specialmente se gestite un sito di fotografia o un fotoblog.
Comprendere gli Errori della Libreria Media di WordPress
Purtroppo ci sono gli errori di WordPress. E la Libreria Media di WordPress non fa eccezione.
Un problema che si presenta di frequente è un “errore HTTP” non specificato, che può apparire quando si carica un nuovo file dall’interno dell’editor:
Di solito, vi basta semplicemente aspettare che questo errore scompaia e provare di nuovo il caricamento dopo pochi minuti. Se l’errore HTTP si ripresenta, è possibile che la sessione di WordPress sia scaduta. Dovrete effettuare nuovamente il login e poi riprovare il caricamento.
Un altro problema che alcuni utenti si trovano ad affrontare è il mancato caricamento da parte della Libreria Media. Questo è spesso dovuto a un conflitto con i plugin e/o con il tema. Per risolvere questo errore, provate a disattivare tutti i plugin e passare a un tema predefinito di WordPress.
Se la vostra libreria media si carica di nuovo correttamente, dovrete comunque eliminare il conflitto del plugin per risolvere il problema in modo definitivo.
A volte, quando iniziate a caricare i vostri file attraverso la libreria multimediale, potreste incontrare l’errore “Upload: Failed to Write File to Disk“. Di solito questo problema si verifica quando la vostra directory di upload è impostata su Not Writable (non scrivibile). Potete controllare i permessi del vostro filesystem tramite lo strumento Site Health di WordPress.
Gestione a Lungo Termine della Libreria Media
Per quanto riguarda la Libreria Media, finora ci siamo concentrati esclusivamente sulle funzionalità native di WordPress. Tuttavia, se si utilizza regolarmente questa funzionalità, nel tempo è probabile che si verifichino dei problemi che richiedono l’ausilio di soluzioni esterne.
Ad esempio, più file si aggiungono, più la vostra Libreria Media diventerà disorganizzata. A parte le opzioni di ricerca e di filtro descritte all’inizio di questo post, WordPress non è di grande aiuto per gestire volumi di media disorganizzati.
Esistono tuttavia alcuni plugin che consentono di organizzare i file multimediali in cartelle.
Il plugin WordPress Media Library Folders è la soluzione più popolare:
Oltre a consentire la creazione di cartelle di file multimediali, questo plugin si integra con MaxGalleria per consentire di creare gallerie di immagini direttamente dalla Libreria Media:
L’upgrade a WordPress Media Library Folders Pro offre un’integrazione aggiuntiva con i plugin NextGEN Gallery e Advanced Custom Fields. Consente anche di creare categorie e tag per organizzare i file in modo ancora più avanzato.
Un’altra funzionalità che manca a WordPress è la possibilità di sostituire i file multimediali con nuove versioni. Dato che questi tipi di file possono essere abbastanza grandi, non basta semplicemente continuare ad aggiungerne di nuovi ogni volta che si ha bisogno di aggiornare i contenuti.
Ciò significa che, dopo aver caricato un nuovo file, sarà necessario individuare la vecchia versione e cancellarla. Potete risparmiare tempo sostituendo direttamente le vecchie immagini con Enable Media Replace:
Con questo plugin potrete anche sostituire tutti i link che puntano al vecchio file. Questo è utile per evitare la rottura dei link ai media in tutto il sito.
Real Media Library è un altro gestore di cartelle e file che vale la pena controllare per semplificare la vostra gestione dei file.
Grazie a questo plugin, potete prendervi cura di un sacco di file come immagini, video e documenti direttamente in WordPress. Utile da sapere: Real Media Library è disponibile in 12 lingue. Se la versione gratuita non è sufficiente per le vostre esigenze, potete acquistare la versione PRO che include più funzioni.
4 Pratici Hack per la Libreria Media di WordPress
La Libreria Media di WordPress è in grado di gestire la maggior parte delle normali necessità dell’amministratore del sito. Tuttavia, WordPress fornisce una serie di funzioni e di hook che consentono agli utenti di migliorare le funzionalità specifiche della Libreria Media, senza ricorrere a plugin di terze parti. Scopriamo queste funzioni e hook con quattro esempi pratici.
1. Aggiungere Metadati Custom ai Tipi di Post Attachment
Ogni volta che caricate un file multimediale, WordPress genera un tipo di post attachment.
Come ogni altro tipo di post, gli attachment sono memorizzati nella tabella wp_posts, e i rispettivi metadati si trovano nella tabella wp_postmeta del vostro database:
La tabella wp_posts memorizza dati tra cui post_content (descrizione dell’allegato), post_excerpt (didascalia dell’allegato), post_author, post_title, post_status e post_mime_type.
La tabella wp_postmeta memorizza qualsiasi tipo di metadati, come l’URL del file allegato, le dimensioni dell’immagine e i mime type, nonché i metadati in formato EXIF (Exchangeable Image File format) e IPTC (International Press Telecommunications Council).
Occasionalmente potrebbe essere necessario aggiungere metadati personalizzati agli allegati, come il nome dell’autore di un documento, un URL associato o il luogo in cui è stata scattata una foto. Aggiungere campi meta agli allegati è un po’ diverso dall’aggiungere campi meta ai post e richiede il ricorso a hook e funzioni specifiche.
Per prima cosa, è necessario aggiungere alla schermata Edit Media tutti i custom field necessari. Potete farlo filtrando i campi attachment disponibili attraverso il filtro attachment_fields_to_edit presente in wp-admin/includes/media.php:
function media_hacks_field_to_edit( $form_fields, $post ){
// https://codex.wordpress.org/Function_Reference/wp_get_metadata
$media_author = get_post_meta( $post->ID, 'media_author', true );
$form_fields['media_author'] = array(
'value' => $media_author ? $media_author : '',
'label' => __( 'Author' )
);
return $form_fields;
}
add_filter( 'fields_to_edit', 'media_hacks_field_to_edit', 10, 2 );La funzione ha due argomenti: l’array $form_fields dei campi del form e l’oggetto $post. Per prima cosa, get_post_meta recupera il valore “media_author” esistente, poi un elemento “media_author” viene aggiunto all’array $form_fields.
Infine, la callback restituisce i campi $form_fields (vedi il codice su Gist).
Nella pagina Modifica media viene visualizzato un nuovo campo, al quale si può accedere selezionando la relativa immagine dalla propria Libreria Media e cliccando sul link Modifica i dettagli aggiuntivi:
Nella schermata risultante, vedrete il vostro nuovo campo di metadati personalizzati in basso:
Il passaggio successivo è il salvataggio dell’input dell’utente. Per questo è necessario agganciare una nuova funzione all’azione edit_attachment:
function media_hacks_edit_attachment( $id ){
if ( isset( $_REQUEST['attachments'][$id]['media_author'] ) ) {
$media_author = $_REQUEST['attachments'][$id]['media_author'];
update_post_meta( $id, 'media_author', $media_author );
}
}
add_action( 'edit_attachment', 'media_hacks_edit_attachment' );
Questa funzione prende un solo argomento: l’$attachment_id del file multimediale corrente. Per prima cosa, la funzione verifica se è stato inviato un valore valido per il metacampo personalizzato. Poi registra il valore grazie alla funzione update_post_meta (si veda il codice su Gist).
Ora è possibile recuperare il valore ‘media_author’ grazie alla funzione get_post_meta:
$media_author = get_post_meta( $post->ID, 'media_author', true );Dopo di che, potrete visualizzarlo in qualsiasi punto del frontend.
2. Visualizzare i Metadati EXIF e IPTC nella Schermata Modifica Media
WordPress memorizza automaticamente i metadati estesi per i mime type JPEG e TIFF. Ora che sapete come aggiungere campi alla schermata Modifica Media via media.php, potete visualizzare questi dati.
Per farlo, è necessario modificare la prima funzione di callback come segue:
function media_hacks_fields_to_edit( $form_fields, $post ){
// get post mime type
$type = get_post_mime_type( $post->ID );
// get the attachment path
$path = get_attached_file( $post->ID );
// get image metadata
$metadata = wp_read_image_metadata( $path );
if( 'image/jpeg' == $type ){
if( $metadata ) {
$exif_data = array(
'aperture' => 'Aperture',
'camera' => 'Camera',
'created_timestamp' => 'Timestamp',
'focal_length' => 'Focal Length',
'iso' => 'ISO',
'shutter_speed' => 'Exposure Time',
'orientation' => 'Orientation' );
foreach ( $exif_data as $key => $value ) {
$exif = $metadata[$key];
$form_fields[$key] = array(
'value' => $exif ? $exif : '',
'label' => __( $value ),
'input' => 'html',
'html' => "ID][$exif]' value='" . $exif . "' />
);
}
}
}
return $form_fields;
}
add_filter( 'fields_to_edit', 'media_hacks_fields_to_edit', 10, 2 );Questo frammento utilizza le seguenti funzioni di WordPress:
- get_post_mime_type recupera il mime type di un allegato in base all’ID.
- get_attached_file recupera il percorso del file allegato in base all’ID.
- wp_read_image_metadata preleva i metadati EXIF o IPTC, se disponibili.
Se il mime type dell’immagine è “image/jpeg”, e se i metadati esistono, allora viene dichiarato un array di metadati obbligatori e viene creato un campo del form per ogni elemento dell’array:
I campi del form di questo esempio sono un po’ più complessi perché stiamo impostando un valore per l’elemento ‘html’ del form (si veda il codice su Gist). Non è necessario salvare i metadati EXIF e IPCT, perché WordPress li memorizza automaticamente nella tabella wp_postmeta nel momento in cui si caricano le immagini.
3. Mostrare i Metadati Estesi sul Frontend
Avere tutte queste informazioni per voi stessi sul back-end è utile. Ma, se volete mostrare i metadati estesi dei vostri file multimediali anche sul frontend, dovrete fare un po’ più di ritocchi.
Potete aggiungere queste informazioni alla descrizione dell’allegato utilizzando il filtro the_content in wp-admin/includes/post.php, in questo modo:
function media_hacks_the_content( $content ){
global $post;
if( is_attachment() && 'image/jpeg' == get_post_mime_type( $post->ID ) ) {
$fields = wp_get_attachment_metadata( $post->ID );
$meta = $fields['image_meta'];
if( ! empty( $meta['camera'] ) ){
$custom_content = "
<ul>
<li>Camera: {$meta['camera']}</li>
<li>Created timestamp: {$meta['created_timestamp']}</li>
<li>Aperture: {$meta['aperture']}</li>
<li>Focal length: {$meta['focal_length']}</li>
<li>ISO: {$meta['iso']}</li>
<li>Shutter speed: {$meta['shutter_speed']}</li>
<li>Orientation: {$meta['orientation']}</li>
</ul>";
$content .= $custom_content;
}
}
return $content;
}
add_filter( 'the_content', 'media_hacks_the_content' );Qui viene chiamata la funzione wp_get_attachment_metadata. Se il tipo di post corrente è “attachment”, e se il mime type corrente è “image/jpeg”, allora i metadati immagine disponibili vengono recuperati e utilizzati per costruire un elenco non ordinato di campi, che viene quindi aggiunto in fondo al contenuto del post.
La funzione di callback restituisce $content (questo codice è anche disponibile su Gist):
Qui sopra potete vedere il nuovo post di tipo attachment con i metadati aggiunti alla descrizione.
4. Pubblicare un Archivio di Foto
WordPress non visualizza gli archivi degli allegati. Questo perché l’opzione has_archive del tipo di post attachment è impostata su false.
Inoltre, mentre il parametro predefinito post_status dell’oggetto $query è impostato su “publish”, il post_status predefinito degli allegati è impostato su “inherit”. Questo significa che nessun allegato sarà mostrato negli archivi a meno che non si imposti esplicitamente il post_status della query su “inherit” o “any” (si veda WP_Query Type Parameters per ulteriori informazioni).
Detto questo, per mostrare gli archivi di immagini, bisogna definire due funzioni. La prima funzione filtra gli argomenti di un tipo di post specificato, e imposta la proprietà has_archive dell’allegato al valore true:
function media_hacks_register_post_type_args( $args, $post_type ){
if( $post_type == 'attachment' ){
$args['has_archive'] = true;
}
return $args;
}
add_filter( 'register_post_type_args', 'media_hacks_register_post_type_args', 10, 2 );La seconda funzione imposta valori personalizzati per le variabili della query post_mime_type e post_status:
function media_hacks_pre_get_posts( $query ){
if ( !is_admin() && $query->is_main_query() ) {
if( is_post_type_archive('attachment') ){
$query->set('post_mime_type', 'image/jpeg');
$query->set( 'post_status', 'inherit' );
}
}
}
add_action( 'pre_get_posts', 'media_hacks_pre_get_posts' );
La funzione è agganciata all’action hook pre_get_posts, che viene attivato dopo che la query è stata creata, ma prima che venga eseguita. L’oggetto $query viene passato per riferimento, non per valore, il che significa che qualsiasi modifica all’istanza corrente di $query influenzerà l’oggetto $query originale.
Per questo motivo, è importante verificare quale query si intende modificare (si veda questo codice su Gist). Ora, se inserite https://yourdomain.com/?post_type=attachment nel vostro browser, dovreste vedere un archivio di immagini JPEG:
Il codice completo di tutti questi hack è disponibile come plugin in un Gist pubblico, al quale abbiamo fatto rinvio in diversi punti di questa sezione. Potete scaricarlo come file .zip e caricarlo sul vostro sito WordPress per implementare tutti e quattro questi hack, senza dover modificare manualmente i vostri file.
Riepilogo
Immagini, video, file audio e documenti possono essere estremamente preziosi per gli utenti del vostro sito. La Libreria Media di WordPress è essenziale per caricare, pubblicare e persino modificare questi file e soddisfare le necessità dei vostri contenuti.
Avete domande sulla Libreria Media di WordPress? Fatecelo sapere nella sezione commenti qui sotto!
Carlo è cultore appassionato di webdesign e front-end development. Gioca con WordPress da oltre 20 anni, anche in collaborazione con università ed enti educativi italiani ed europei. Su WordPress ha scritto centinaia di articoli e guide, pubblicati sia in siti web italiani e internazionali, che su riviste a stampa. Lo trovate su LinkedIn.
Lascia un commento