• Resolved Bob

    (@bobk88)


    Title says it all:

    I would like to remove the quotation marks from track titles in the built-in playlist audio player – from both the list and the ‘current item’ – and the track numbers from the playlist.

    I have some basic CSS sleuthing skills with Firebug, but I’m guessing these are js or php issues (?).

    Any help would be much appreciated. My child theme allows for easy insertion of custom php and js, if that would help.

    Thanks,

    Bob

Viewing 14 replies - 1 through 14 (of 14 total)
  • Joshua

    (@marksmith82)

    I would also like to know how to remove the quotation marks in the WordPress playlist. Anybody know?

    Can you provide a link to a page with those showing now?

    Joshua

    (@marksmith82)

    Thread Starter Bob

    (@bobk88)

    A programmer friend helped me figure it out.

    You must edit the file media.php located in the folder wp-includes. The following line numbers are valid as of WordPress 3.9.2, but of course they can change with updates.

    To remove quotes, delete the html code for open quotes and close quotes from lines 1103 and 1115.

    Line 1103 before editing:

    <span class="wp-playlist-item-meta wp-playlist-item-title">& #8220;{{ data.title }}& #8221; </span>

    Line 1103 after editing:

    <span class="wp-playlist-item-meta wp-playlist-item-title">{{ data.title }} </span>

    Line 1115 before editing:

    <span class="wp-playlist-item-title">& #8220;{{{ data.title }}}& #8221;</span>

    Line 1115 after editing:

    <span class="wp-playlist-item-title">{{{ data.title }}}</span>

    Note: Remove the space between the ampersand and the pound sign when searching the code. I put it there only because this forum interpreted the html even when I used the block quote or code markup.

    To remove track numbers, go to line 1208 and change 'tracknumbers' => true, to 'tracknumbers' => false,.

    Here’s the full block of code where the output is specified:

    extract( shortcode_atts( array(
    		'type'		=> 'audio',
    		'order'		=> 'ASC',
    		'orderby'	=> 'menu_order ID',
    		'id'		=> $post ? $post->ID : 0,
    		'include'	=> '',
    		'exclude'   => '',
    		'style'		=> 'light',
    		'tracklist' => true,
    		'tracknumbers' => false,
    		'images'	=> true,
    		'artists'	=> true
    	), $attr, 'playlist' ) );
    Thread Starter Bob

    (@bobk88)

    Oh, and this topic is now resolved.

    Sorry for the extra post – the forum only offers the ‘mark as resolved’ option when you first post, not if you edit after posting.

    I respectfully disagree that this topic is resolved. There should not be a solution that involves editing a WordPress core file. That is a terrible idea, for future people coming for a solution later on – A quick fix sure, but the next update will erase it.

    I can try to come up with a real solution shortly.

    Joshua

    (@marksmith82)

    Thanks to both of you. Craig, if you can come up with a solution that doesn’t involve editing a core file please let me know. If you can’t figure it out I’ll move on to bobk88’s solution. Thanks!

    Thread Starter Bob

    (@bobk88)

    Craig: Calling a solution ‘terrible’ without offering an alternative helps nobody. If you have a solution, then great – I’d love to see it. Otherwise, you’re just trolling.

    My post acknowledged that this solution could change with future updates.

    For newcomers to WP and coding, here are some details:

    Modifications are best done via a child theme, but this is not always possible or feasible. Editing the WP core files, while a last resort, is acceptable if you’re careful and know what you’re doing.

    One of the caveats to the solution I provided is that when the WP core is updated, your edits will be overwritten if/when a new version of the media.php file is installed. (I don’t know how WP updates work, so I don’t know if, say, incremental updates might only include files which have been changed.)

    In addition to line numbers changing if code is added, removed, or modified earlier in the file, the entire implementation of audio players could change at some point, requiring major alterations to this solution or a completely new one (e.g., if new classes are assigned to the track titles, then you can’t use the ones I provided above when searching the code).

    At a minimum, you’ll have to re-edit media.php whenever it’s overwritten.

    Regarding the quotes, in media.php, there’s a javascript which attaches them to song titles and then outputs the result as a single entity, which means -unless I’m missing something- that they cannot be targeted with CSS. In other words, quotes can only be removed via CSS if they’re added via CSS.

    Bottom line: if you know the difference between a text editor and a word processor, and between WP core files and child themes; and are aware that a single typo can wreak havoc with a web site; and are aware of the above caveats, then the solution I provided is perfectly safe, if less than ideal.

    Sorry for the delay – Here is a solution you can use via your child theme functions.php. I tested and it works fine and you won’t lose your changes on an update. You can also use this as a plugin if you want to be less theme dependent.

    add_action( 'wp_playlist_scripts', 'wscr_wp_playlist_scripts' );
    
    function wscr_wp_playlist_scripts()
    {
        remove_action( 'wp_footer', 'wp_underscore_playlist_templates', 0 );
        add_action( 'wp_footer', 'wscr_wp_underscore_playlist_templates', 0 );
    }
    
    // Custom template
    function wscr_wp_underscore_playlist_templates() {
    ?>
    <script type="text/html" id="tmpl-wp-playlist-current-item">
            <# if ( data.image ) { #>
            <img src="{{ data.thumb.src }}"/>
            <# } #>
            <div class="wp-playlist-caption">
                    <span class="wp-playlist-item-meta wp-playlist-item-title">{{ data.title }}</span>
                    <# if ( data.meta.album ) { #><span class="wp-playlist-item-meta wp-playlist-item-album">{{ data.meta.album }}</span><# } #>
                    <# if ( data.meta.artist ) { #><span class="wp-playlist-item-meta wp-playlist-item-artist">{{ data.meta.artist }}</span><# } #>
            </div>
    </script>
    <script type="text/html" id="tmpl-wp-playlist-item">
            <div class="wp-playlist-item">
                    <a class="wp-playlist-caption" href="{{ data.src }}">
                            {{ data.index ? ( data.index + '. ' ) : '' }}
                            <# if ( data.caption ) { #>
                                    {{ data.caption }}
                            <# } else { #>
                                    <span class="wp-playlist-item-title">{{{ data.title }}}</span>
                                    <# if ( data.artists && data.meta.artist ) { #>
                                    <span class="wp-playlist-item-artist"> — {{ data.meta.artist }}</span>
                                    <# } #>
                            <# } #>
                    </a>
                    <# if ( data.meta.length_formatted ) { #>
                    <div class="wp-playlist-item-length">{{ data.meta.length_formatted }}</div>
                    <# } #>
            </div>
    </script>
    <?php
    }

    And in regards to removing track numbers – Instead of changing one of the default shortcode values, just set that shortcode value in your post editor. Switch to the text tab in your post and your playlist should be wrapped in something like

    [playlist ids="xxx"]

    Just change it to:

    [playlist ids="xxx" tracknumbers="false"]

    Thread Starter Bob

    (@bobk88)

    Thanks so much for all this, Craig!

    Before starting this thread, I checked the Codex re: the Audio Shortcode, which says the basic features supported are src, loop, autoplay, and pre-load. I was disappointed that track numbers couldn’t be toggled off, so it’s great to know that it actually can be done here. It’d be nice if the Codex were updated to include this info.

    As for the plugin, are you saying your code could be pasted as-is into a basic plugin without any additional code aside from the standard header and license (as described here)?

    Thanks again!

    -Bob

    As for the plugin, are you saying your code could be pasted as-is into a basic plugin without any additional code aside from the standard header and license (as described here)?

    Yes, you can add the required plugin comments above the provided code and make sure it is in a uniquely-named directory that matches the new php file name and then you can drop it into your plugins directory and activate it in your dashboard. The path to the file containing the code should look similar to this:

    /wp-content/plugins/your-unique-name/your-unique-name.php

    Joshua

    (@marksmith82)

    Great. I copied and pasted your code right into my function.php file and the quotation marks are gone. Thanks a lot!

    @ Craig Ralston, Thank you for the tip to remove the numbers in the audio playlist.

Viewing 14 replies - 1 through 14 (of 14 total)
  • The topic ‘How to remove quote marks and numbers from track titles in audio playlist player’ is closed to new replies.