Skip to main content

How to Add a Floating, Fade In Gadget to Your Blog

Today's tutorial was prompted by a question I received in my advice column contact form. :) It read:

I LOVE everything that you did with Ingrid's blog,! When you scroll down, that tabs bar up top pops up is the bomb. Could you please do a tutorial on how to code it?? I have some web designer friends, so don't be afraid to "speak code" as they will explain it to me haha <33

This tutorial is going to be on how to create a floating, fade in gadget (specifically a Blogger pagelist). Let's get started. :)

The instructions.

  1. Select the blog you want to edit.
  2. Make sure you have a pagelist gadget installed on your blog.
  3. Install the following codes to your template.
  4. Save and view your changes.


<script src='' type='text/javascript'/>
// hide #mbz-sidebar-widget first
// fade in #mbz-sidebar-widget
$(function () {
$(window).scroll(function () {
if ($(this).scrollTop() &gt; 200) {
} else {

Place this code above the "</body>"  section in the HTML of your template.


#PageList1 { position: fixed;
top: -30px;
left: 0px;
padding-left: 30px;
width: 100%;
z-index: 9;
background-color: white;
height: 55px;
line-height: 35px;
text-transform: uppercase;
box-shadow: 2px 2px 3px #eee;

display: none; }

#PageList1 a { font-family: 'Raleway', sans-serif;
line-height: 3; }

Go to Template >>> Customize >>> Add CSS and paste this code in box.

Easy peasy, right? :)

If you have any comments, questions or concerns, please feel free to contact me.


Popular posts from this blog

A to Z CSS Cheat Sheet

Alright. Maybe you're just starting out with redesigning your blog. Maybe you want to get into CSS, but don't know where to start. Or perhaps you like figuring things out on your own, but you're stuck and need a resource.
That's why I crafted this super awesome (and easy to use) A to Z CSS cheat sheet. Even if you're not a "designer", and your "just a blogger", you will greatly benefit from knowing basic CSS like what's been included below.
Please have fun with this and share with me what you create with the help of these cheat sheets! :)

Click here to check out and download the A to Z CSS Cheat Sheet!
Keep buzzin'. <3 xx Nicole Rose

Room Tour 2019

I've always wanted to do one of these posts. If not for the enjoyment of others, for the enjoyment of my future self to look back on and realize how much my style and space have changed.

My door. I think I'm sooo artsy for taping paint swatches to my door. And I actually love how it looks too. I was going for "Starry Night" with my own little twist -- and without the actual paint. ;)

This is what my room looks like from the doorway. Can you guess what the theme is? It's funny -- a few weeks ago I was discussing with Kenzie how my room has this coral and aquamarine vibe to it, yet my Instagram theme is focused on yellows and blues, and my actual fashion style is very grungy/hispter/artsy. So it all comes full circle, I guess? Still, I love my room. It's my safe haven. Now come on in so I can give you the full tour...

Right as you walk in, you will see my DIY jewelry hanging on the wall to your right. It's quite a balancing act when I want to get one of th…

How and Why: Linkup Parties

Starting out as a blogger can be really hard. You want to grow your blog, but even though it seems like you've tried everything, nothing works. Your blog hasn't expanded in the least. You don't see any improvement.

That's why in this post I'm going to share with you the miracle of link up parties! I'm going to go over how they work, why you should create your own, which hosts you should use and much, much more.

Let's get started, shall we? :)

Share this post to help other bloggers learn about linkup parties.
How they work The typical link party can be broken down into 3 basic* parts.

* Every link up is different, so as you're reading through this and considering to create your own, consider adding a unique twist to your link up party. After all, people tend to get tired of seeing the same old same old.

The sponsors These are the people who came up with the original idea of that particular link party. It can be anyone from you on your lonesome to several …