Add a class to post title if a link ends with a certain extension

I am using a Page Links To plugin that allows me to link the post title to an external web page, rather than to the content of the post. And I link some of the post titles to external pages, and others – to pdf files, stored in the uploads folder of my site.

I want to add a little pdf icon to those post titles that are linked to pdf files. To be able to do so, I want to add .pdf class to those post titles whose links end with .pdf.

Read More

Here’s how the corresponding part of the page source looks:

<article id="post-123" class="post-123 post type-post status-publish format-standard hentry category-news">
            <header class="entry-header">
                                <h1 class="entry-title">
            <a href="http://www.mysite.com/path/to/directory/pdfs/mypdffile.pdf" title="My WordPress Post Title" rel="bookmark">My WordPress Post Title</a>
        </h1>


    </header><!-- .entry-header -->

            <div class="entry-content">
                            </div><!-- .entry-content -->

    <footer class="entry-meta">
        <a href="http://www.mysite.com/path/to/directory/pdfs/mypdffile.pdf" title="1:19 pm" rel="bookmark"><time class="entry-date" datetime="2013-04-23T13:19:30+00:00">April 23, 2013</time></a> 
            </footer><!-- .entry-meta -->
</article><!-- #post -->

What would be the best way to do that in WordPress?

Related posts

Leave a Reply

1 comment

  1. There is no need to add anything via WordPress, you can simple add the following rule to your CSS file:

    a[href$='.pdf'] {}
    

    This will target all links pointing to a URI ending in .pdf. This works in all modern browsers and from IE7 upwards.