X

Métaboxe personnalisée listant tous les fichiers audio de la médiathèque

Snippets by IsItWP

Vous cherchez un moyen d’ajouter une métabox au menu de l’écran d’édition de votre article contenant tous les fichiers audio ? Bien qu’il existe probablement un plugin pour cela, nous avons créé un extrait de code rapide que vous pouvez utiliser pour ajouter une métabox personnalisée listant tous les fichiers audio de la bibliothèque de médias dans WordPress.

Instructions:

Tout ce que vous avez à faire est d’ajouter ce code au fichier functions.php de votre thème ou dans un plugin spécifique à votre site:

	add_action("admin_init", "audio_init");
	add_action('save_post', 'save_audio_link');

	function audio_init(){
		add_meta_box("mp3-audio", "MP3 AUDIO", "audio_link", "post", "normal", "low");
		}

	function audio_link(){
		global $post;
		$custom  = get_post_custom($post->ID);
		$link    = $custom["link"][0];
		$count   = 0;

		echo '<div class="link_header">';

		$query_audio_args = array(
			'post_type' => 'attachment',
			'post_mime_type' =>'audio',
			'post_status' => 'inherit',
			'posts_per_page' => -1,
			);

		$query_audio = new WP_Query( $query_audio_args );
		$audio = array();

		echo '<select name="link">';
		echo '<option class="audio_select">SELECT AUDIO FILE</option>';
		foreach ( $query_audio->posts as $file) {
		   if($link == $audio[]= $file->guid){
		      echo '<option value="'.$audio[]= $file->guid.'" selected="true">'.$audio[]= $file->guid.'</option>';
			 }else{
		      echo '<option value="'.$audio[]= $file->guid.'">'.$audio[]= $file->guid.'</option>';
			 }
			$count++;
		}
		echo '</select><br /></div>';
		echo '<p>Selecting an audio file from the above list to attach to this post.</p>';
		echo '<div class="audio_count"><span>Files:</span> <b>'.$count.'</b></div>';
	}
	function save_audio_link(){
		global $post;
		if (defined('DOING_AUTOSAVE') && DOING_AUTOSAVE){ return $post->ID; }
		update_post_meta($post->ID, "link", $_POST["link"]);
	}

	add_action( 'admin_head', 'audio_css' );
	function audio_css() {
		echo '<style type="text/css">
		.audio_select{
			font-weight:bold;
			background:#e5e5e5;
			}
		.audio_count{
			font-size:9px;
			color:#0066ff;
			text-transform:uppercase;
			background:#f3f3f3;
			border-top:solid 1px #e5e5e5;
			padding:6px 6px 6px 12px;
			margin:0px -6px -8px -6px;
			-moz-border-radius:0px 0px 6px 6px;
			-webkit-border-radius:0px 0px 6px 6px;
			border-radius:0px 0px 6px 6px;
			}
		.audio_count span{color:#666;}
			</style>';
	}

	function audio_file_url(){
		global $wp_query;
		$custom = get_post_custom($wp_query->post->ID);
		echo $custom['link'][0];
	}

Ajoutez cet extrait de code pour afficher l’URL audio spécifiée dans votre fichier de template WordPress.

<? 
        audio_file_url() 
?>

Note : Si c’est la première fois que vous ajoutez des extraits de code dans WordPress, veuillez vous référer à notre guide sur la façon d’ajouter correctement des extraits de code dans WordPress, afin de ne pas casser accidentellement votre site.

Si vous avez aimé cet extrait de code, n’hésitez pas à consulter nos autres articles sur le site comme : 19 meilleurs plugins WordPress pour les photographes et 30 façons de gagner de l’argent avec le blogging en ligne.

Commentaires   laisser une réponse

  1. Michael Wilhelmsen janvier 25, 2014 à 3:45 pm

    Hi Kevin, could you tell me how I can get the URL to display as an audio shortcode in my theme?

  2. Hi,

    First this is brilliant, I think something like this should be part of wordpress’s core functionality.

    I’ve been looking at this too see if I can use it as guide for something I’m doing. I’m wondering if there’s a way to adapt this to show link categories rather than media files? Meta boxes with checks and fields I’m familiar with, but drop downs are new for me, and I’m playing around with get_terms(link_category) but its a bit over me on how to work it into a solution like this.

    Any ideas? If not, that’s alright.

    Thanks!

    1. Hi Jen,
      What is it that you are trying to do ? if you send me a quick email about it I should be able to help you get things going.
      http://wpsnipp.com/index.php/contact/

  3. Thank you so much! This is exactly what I needed!

    1. Hey Doug, cool  glad you like the snippet.

  4. Hie,
    Thanks for your post.
    I have a question : how display file name instead of file url.
    Sorry for my bad english.
    Anne

    1. Hi Anne, You will notice on line 24 & 26 – $file->guid change the second instance on each line or guid to post_title eg:   $file->post_title

      line 24
      ———-

      echo ‘guid.'” selected=”true”>’.$audio[]= $file->guid.”;

      to
      echo ‘guid.'” selected=”true”>’.$audio[]= $file->post_title.”;

      line 26:
      ———–
      echo ‘guid.'”>’.$audio[]= $file->guid.”;

      to
      echo ‘guid.'”>’.$audio[]= $file->post_title.”;

      1. Hie Kevin,
        Thanks a lot for your help !
        Anne

        1. No problem Anne enjoy the wordpress snippets,

  5. well, nice tips.Is there any sample site that already success to use your script?

    1. Its hard to know because a lot of people like this snippet, but since its an admin snippet it is hard to tell.

  6. Hi Kevin, I have a request which may also relate to this article. I hope you could take a look at it and consider if you could publish an article about it.

    My users use custom fields to attach files such as pdf, word, etc. to their posts. It would be wonderfull if I could make it alittle easier for the readers to understan that this is a file rather than a link to other sites by adding an icon to the left side of the file title automatically.
    For example, a user uploads a pdf file and bellow the content (front-end) there is the files title and a pdf icon beside the title. I usually use Custom Field Template plugin.

    I appreciate your concern.

    1. Hi Zeb you can do this type of thing with javascript,
      http://cool-javascripts.com/jquery/add-icons-to-your-links-automatically-using-jquery-css.html

      Works very well.  however ill look into an updated version of this snippet as well.

      1. Thanks for the reply Kevin.
         
        As you already have stated, it needs an update. It uses jQuery 1.2.6 which is outdated and I’m not quite sure if it is optimated for WordPress and security issues. It would be kind of you if you could publish an update for this.  

        Cheers

        1. Hi Zeb,
          Ill post an update soon, however it does not use JQuery, so that should not be a problem.

Ajouter un commentaire

Nous sommes heureux que vous ayez choisi de laisser un commentaire. N'oubliez pas que tous les commentaires sont modérés conformément à notre privacy policy, et que tous les liens sont en nofollow. N'utilisez PAS de mots-clés dans le champ du nom. Engageons une conversation personnelle et constructive.

WordPress Launch Checklist

L'ultime liste de contrôle pour le lancement de WordPress

Nous avons rassemblé tous les éléments essentiels de la liste de contrôle pour le lancement de votre prochain site Web WordPress dans un ebook pratique.
Oui, envoyez-moi le gratuit !