Skip to main content

How to Add Gadgets for Blogger


How to Add Gadgets for Blogger

Add gadgets in blogger

Procedure:

  1. Open your browser and go to your blogger dashboard.
  2. Click on layout page in the Blogger dashboard.
  3. There you can see sidebar gadgets and click on "add gadgets " to edit.
  4. Now you see a new pop-up window, it will give you a couple of options of what gadgets you would like to put in your side bar menu.
  5. Choose whatever gadget you need and click on "+" .
  6. There you can see several options you have to check.
  7. At the top of new pop-up window you can see "visible" option, check on it.
  8. Click on save. Now your gadget is successfully added to your side bar.
  9. At the bottom of the layout page , you can see "save" button click on it.
  10. Your changes will be successfully saved to your blogger layout page.
  11. Click on "view blog" to check changes in your blogger website.

How to add custom gadgets in blogger

Procedure:

  1. Open your browser and go to your blogger dashboard.
  2. Click on layout page in the Blogger dashboard.
  3. There you can see sidebar gadgets and click on "add gadgets " to edit.
  4. Now you see a new pop-up window, it will give you a couple of options of what gadgets you would like to put in your side bar menu.
  5. At the top of new pop-up window you can see "visible" option, check on it
  6. Choose HTML/Java gadget you need and click on "+" .
  7. Enter the title of your gadget in the Title text box and your HTML/Java Script content in the content area.
  8. At the top of new pop-up window you can see "visible" option, check on it.
  9. Click on save. Now your gadget is successfully added to your side bar.
  10. At the bottom of the layout page , you can see "save" button click on it.
  11. Your changes will be successfully saved to your blogger layout page.
  12. Click on "view blog" to check changes in your blogger website

Note: For every changes that you have done in your layout page, make sure to click on "save". Otherwise your changes will not happen in your blogger website.


Social Plugins:

Html text: 

Code 1:

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css"/>

Code 2:

<style> 
.to-social-follow{width:150px;padding:10px;margin:0}.to-social-follow .fa{font-size:15px;padding:10px;text-align:center;margin:5px 2px;width:10%;text-decoration:none;color:#fff}.to-social-follow .fa:hover{opacity:.7}.to-social-follow .fa-facebook{background:#3B5998}.to-social-follow .fa-twitter{background:#55ACEE}.to-social-follow .fa-google{background:#dd4b39}.to-social-follow .fa-linkedin{background:#007bb5}.to-social-follow .fa-youtube{background:#b00}.to-social-follow .fa-instagram{background:#125688}.to-social-follow .fa-pinterest{background:#cb2027} </style> <div><a href="https://tutorsinfo.blogspot.com/"><span style="color: white;">tutorsinfo</span></a></div> <div class="to-social-follow"> 
<a href="https://www.facebook.com/" class="fa fa-facebook" target="_blank"></a> 
<a href="https://twitter.com/" class="fa fa-twitter" target="_blank"></a> 
<a href="https://www.linkedin.com/" class="fa fa-linkedin" target="_blank"></a> 
<a href="https://www.youtube.com/" class="fa fa-youtube" target="_blank"></a> 
<a href="https://in.pinterest.com/" class="fa fa-pinterest" target="_blank"></a> 
 </div>
Labels:

Comments

Post a Comment