Today I am going to share a way of customizing your popular posts gadget. This coding is how my current popular posts gadget is (see the bottom of my blog). :)
1. Select the blog you'd like to add the popular posts gadget to.
2. Head to layout and add the gadget to your blog.
3. Click and drag the gadget so that it is in the footer area (the bottom) of your blog. Make sure to click "Save arrangement".
4. Open up the gadget and make sure the option under "Most Viewed" is on your selected preference. Check the box "image thumbnail" and uncheck "snippet". Then make sure you are displaying up to 4 photos (see photo below).
5. Now go to Template >> Customize >> Add CSS and in the box, add the CSS codes from below.
#PopularPosts1 li { display: inline;
float: left; }
.popular-posts .item-thumbnail img { webkit-border-radius: 200px;
-moz-border-radius: 200px;
border-radius: 200px; }
#PopularPosts1 ul li a { border: solid 2px #000;
text-decoration: none;
padding: 10px;
text-align: center;
width: 200px;
padding: 10px;
text-align: center;
width: 200px;
height: 75px;
display: block;
word-wrap: normal; }
.PopularPosts img { padding: 0px; }
#PopularPosts1 h2, .item-snippet { display: none; }
Red: change the roundness of the photo.
Orange: Change or remove the border around the posts.
Green: Change the width and height of each of the separate posts - play with this to fit the gadget into the bottom of your blog.
6. Save your changes.
Have a question, comment or concern? Type up something to me below, or contact me directly. :)
6. Save your changes.
Have a question, comment or concern? Type up something to me below, or contact me directly. :)
xx Nicole Rose
Thank you so much for making this tutorial Nicole! It was super simple to follow and now I have a lovely popular posts gadget! I didn't have one previously because I didn't like the look of the standard blogger popular posts gadget. Also, I'm just wondering if you could tell me how you got those beautiful share buttons at the bottom of all your posts. They are wonderful!
ReplyDeleteThanks again!
xx Brittany
-Hello Bubblegum Blog
That's really helpful, thanks so much! I'm going to have to do this sometime:)
ReplyDeleteAh, yes. Save us from the awful default Popular Post gadget. :P
ReplyDeleteHey Rosie!
ReplyDeleteThis was really helpful, I've always wanted one of those, but I was afraid of what it would look like :P
Also, I have a request-- how did you do the lovely explore button on your blog? It's beautiful :)
Vanshi x
What a helpful post! I got a question for you if thats okay? I was wondering about the "have you checked this beautiful blog out yet" thing, how did you got it? It is so cool :))
ReplyDelete