Wordpress automatic external link customization?

Michael_

Michael_

New member
Mar 12, 2013
476
19
0
I'm wondering if anyone knows of a plugin that would automatically check for outbound links in a wordpress post or page and make them a different color than internal links.

I realize I could do this by simply specifying a unique link css class, but hand editing every link in every post I create will be a major pain.

Thanks bros.
 


There are two ways,

One is to utilize the WP External Link Plugin - WordPress › WP External Links « WordPress Plugins

Or if you're a savvy developer, read Terrance's post here 5 Code Snippets for Interacting with WordPress Post Content Effectively

He essentially shows how to convert external links to nofollow, but you can utilize the same code and the preg_replace utility to add custom styling to external links and call it in your theme's css.

Avoid using plugins for something as simple as that. The lower the number of plugins on your site, the better.
 
BlogHue said:
There are two ways,

One is to utilize the WP External Link Plugin - WordPress › WP External Links « WordPress Plugins

Or if you're a savvy developer, read Terrance's post here 5 Code Snippets for Interacting with WordPress Post Content Effectively

He essentially shows how to convert external links to nofollow, but you can utilize the same code and the preg_replace utility to add custom styling to external links and call it in your theme's css.

Avoid using plugins for something as simple as that. The lower the number of plugins on your site, the better.
Click to expand...

Very nice. Thank you.
 
The replace PHP script from that site doesn't work. I don't know much about coding, I'll provide an update when I find the solution.
 
BlogHue said:
Use the plugin then.

The script on that site is meant for setting all external links to nofollow and will require edits at your end to be able to customize the style.
Click to expand...

The code doesn't work as written, not even for rel=nofollow additions. I can see where the calls are being made to change them to class="myoutboundlink" and use CSS class to specify styling, but I don't know enough to fix the coding.

Wish I was fluent in php, but 99% of sites available to learn as a beginner are complete garbage.
 
Michael_ said:
The code doesn't work as written, not even for rel=nofollow additions.
Click to expand...

No worries, here's a short snippet to help you - Add this to your theme's function.php

PHP: 
function external_styling( $content ) {
    return preg_replace_callback( '/<a[^>]+/', 'external_styling_callback', $content );
}     
add_filter( 'the_content', 'external_styling', 99999 );

function external_styling_callback( $matches ) {
    $link = $matches[0];
    $exclude = '('. home_url() .')';
    if ( preg_match( '#href=\S('. $exclude .')#i', $link ) )
        return $link;

    if ( strpos( $link, 'class=' ) === false ) {
        $link = preg_replace( '/(?<=<a\s)/', 'class="externallink" ', $link );
    } elseif ( preg_match( '#class=\S(?!externallink)#i', $link ) ) {
        $link = preg_replace( '#(?<=class=.)#', 'externallink ', $link );
    }

return $link;   
}

This will essentially add a class="externallink" to all outgoing links in your post.

Now open up your css and add something like

Code: 
a.externallink:link {background-color:#B2FF99;}
a.externallink:hover {background-color:#FF704D;}

Notice inline texts don't have a sweet ass background like normal divs, so we can add a bit of padding if we like (Not a lot, just 1 or 2px to get the background etc, to show.)
 
You must log in or register to reply here.
Top Bottom