Condivisione dell'amore WordPress con allegati multimediali non immagine

Mentre WordPress visualizza facilmente le immagini allegate alle tue pagine e ai tuoi post (anche senza un attachment.php file), gli altri tipi di media consentiti (audio, video, documenti, testo, archivio, codice, interattivo) non ottengono lo stesso amore: salvare un collegamento diretto al file allegato. Tuttavia, non è necessario ricorrere al caricamento di audio, video o altri allegati multimediali non immagine altrove (come YouTube) per visualizzarli sul tuo sito WordPress. Come esempio del tema predefinito di Twenty Eleven, ti mostrerò le funzioni incorporate di WordPress per condividere l'amore con gli allegati multimediali non immagine.

---

Come WordPress gestisce gli allegati per impostazione predefinita

Sotto il cofano, gli articoli multimediali sono solo WordPress messaggi, pertanto, vengono visualizzati in base alla gerarchia dei modelli di WordPress. Il caricatore di modelli esegue un controllo per verificare se il post è un allegato e ha un modello di allegato. Se un modello di allegato non esiste, WordPress tornerà al modello di singolo post o al valore predefinito index.php modello (se il modello di singolo post non esiste).

Verifica modello

Nel singolo post o index.php modelli, i temi di WordPress probabilmente mostreranno il contenuto usando il contenuto. Questa funzione ha un filtro predefinito collegato ad esso - prepend_attachment - che aggiungerà automaticamente un collegamento all'allegato alla pagina (usando il wp_get_attachment_link funzione) se determina che questo è un post di allegato. Tuttavia, gli argomenti utilizzati qui nella chiamata a wp_get_attachment_link fornirà solo la visualizzazione effettiva per gli allegati delle immagini: i file di allegati senza immagini avranno solo un collegamento diretto al file allegato. (Dov'è l'amore?) Potremmo potenzialmente mostrare più di un semplice link per allegati non-immagine con un semplice cambio di argomenti wp_get_attachment_link, ma sfortunatamente non abbiamo un modo per cambiare gli argomenti prima che la funzione venga chiamata.

Display allegato immagine predefinito e display allegato non immagine predefinito

Quindi diamo un'occhiata a ciò che noi può fai per mostrare ai nostri attaccamenti di non immagine un certo amore.

---

Prendendo il controllo del display dell'allegato del supporto non dell'immagine

Passaggio 1 Determinare il tipo di file

La prima cosa che faremo è determinare il tipo di file dell'allegato. WordPress consente il caricamento di diversi tipi di file, trovati in get_allowed_mime_types funzione mostrata sotto.

Tipi di file consentiti predefiniti

Sebbene la schermata di amministrazione della libreria multimediale mostri solo i filtri per i tre tipi di file predefiniti, la pagina Modifica per ciascun elemento multimediale mostra il tipo di file esatto. Il tipo di file è nel formato MIME (MIME è uno standard di lunga data per la classificazione dei tipi di file su Internet) che ha due parti: tipo e sottotipo separati dal /. Nell'immagine sottostante, il tipo è "video" e il sottotipo è "mp4". Questa conoscenza sarà utile per il passaggio 2.

Tipi di file predefiniti visualizzati nella libreria multimediale
Tipi di file visualizzati nella pagina di modifica dei media

Funzione WordPress integrata

WordPress ha una funzione integrata per determinare il tipo di file di un allegato usando l'ID del post allegato.

get_post_mime_type ($ ID)

Questa funzione restituirà il tipo di file in formato MIME, proprio come è mostrato nella pagina di modifica dell'oggetto multimediale nell'admin.
Ora siamo pronti a prendere il controllo della visualizzazione di allegati non immagine nei nostri file modello di tema.

Passaggio 2 Creare un file modello di tema

Gerarchia dei modelli

Come mostrato nell'immagine, la gerarchia dei modelli di WordPress ha quattro possibili modelli di allegati che cercherà dopo aver determinato che stiamo visualizzando un post di allegato. Possiamo gestire la visualizzazione di ogni tipo di file nel attachment.php file o possiamo creare file modello separati per ogni tipo MIME e / o sottotipo MIME. Diamo un'occhiata a queste opzioni.

Opzione 1. file allegato.php

Siamo in grado di gestire la visualizzazione di ogni tipo di file in attachment.php usando il nostro pratico get_post_mime_type funzione.

Innanzitutto, otterremo il tipo di file dell'allegato (mentre all'interno del ciclo):

ID); ?>

Quindi, possiamo eseguire un'istruzione switch sul tipo di file per fornire il codice per visualizzare ciascun tipo:

Quindi, se desideriamo visualizzare gli allegati audio (mp3) e video (mp4), la nostra istruzione switch dovrebbe essere simile a questa:

utilizzando attachment.php è grandioso se hai solo pochi tipi di file da visualizzare (o il tuo display per ogni tipo di file seguirà lo stesso layout di base) in quanto ci consente di mantenere il nostro codice in un unico file. Se disponiamo di diversi tipi di file e / o pensiamo di personalizzare il layout di visualizzazione per ogni tipo di file, ti consigliamo di dare un'occhiata all'opzione 2.

opzione 2. $ mimetype.php, $ mimesubtype.php, o $ mimetype_$ mimesubtype.php

attachment.php è in realtà il modello di riserva per i file di modello con il nome del tipo MIME o sottotipo MIME del post di allegato corrente. WordPress cercherà i file con nomi come $ mimetype.php, $ mimesubtype.php, o $ mimetype_$ mimesubtype.php prima di ricorrere a attachment.php.

Quindi, invece di chiamare get_post_mime_type e usando un'istruzione switch, possiamo semplicemente creare un file template con il nome del tipo o sottotipo MIME:

• audio.php
• mpeg.php
• audio_mpeg.php

e posizionare il codice per visualizzare quel tipo di file.

Nota: I nomi dei file sono elencati nell'ordine in cui WordPress li chiamerà. Così $ mimetype.php prima, quindi fallback $ mimesubtype.php, quindi effettuare il fallback $ mimetype_$ mimesubtype.php.

Ora diamo un'occhiata ad alcuni esempi.

---

Esempi

Visualizzazione dei documenti

Non so voi, ma personalmente non mi piace dover scaricare un documento sul mio computer solo per vederlo. Cerchiamo di ottenere l'aiuto del visualizzatore di documenti di Google incorporabile. Può visualizzare PDF, fogli di lavoro, presentazioni e molti altri tipi di file elencati nella Guida di Google. Non è necessario che i tuoi documenti siano ospitati su Google Docs poiché incorpori un visualizzatore direttamente nella pagina passandogli un URL di file e impostando il parametro incorporato su true.

Ecco come gestiremo la visualizzazione dei documenti utilizzando il Visualizzatore di Google Documenti in attachment.php dopo aver ottenuto il tipo di file:

 switch ($ type) case 'application / pdf': case 'application / msword':?>   
Oppure, potremmo creare uno dei seguenti file modello:
 
 
application.php
 
pdf.php
 
application_pdf.php
 
 
e inserisci il seguente codice nel punto in cui desideri visualizzare il contenuto all'interno del ciclo:
 
 
 
Si noti che stiamo passando l'URL del file allegato al visualizzatore di Google Documenti utilizzando il wp_get_attachment_url funzione.
 
Risultato finale:
  
Audio
 
Per visualizzare (riprodurre) i file audio caricati su WordPress e offrire un'esperienza coerente per il cross-browser, faremo ricorso alla libreria leggera audio.js che ci consente di utilizzare HTML5 Audio taggati ovunque, tornando a lampeggiare nei browser che non supportano ancora l'audio HTML5.
 
Innanzitutto, scarica e posiziona il file audio.js file nel tuo tema. Quindi, nel tuo functions.php file, aggiungi il codice per accodare il file audio.js javascript solo sulle pagine degli allegati (seguendo le migliori pratiche). Sono sicuro che ci sono altri modi per farlo, incluso l'uso consigliato wp_enqueue_scripts azione e alcune dichiarazioni condizionali - tuttavia, illustrerò il metodo in questo articolo: Suggerimento rapido: compresi JavaScript e CSS solo su determinate pagine del sito
 
 add_filter ('attachment_template', 'ncb_attachment_template'); function ncb_attachment_template ($ template_path) wp_enqueue_script ('audio-js', get_template_directory_uri (). '/js/audiojs/audiojs/audio.min.js'); add_action ('wp_head', 'ncb_audio_js'); return $ template_path;  function ncb_audio_js () echo ''; 
 
Quindi, possiamo aggiungere il seguente codice al nostro attachment.php file:
 
   
 
Ecco la nostra dichiarazione completa di switch fino a questo punto:
 
      
Oppure, potremmo creare uno dei seguenti file modello:
 
 
audio.php
 
mpeg.php
 
audio_mpeg.php
 
 
e aggiungi il nostro codice audio all'interno del ciclo in cui vorremmo visualizzare il contenuto:
 
 
 
Nota: Se si utilizzano file modello di tipo file, JavaScript deve essere accodato solo a tali pagine.
 
Risultato finale:
  
video
 
Siamo in grado di visualizzare (riprodurre) i file video caricati su WordPress più o meno come l'audio, tranne per il fatto che avremo bisogno dell'aiuto di Video.js libreria che ci consente di utilizzare HTML5 video taggalo ovunque, tornando a lampeggiare nei browser che non supportano ancora il video HTML5.
 
Proprio come con l'audio, scaricheremo i file, li aggiungeremo alla nostra directory dei temi e accodare i file Video.js javascript solo sulle pagine degli allegati, salvo l'aggiunta di un file CSS:
 
 wp_enqueue_script ('video-js', get_template_directory_uri (). '/js/video-js/video.min.js'); wp_enqueue_style ('video-js-css', get_template_directory_uri (). '/js/video-js/video-js.min.css');
 
Ecco il pieno functions.php frammento:
 
 add_filter ('attachment_template', 'ncb_attachment_template'); function ncb_attachment_template ($ template_path) wp_enqueue_script ('audio-js', get_template_directory_uri (). '/js/audiojs/audiojs/audio.min.js'); add_action ('wp_head', 'ncb_audio_js'); wp_enqueue_script ('video-js', get_template_directory_uri (). '/js/video-js/video.min.js'); wp_enqueue_style ('video-js-css', get_template_directory_uri (). '/js/video-js/video-js.min.css'); return $ template_path;  function ncb_audio_js () echo ''; 
 
Quindi, possiamo aggiungere il seguente codice al nostro attachment.php file:
 
  ';  
Ecco la nostra dichiarazione completa:
 
      ';  
Oppure, potremmo creare uno dei seguenti file modello:
 
 
video.php
 
mp4.php
 
video_mp4.php
 
 
e aggiungi il nostro codice video all'interno del ciclo in cui vorremmo visualizzare il contenuto:
 
 
 
Ricorda: Quando si utilizzano file modello di tipo file anziché attachment.php, sarà necessario modificare il nome del filtro utilizzato per chiamare la funzione che accoda il tuo JavaScript.
 
Risultato finale:
  
 
Sommario
 
Anche gli allegati multimediali non immagine in WordPress hanno bisogno di amore! Utilizzando solo due funzioni di WordPress, è possibile mantenere i file multimediali sul proprio sito e personalizzare la visualizzazione e il layout di qualsiasi tipo di file consentito.
 
Scarica e / o inserisci il codice funzionante su Github.
 
Riferimenti in questo articolo
 
Funzioni di WordPress
 
 
il contenuto
 
prepend_attachment
 
wp_get_attachment_link
 
get_allowed_mime_types
 
get_post_mime_type
 
wp_get_attachment_url
 
 
File modello WordPress
 
 
attachment.php
 
index.php
 
single.php
 
$ mimetype.php
 
$ mimesubtype.php
 
$ mimetype_$ mimesubtype.php
 



		
			
	   
	




Codice