Have you ever wanted to apply a CSS code to something, but you didn't have the identification of the gadget you wanted to style? This tutorial has been created to help you find the ID of the gadget you'd like to style.
Note: gadgets, widgets and page elements are essentially the same thing. I like to collectively call them gadgets, so please take heed this works for pretty much everything you apply to your blog's layout. :)
Instructions
1. Add the gadget you'd like to style to your blog. Save your layout changes.2. Click "Edit" of the gadget you just applied, but don't make any changes.
3. Maximize the window that pops up, so you can see the tale end of the address bar in the window, at the top of the screen. Notice how it has a word and a number at the end. That's the gadget ID.
(I don't know why PicMonkey keeps doing this to my photos. -.-)
4. Copy and use for your CSS code!
Comment below if you have any questions or concerns. I'd love to hear from you. :)
xx Nicole Rose
Great advice. I sometimes go onto my blog and then right click on the gadget and select "inspect element" which tells me the gadget id, but my way seems rather long-winded!
ReplyDeleteSarah xo | PolkaDotLemon
*Gapes.* This is wonderful. :)
ReplyDeletePicMonkey does what? Turns them grey? I've heard that's a Google-related thing that no one's tried to fix . . . Photobucket doesn't do that, btw.
Hi Nicole, I've never heard of this method before, and I've always had trouble finding the gadget ID. I always had to expand the HTML in the template to figure out which gadget is which. This is such a great way to keep track of the gadgets, thank you so much for sharing it. :)
ReplyDeleteDian
The Happy Candle