Bien que WordPress affiche facilement les images jointes à vos pages et à vos publications (même sans pièce jointe.php fichier), les autres types de supports autorisés (audio, vidéo, document, texte, archive, code, interactif) ne reçoivent pas le même amour - enregistrez un lien direct vers le fichier joint. Toutefois, vous n'avez pas besoin de télécharger vos fichiers audio, vidéo ou autres pièces jointes multimédia sans image ailleurs (comme YouTube) pour les afficher sur votre site WordPress. En prenant comme exemple le thème par défaut de Twenty Eleven, je vais vous montrer les fonctions intégrées de WordPress pour partager l'amour avec des pièces jointes multimédias autres que des images..
Sous le capot, les éléments multimédias ne sont que WordPress des postes, Par conséquent, ils sont affichés selon la hiérarchie des modèles WordPress. Le chargeur de modèles vérifie si la publication est une pièce jointe et possède un modèle de pièce jointe. Si un modèle de pièce jointe n’existe pas, WordPress utilisera le modèle de publication unique ou le modèle par défaut. index.php modèle (si le modèle de publication unique n'existe pas).
Dans le post unique ou index.php modèles, les thèmes WordPress afficheront probablement le contenu en utilisant le contenu
. Cette fonction est associée à un filtre par défaut - prepend_attachment
- qui ajoutera automatiquement un lien de pièce jointe à la page (en utilisant le wp_get_attachment_link
fonction) s’il détermine qu’il s’agit d’un message en pièce jointe. Cependant, les arguments utilisés ici dans l'appel à wp_get_attachment_link
ne fournira l'affichage réel que pour les pièces jointes d'image - les fichiers de pièce jointe non-image obtiennent uniquement un lien direct vers le fichier joint. (Où est l'amour?) Nous pourrions potentiellement afficher plus qu'un simple lien pour les pièces jointes non-image avec un simple changement d'arguments wp_get_attachment_link
, mais malheureusement, nous n'avons pas le moyen de changer les arguments avant d'appeler la fonction.
Alors regardons ce que nous pouvez faire pour montrer un peu d'amour à nos pièces jointes non-image.
La première chose à faire est de déterminer le type de fichier de la pièce jointe. WordPress permet le téléchargement de plusieurs types de fichiers, trouvés dans le get_allowed_mime_types
fonction indiquée ci-dessous.
Bien que l'écran d'administration de la médiathèque ne contienne que des filtres pour les trois types de fichiers par défaut, la page Éditer de chaque élément de média indique le type de fichier exact. Le type de fichier est au format MIME (MIME est une norme de longue date pour la classification des types de fichiers sur Internet) qui comporte deux parties: le type et le sous-type séparés par le /. Dans l'image ci-dessous, le type est "vidéo" et le sous-type est "mp4". Cette connaissance sera utile pour l'étape 2.
WordPress possède une fonction intégrée permettant de déterminer le type de fichier d'une pièce jointe à l'aide de l'ID de pièce jointe.
get_post_mime_type ($ ID)
Cette fonction renverra le type de fichier au format MIME, comme indiqué sur la page d'édition de l'élément multimédia dans l'admin..
Nous sommes maintenant prêts à prendre le contrôle de l'affichage des pièces jointes autres que des images dans nos fichiers de modèles de thème..
Comme le montre l'image, la hiérarchie de modèles WordPress contient quatre modèles de pièces jointes qu'il recherchera après avoir déterminé que nous affichons une publication en pièce jointe. Nous pouvons soit gérer l’affichage de chaque type de fichier dans le pièce jointe.php fichier ou nous pouvons créer des fichiers de modèle séparés pour chaque type et / ou sous-type MIME. Jetons un coup d'oeil à ces options.
Nous pouvons gérer l’affichage de chaque type de fichier dans pièce jointe.php en utilisant notre pratique get_post_mime_type
une fonction.
Tout d’abord, nous allons obtenir le type de fichier de la pièce jointe (dans la boucle):
ID); ?>
Ensuite, nous pouvons faire une instruction switch sur le type de fichier pour fournir le code permettant d'afficher chaque type:
Donc, si nous souhaitons afficher des pièces jointes audio (mp3) et vidéo (mp4), notre déclaration de commutateur ressemblerait à ceci:
En utilisant pièce jointe.php C'est génial si vous n'avez que quelques types de fichiers à afficher (ou si votre affichage suit la même présentation de base) car cela nous permet de conserver notre code dans un seul fichier. Si nous avons plusieurs types de fichiers et / ou si vous envisagez de personnaliser la disposition de l'affichage pour chaque type de fichier, vous voudrez peut-être examiner l'option 2..
$ mimetype
.php, $ mimesubtype
.php, ou $ mimetype
_$ mimesubtype
.phppièce jointe.php
est en fait le modèle de secours pour les fichiers de modèle portant le nom du type MIME ou du sous-type MIME de la publication de la pièce jointe actuelle. WordPress recherchera des fichiers avec des noms comme $ mimetype
.php, $ mimesubtype
.php, ou $ mimetype
_$ mimesubtype
.php avant de retomber sur pièce jointe.php.
Donc, au lieu d'appeler get_post_mime_type
et en utilisant une instruction switch, nous pouvons simplement créer un fichier de modèle avec le nom du type ou du sous-type MIME:
et placez le code pour afficher ce type de fichier.
Remarque: Les noms de fichiers sont répertoriés dans l'ordre dans lequel WordPress les appellera. Alors $ mimetype
.php d'abord, puis retomber sur $ mimesubtype
.php, puis retomber sur $ mimetype
_$ mimesubtype
.php.
Maintenant, regardons quelques exemples.
Je ne sais pas pour vous, mais personnellement, je n'aime pas avoir à télécharger un document sur mon ordinateur uniquement pour le visualiser. Faisons appel à l'aide de la visionneuse Google Docs intégrable. Il peut afficher des fichiers PDF, des feuilles de calcul, des présentations et de nombreux autres types de fichiers répertoriés dans l'aide de Google. Il n'est pas nécessaire que vos documents soient hébergés sur Google Documents, car ce dernier intégrera un visualiseur directement dans la page en lui transmettant une URL de fichier et en définissant le paramètre incorporé sur true..
Voici comment gérer l'affichage des documents à l'aide de Google Docs Viewer dans pièce jointe.php après avoir obtenu le type de fichier:
switch ($ type) case 'application / pdf': case 'application / msword':?>Ou, nous pourrions créer l'un des fichiers de modèle suivants:
et placez le code suivant à l'endroit où vous souhaitez afficher le contenu dans la boucle:
Notez que nous transmettons l'URL du fichier joint au visualiseur Google Docs à l'aide de l'outil wp_get_attachment_url
une fonction.
Résultat final:
Pour afficher (lire) des fichiers audio téléchargés sur WordPress et fournir une expérience cohérente sur plusieurs navigateurs, nous allons faire appel à la bibliothèque légère audio.js qui nous permet d’utiliser le logiciel HTML5. l'audio
taguer n'importe où, en revenant au flash dans les navigateurs qui ne supportent pas encore l'audio HTML5.
Tout d’abord, téléchargez et placez le audio.js fichiers dans votre thème. Ensuite, dans ton functions.php fichier, ajoutez le code pour mettre en file d'attente le audio.js javascript uniquement sur les pages de pièces jointes (conformément aux meilleures pratiques). Je suis sûr qu’il existe d’autres moyens de le faire, y compris l’utilisation recommandée. wp_enqueue_scripts
action et quelques déclarations conditionnelles - cependant, je vais illustrer la méthode dans cet article: Astuce: Inclure JavaScript et CSS uniquement sur certaines pages de site
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; fonction ncb_audio_js () echo '';
Ensuite, nous pouvons ajouter le code suivant à notre pièce jointe.php fichier:
Voici notre déclaration complète de commutateur jusqu'à ce point:
Ou, nous pourrions créer l'un des fichiers de modèle suivants:
et ajoutez notre code audio dans la boucle où nous aimerions afficher le contenu:
Remarque: Si vous utilisez des fichiers modèles de type de fichier, JavaScript doit uniquement être mis en file d'attente sur ces pages..
Résultat final:
Nous pouvons afficher (lire) les fichiers vidéo téléchargés sur WordPress de la même manière que les fichiers audio, sauf que nous allons faire appel à la video.js bibliothèque qui nous permet d'utiliser le HTML5 vidéo
taguer n'importe où, en revenant au flash dans les navigateurs qui ne prennent pas encore en charge la vidéo HTML5.
Comme pour l’audio, nous téléchargerons les fichiers, nous les ajouterons à notre répertoire de thèmes et video.js javascript sur les pages de pièces jointes uniquement, à l'exception du fichier CSS ajouté:
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');
Voici le complet functions.php fragment:
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; fonction ncb_audio_js () echo '';
Ensuite, nous pouvons ajouter le code suivant à notre pièce jointe.php fichier:
';Voici notre déclaration complète de commutateur:
';Ou, nous pourrions créer l'un des fichiers de modèle suivants:
et ajoutez notre code vidéo dans la boucle où nous aimerions afficher le contenu:
Rappelles toi: Lorsque vous utilisez des fichiers modèles de type de fichier au lieu de pièce jointe.php, vous devrez changer le nom du filtre utilisé pour appeler la fonction qui met votre JavaScript en file d'attente.
Résultat final:
Les pièces jointes autres que les images dans WordPress ont également besoin d’amour! En utilisant seulement deux fonctions WordPress, vous pouvez conserver vos fichiers multimédia sur votre site et personnaliser l'affichage et la présentation de n'importe lequel des types de fichiers autorisés..
Télécharger et / ou insérer le code de travail sur Github.
Fonctions WordPress
le contenu
prepend_attachment
wp_get_attachment_link
get_allowed_mime_types
get_post_mime_type
wp_get_attachment_url
Fichiers de modèle WordPress
$ mimetype
.php$ mimesubtype
.php$ mimetype
_$ mimesubtype
.php