0

Is it possible to add a CSS class to ALL links generated from the HTML tab of the post editor?

That is to have the part class='myclass" added automatically?

<a class="myclass" href="http://www.google.com">Click me</a>

EDIT to avoid misunderstanding: The class has to be added in the editor and not on the fly via javascript or HTML and this is because not all the links will use this class so in the rare case where I don't need it, I simply remove it myself. At the moment I'm doing the complete opposite, I keep adding class="myclass" myself which can be a nuisance in case of a post with 20 or more links.

Improve this question

4 Answers 4

Reset to default
1

It would be more efficient to add a container with a certain class name around content that has been created with the HTML tab. That way you're avoiding the code getting bulky.

Improve this answer
1

you can use:

add_filter('the_content', 'addClassToLinks');
function addClassToLinks($content){
    return str_replace( '<a ', "<a class='myclass'", $content);
}

But i don't recommend it.

Just add in theme an specific class for container of the content. It is cleaner and use in css:

.myclass a {
     // css for a that is fount inside myclass
}
Improve this answer
1

You can use Advanced Tinymce plugin to solve your problem.

This plugin enables the advanced features of TinyMCE, the WordPress WYSIWYG editor. It includes 15 plugins for TinyMCE that are automatically enabled or disabled depending on what buttons are chosen.

You can see demo here.

Improve this answer
1
0

As suggested, just add a container around the content. You do not want to str_replace() or preg_replace() your markup. It is resource expensive and prone to error. So...

<div class="html-content"><?php
  the_content(); ?>
</div>

Then...

.html-content a { }

In fact, chances are you already have markup in your theme similar enough to that for this to work without further change.

You could do the same with a filter:

function add_content_wrapper($content) {
  $content = '<div class="html-content">'.$content.'</div>';
  return $content;
}
add_filter('the_content','add_content_wrapper');
Improve this answer
8
  • I apologise, I should have been more clear. When I said "all" links I didn't mean all of them, in fact there are some links that should not have this class applied. This is why I cannot wrap the code inside an HTML container because some links should NOT have the "myclass" class applied. Which is ultimately why I want the code class="myclass" to appear in the editor after I set the link through the "add link" popup window so that if it's a rare case where the class should not be applied, I simply remove the "myclass" class. Right now I do the opposite, 9 times out of 10 I add the class myself. Commented Jun 27, 2015 at 15:42
  • So what are your conditions for adding the class? Commented Jun 27, 2015 at 16:13
  • It should always be added. But there will be rare cases where I will have to manually remove the class="myclass" code added inside the editor. But this will happen very, very rarely. Commented Jun 27, 2015 at 16:44
  • OK. What cases? Unless you want to do this manually there has to be a logic to it, a pattern. Commented Jun 27, 2015 at 16:46
  • I don't understand. All posts have links and all links should have the code added. There are rare cases where I will not need this code. The rare cases are internal links, links that point to the same domain of the blog. Commented Jun 27, 2015 at 16:58

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.