How to have this cute scroll box to your blog

28 / 10 / 2012

Hi guys! In this entry, I will tell you on how to get this cute textbox on your blog. You can put anything in here such as text, pictures and many more! You may put the textbox in your sidebar section or in an entry just like I did below.

Title of textbox
Bonbon biscuit cake chocolate bar candy danish. Fruitcake oat cake donut marzipan chocolate halvah. Lollipop jujubes candy halvah cookie jelly beans cake muffin chocolate cake. Lollipop dragée halvah bear claw wafer cookie lemon drops cake toffee. Sugar plum oat cake icing marshmallow. Chocolate cake jujubes bonbon lemon drops lollipop cookie. Powder soufflé cake. Chocolate cake jujubes chocolate bar tiramisu oat cake icing. Cookie cake candy apple pie gummi bears. Pastry candy canes powder danish tart pudding tootsie roll. Caramels lemon drops jujubes jujubes tart toffee ice cream halvah caramels. Jelly bear claw gummies brownie lollipop oat cake. Bonbon pudding gingerbread.


To use this scroll box, copy and paste this codes to http://htmledit.squarefree.com/ to edit while viewing the live preview. Then you may place them anywhere you wanted them to be.

<div style="border:3px solid #eee;background:#E5DDDA; width:260px; padding:5px; border-bottom:none;-webkit-border-top-left-radius: 30px;-webkit-border-top-right-radius: 30px;-moz-border-radius-topleft: 30px;-moz-border-radius-topright: 30px;border-top-left-radius: 30px;border-top-right-radius: 30px;color:white;text-align:center;"> Title</div>
<div style="border:3px solid #eee;background:#fff; width:250px; overflow-x:hidden; overflow-y:scroll;padding:10px; height:100px; text-align:justify;"> Content here</div>

»
«
»
«

Dragée cookie halvah cookie chocolate bar fruitcake brownie. Sesame snaps lollipop soufflé dragée donut topping bear claw. Macaroon pudding danish pastry fruitcake cotton candy. Marshmallow cotton candy macaroon ice cream apple pie danish gummi bears. Marzipan soufflé sugar plum candy chupa chups halvah sweet roll chocolate cake oat cake. Danish carrot cake icing.


To have this scrollbox to your blog, get this codes, edit the content and paste them anywhere you wanted it to appear.

<div style="background:#ffffff; width:400px; overflow-x:hidden; overflow-y:scroll;padding:10px; height:100px; ">Content here</div>

For any questions, you may comment down below 🙂

»
«
»
«

Hi guys! As requested, I will teach you on how to get the menu button of this style. This is the live preview of the button, you may hover your cursor over these menus to see the hover effect 🙂

1234


To get this menu button, follow the instruction given below.

1. Edit the codes

To edit the codes, I recommend you to use http://htmledit.squarefree.com/ to edit while viewing the Live Preview immediately. The main codes that you need to change are - YOURLINKURL (Change this to your link url) & titlehere (Change this to your own menu title)

 

2. Apply the codes

For Blogger Template Designer user, you may put this navigation on your gadget section. Go to Home > Layout > Add a gadget > Choose HTML/Javascript > and paste the codes. 
For blogskins/ Classic Template user, you may put the codes anywhere you wanted the navigation to be.
Thank you 🙂

»
«
»
«

Hi guys! As requested, I will teach you on how to get the menu button of this style. This is the live preview of the button, you may hover your cursor over these menus to see the hover effect 🙂

option1
option2
option3
option4

To get this menu button, follow the instruction given below.

1. Edit the codes

To edit the codes, I recommend you to use http://htmledit.squarefree.com/ to edit while viewing the Live Preview immediately. The main codes that you need to change are - YOURLINKURL (Change this to your link url) & Option (Change this to your own menu title)

 

2. Apply the codes

For Blogger Template Designer user, you may put this navigation on your gadget section. Go to Home > Layout > Add a gadget > Choose HTML/Javascript > and paste the codes. 

For blogskins/ Classic Template user, you may put the codes anywhere you wanted the navigation to be.

Thank you 🙂

»
«
»
«

Hi! Im back with the second version of bias list! Click here to view the live preview of this bias list. Don't forget to mouse-over the icon to see the fancy hover effect.

1. You will need to edit the codes first. For time saving and less effort, copy and paste the codes below to this website http://htmledit.squarefree.com/ and edit the codes there. You may edit the colors, and size. Don't forget to change YOURIMAGEURL to your own square images and change "Bias name" to your idol name.

2. Once you have done editing, copy the whole edited code.
 3. For classic template, you may paste the codes anywhere in your blogskin codes. Specifically anywhere you wanted the bias list to appear.
 4. For Template designer, go to Home > Pages > New Pages > click HTML > and paste the codes > Save the page immediately, don't click Compose as it will corrupt your bias list.

»
«
»
«
Assalamualaikum and hi! Today I would like to teach you on how to add this cute floating navigation to your blog. Click here to view the live preview of the navigation. To get this navigation to your blog, simply follow these instructions.
1. If you are using classic template, paste the codes below under/before the codes </style>
2. If you are using template designer. paste the codes below into HTML/ Javascript (Home> Layout > Add a gadget)

    »
    «
    »
    «
    WANA, TWENTY ONE
    The girl on the left telling you to have a happy reading!

    + JOIN THIS SITE

    Footsteps

    My Bloglist

    Sponsor



    © 2011-2017 WANASEOBY.COM