My client has an incredibly bad habit of adding inline styles to tons of elements on the page. One of the many reasons I was hired to do this job is because of my focus on semantics, yet they still choose to do things like this.

Is there any way to strip style attributes from elements when they submit the entry? I'm currently using WYGWAM, if that helps.


If you jump into your WYGWAM configurations, there are a few settings you can add to aid this errant behavior.

Modules > Wygwam > Edit Configuration

  • ForceAsPlainText
  • EnterMode
  • PasteFromWordRemoveStyles

And a few more dependent on your needs.

I also am in the habit of wrapping any wygwam content inside a <div class="wygwam"> so I can target via CSS any stuff that makes it through.

  • Hi! Hmm, ForceAsPlainText and PasteFromWordRemoveStyles both seem to clean pasted text, and EnterMode seems to manage what happens when you hit "Enter". How would I use these to strip style attributes? Feb 7 '13 at 13:14
  • That reply was more how to stop style attributes making it into the entry. To remove already existing content, you could wrap your output in one of the html strippers on devot-ee or a jQuery front end solution. Feb 8 '13 at 1:21

I'm not sure how agressive you want to get with stripping inline styles or if there are certain instances where you'd need to allow them, but you could use some simple jQuery to strip them out.

Something like has worked for me in the past:

$('.wygwam p').removeAttr('style');

You could obviously modify this depending on the element(s) your client typically adds the styles to.

You can read more about the method here: http://api.jquery.com/removeAttr/

Not the answer you're looking for? Browse other questions tagged or ask your own question.