You know the bar at the very bottom of Chrome’s Inspect Tool? The part that shows the current DOM element being viewed? Is there a way to copy and paste that? I’m doing a lot of small WP customizations and it would be much quicker than typing those in manually after targeting them.
No, it sometimes gives me extra information with the piece I want, and sometimes it’s missing the class altogether. It’s not a huge deal, just wondering what the fastest way is to grab specific groups of classes as they appear in the bottom bar. I have to do it a lot when working with WP themes.
<p>I do, but I was talking about the very bottom bar in my attached image, the part highlighted in blue, for when I want to target that exact class.</p>
Or are you talking about all instances of the class? That might get messy.
As others said, if you right click and copy > copy selector, the result is something like this
#ember1478 > div > div:nth-child(3)
That’s not what you want. The other way is on your right (where you see the style for the selected element) there is a plus button, click it and then just cmd+c to copy and you get
.topic-post.clearfix.topic-owner.regular
Exact same element as highlighted at the bottom in blue. In your case you get .main-link.clearfix
The button is called “new style rule”. That’s what you’d use to add a new style, but you can use it for your needs too.
TIP: You don’t need to copy elements one by one. If you keep the plus sign clicked then select “inspector stylesheet” Then go through all the elements you need, all those elements would be in an "“inspector-stylesheet” file where you can select and copy all your elements in one