CODEWITHSUNDEEP
jqueryhtmlcsswordpress
johnnyg
johnnyg

Reputation: 33

How do I add an attribute to a specific CSS class?

As a brief background, I'm a noob all around. I apologize in advance.

I have a specific CSS class that is only applied to thumbnail images on my Wordpress site. I'm running a script that applies a "Pin it" hover link on all images site-wide. I'd like to exclude this specific class (attachment-custom_thumb) from this script by adding a "nopin=nopin" attribute. I recognize that CSS doesn't do what I'm asking to do, so I'm wondering if there's an easy way to add that attribute to all photos in that particular class (since that seems to be the easiest, most automated way of identifying the images I want excluded).

Thanks!

Upvotes: 0

Views: 1183

Answers (2)

davidtheclark
davidtheclark

Reputation: 4676

Another possibility: Since you're adding the "Pin It" thing with a script, you could modify that script so that when it adds the "Pin It" it excludes images of your class. This could take of the problem without your having to create the "nopin" attribute.

Here's a hypothetical example of what I'm talking about using jQuery:

function addPinIt (elements) {
   // your code here
}
addPinIt($('img').not('.the-nopin-class'));

Here's documentation of that .not() method.

The viability of this solution of course depends on the script you're using and your comfort level tweaking it. If you want to post the script I could make a more specific suggestion.

Upvotes: 0

Matthew Woodard
Matthew Woodard

Reputation: 754

Your best bet would be to use jQuery. If you have a custom.js file in your theme you could add this code ... if not see here for details on adding js to wordpress.

You could try the following code using .attr() function:

jQuery(function($) {

     $('.attachment-custom_thumb').attr('nopin','nopin');

})

The above code grabs any html element with the class 'attachment-custom_thumb' and appends the attribute 'nopin' with the value 'nopin' to it.

HTH :)

Upvotes: 2

Related Questions