I am using some jquery which applies an overlay on an image on hover. The script uses content from the image's title attribute to display over the image. When I tested this locally, it seemed to work, and I could style the text within title="" however, I'm now trying to get it working in WordPress, and it doesn't seem to let me style the text within the title attribute.

<img src="img.png" title="<h1>Title heading</h1><hr><h2>Title sub heading</h2>"

First of all i'd recommend you stop using title attribute for html container purpose:

Image title (and the element name speaks for itself) should provide additional information and follow the rules of the regular title: it should be relevant, short, catchy, and concise (a title “offers advisory information about the element for which it is set“). In FireFox and Opera it pops up when you hover over an image

In order to get things works you can use data- attribute (very good "intermediate" article about data-attribute with example how to use)

Considering [Can data-* attribute contain HTML tags?] it's valid to use data- attributes with HTML, and, as recommended under the refference above - take into account character escape.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

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