Monday, 8 January 2024

Source :  Internet 



To add a scroll bar ( vertical scroll bar and horizontal scroll bar ) to your blog posts


If you prefer to add a scroll bar to your blog posts for a unique look, you need to first define it in the CSS (Cascading Style Sheet) and then activate it via HTML. 1. Log into your Blogger account. 2. Click "Template" from the "More Options" drop-down menu at the top of the screen. 3. Click the "Edit HTML" button, then click "Proceed."





Source :  Internet

How to Activate the Scroll Bar on Blogger

While using a professionally designed website on your own domain will create the best impression, it is not unusual for smaller businesses to communicate with their clients via blogs. One of the best-known free blogging services is Blogger. Blogger allows you to customize the look of your blog using templates, but this is still somewhat limiting with what you can do. If you prefer to add a scroll bar to your blog posts for a unique look, you need to first define it in the CSS (Cascading Style Sheet) and then activate it via HTML.

  1. 1.

    Log into your Blogger account.

  2. 2.

    Click "Template" from the "More Options" drop-down menu at the top of the screen.

  3. 3.

    Click the "Edit HTML" button, then click "Proceed."

  4. 4.

    Type the following code snippet anywhere in the body of the template;

    .scrollbox { height:100px width:400px overflow:auto; }

    Change the "height" and "width" values according to your preferences but always include the "overflow:auto" section, as this is what activates the scroll bar.

  5. 5.

    Click "Save template" and then click the "Close" button.

  6. 6.

    Click the "Posts" link on the left of the screen, then click the "Edit" link below the post for which you want to activate the scroll bar.

  7. 7.

    Click the "HTML" button at the top of the page, then add the following code in front of the text you want to add to the scroll box that you defined in the template;

    <div class="scrollbox">

  8. 8.

    Add the following code at the end of the text that you want to add to the scroll box;

    </div>

  9. 9.

    Click the "Update" button at the top of the screen, then click "Publish."

No comments:

Post a Comment