Showing posts with label Tutorials. Show all posts
Showing posts with label Tutorials. Show all posts

1 June 2013

Tutorial: How to add "JOIN TO THIS SITE" widget by Google to BLOGGER



1. Go to dash board of your Blog.

2. Click on layout tab.




3. Click on add gadget button.



4. Now go to 2nd option ie MORE GADGETS at left side you can see as below.




5. Now in search box type "join this site widget by google". and give enter.


6. Select this option.


You are done.

Tips: 
Make sure you have logged into your blog which you want to add this widget.

Hope you like this post.



Read more...

26 February 2013

Tutorial:How to add "you might also like" widget to Blogger



Hi everyone 

Today will give instructions on how to add "you might also like" or  "You may also like" widget on Blogger's Blog.

Step 1: Go to linkwithin.com




Step 2: Fill up all the fields like email, Bloglink, platform and click on get widget.

Step 3: Now click on install widget at top next new window will open.


Step 4: Select your blog name. If you have more blogs click on which blog you want to add widget.

Step 5: Click on add widget.

Step 6: Go back to your blog it will be installed you can see at right side near add widget below. Its better you place it below Blog posts frame.




Your done...!!!!!!!



Read more...

17 February 2013

Tutorial:How To Add The Drop Down Menu in Blogger


Create a Simple Drop Down Menu In Blogger Blog

1. Go to dash blogger dashboard.
2. Click on template -> edit html. (back up your template)
3. use ctrl F to find ]]></b:skin> and paste the below code.

===========================

/*----- Drop Down Menu BY www.realcombiz.com----*/

#rbnavbar {
    background: #2a2626;
    width: 100%;
    color: #FFF;
        margin: 0px;
        padding: 0;
        position: relative;
        border-top:0px solid #7f7777;
        height:35px;
}

#rbnav {
    margin: 0;
    padding: 0;
}
#rbnav ul {
    float: left;
    list-style: none;
    margin: 0;
    padding: 0;
}
#rbnav li {
    list-style: none;
    margin: 0;
    padding: 0;
        border-left:1px solid #333;
        border-right:1px solid #333;
        height:35px;
}
#rbnav li a, #rbnav li a:link, #rbnav li a:visited {
    color: #FFF;
    display: block;
   font:normal 12px Helvetica, sans-serif;    margin: 0;
    padding: 9px 12px 10px 12px;
        text-decoration: none;
       
}
#rbnav li a:hover, #rbnav li a:active {
    background: #6c6464;
    color: #FFF;
    display: block;
    text-decoration: none;
        margin: 0;
    padding: 9px 12px 10px 12px;
       
   
       
}
#rbnav li {
    float: left;
    padding: 0;
}
#rbnav li ul {
    z-index: 9999;
    position: absolute;
    left: -999em;
    height: auto;
    width: 160px;
    margin: 0;
    padding: 0;
}
#rbnav li ul a {
    width: 140px;
}
#rbnav li ul ul {
    margin: -25px 0 0 161px;
}
#rbnav li:hover ul ul, #rbnav li:hover ul ul ul, #rbnav li.sfhover ul ul, #rbnav li.sfhover ul ul ul {
    left: -999em;
}
#rbnav li:hover ul, #rbnav li li:hover ul, #rbnav li li li:hover ul, #rbnav li.sfhover ul, #rbnav li li.sfhover ul, #rbnav li li li.sfhover ul {
    left: auto;
}
#rbnav li:hover, #rbnav li.sfhover {
    position: static;
}
#rbnav li li a, #rbnav li li a:link, #rbnav li li a:visited {
    background: #6c6464;
    width: 120px;
    color: #FFF;
    display: block;
    font:normal 12px Helvetica, sans-serif;
    margin: 0;
    padding: 9px 12px 10px 12px;
        text-decoration: none;
z-index:9999;
border-bottom:1px dotted #333;
   
}
#rbnav li li a:hover, #rbnavli li a:active {
    background: #2a2626;
    color: #FFF;
    display: block;     margin: 0;
    padding: 9px 12px 10px 12px;
        text-decoration: none;
}


==============================


  • To change the color of your background menu, simply edit  #2a2626.
  • To change the background color of the menu on mouse hover, then edit #6c6464
  • To change the background color of the drop down menu, edit #6c6464.
  • Click "SAVE TEMPLATE" when you are done with your editing.

Note: click here  to see html codes for colors.



. To add as gadget.
     Go to dash board of your Blog.
     Click on layout tab.
     Click on add gadget button.



5. Select html/java script option.






6. add this code.

======================================

<div id='rbnavbar'>
      <ul id='rbnav'>
        <li>
          <a href='#'>Home</a>
        </li>
        <li>
          <a href='#'>Contact</a>
       </li>
        <li>
          <a href='#'>About</a>
       </li>
        <li>
          <a href='#'>Blogging</a>
        </li>
  <li>
           <a href='#'>Services</a>
            <ul>
                <li><a href='#'>Sub Page #1</a></li>
                <li><a href='#'>Sub Page #2</a></li>
                <li><a href='#'>Sub Page #3</a></li>
                <li><a href='#'>Sub Page #4</a></li>
                <li><a href='#'>Sub Page #5</a></li>
              </ul>
        </li>
         <li>
          <a href='#'>Create This ></a>
        </li>
      </ul>
    </div>


========================================


  • Replace all occurrence of # with the link/url of each 
       page you want to point the menu to.


  • Replace all text highlighted in green  sub page #1  
      with the title of each menu.


  • Click "Save"  Your done.

Thanks to  www.realcombiz.com for giving clear instruction on this.






Read more...

6 February 2013

Tutorial:How to add recent posts widget with image


1. Go to dash board of your Blog.

2. Click on layout tab.





3. Click on add gadget button 





4. Select html/java script option.




4. Give name to title as recent posts or anything u like.

5. copy the below code and paste it onto content.

=======================================


<div id="hlrpsb">
<script style="text/javascript" src="http://helplogger.googlecode.com/svn/trunk/recent-posts-with-titles-only.js"></script>
<script style="text/javascript">var numposts = 10;var showpostdate = false;var showpostsummary = false;var numchars = 100;var standardstyling = true;</script>
<script src="http://your-blog.blogspot.com/feeds/posts/default?orderby=published&alt=json-in-script&callback=showrecentposts"></script></div>
<div style="font-family: arial, sans-serif; font-size: 9px;" id="rpdr"><a href="http://helplogger.blogspot.com/2012/04/recent-posts-widget-for-bloggerblogspot.html" title="Grab this Recent Posts Widget" target="_blank">Recent Posts Widget</a> by <a href="http://helplogger.blogspot.com" title="Recent Posts Widget">Helplogger</a></div><noscript>Oops! Make sure JavaScript is enabled in your browser.</noscript>
<style type=text/css>
#rpdr {background: url( https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj81jdnQ9sZEXAeJG6BtVcWquNdqJ9dOZg8jTIrH4IKnVkC9buFXBMcBVrcKW3rep5304U2rbNpW9vCDamAr6F0JXtCnt9sPXqYDn__fIRytmkpaYu8soXusVb174LbnJw4sIJGZPwzCR3A/s1600/blogger.png ) 0px 0px no-repeat; padding: 1px 0px 0px 19px; height:14px; margin: 5px 0px 0px 0px;line-height:14px;}
#rpdr, #rpdr a {color:#808080;}
#hlrpsb { }
.bbrecpost2 {
padding-top:6px;
padding-bottom:6px;
border-bottom: 1px #cccccc dotted; }

</style>



=======================================

6. Now change the red color highlited code to ur blog address.
Note: Dont alter anything else.

7. Save it and see the changes on your blog by refreshing.
Your done..!!!!

Hope it helped you all.
Leave us ur comments or queries.



Read more...

Tutotials:how to remove subscribe to posts (atom) on Blogger



How to remove subscribe to posts (atom)

1. Go to dash board of your blog.



2. Click on template.

3. Backup ur template.(it will be on right top).

4. Click on edit html template. 


    Click on expand widget template.

     

5. press ctrl f n search this code <b:include data='feedLinks' name='feedLinksBody'/>

6. Delete the line <b:include data='feedLinks' name='feedLinksBody'/> and preview.

7. Save see the changes and ur done...!

Hope it helped u all.
Thanks for stoppeing by.....



Read more...

5 February 2013

How to Automatically publish Blog posts directly to Facebook via networked Blogs

Hi everyone

How to automatically publish blog posts on to social networking sites.

Click here 

U must be logged into ur facebook account before doing this.
U can also do same to twitter account.

Follow his instructions and ur done.

Thanks to connectwww.com for sharing this wonderful post which make easier way to post ur blogger posts automatically on to social networking sites.

Please leave us ur comments or any othere queries related to blogger.


Read more...

Tutorial:How to create Numbered page navigation for Blogger

Hi 

Instead of having older and newer posts u would like to add previous and next with numbere of pages.
Which helps ur users to view ur blog easier.

Click on this link here.

He(GrayIT Blogspot) has given u many no of choises to make it easier for u to choose among different styles.

Best thing is u no need to struggle much with it.



1. Just choose the style u desire by clicking on bullet button.
2. Write ur own text in place of prev n next.
3. Select no of posts to display.
4. Click on generate button.
5. Next click on add to blogger.

IMP: u must be logged in to ur blogger account where u wish to add this navigation style.

And refresh to see ur new look.
ur done.

Hope it helped u all.

Leave us ur valuable comments.




Read more...

8 January 2013

How to set no of posts on main page of Blog


Go to Dashboard or design from your main page of the Blog.
U are able to see this page.


Click on layout 1.
can you see Blog posts below ie no 3 click on edit.



where arrow shows change the no of posts you like to display click on save you are done.


Read more...

How to Change fonts and colors of Blog


Go to Dashboard or design on your Blog it wil be on right top of the Blog.




click on layout button 
then at right top u can see template designer click on it 




click on advance there you will be able to change colors of your font, font size, side bar colors, total control on view of your Blog.

Next click on apply to Blog you are done. 


Read more...

How to change width of Blog

Go to Dashboard or Design on your main Blog page
You can see this part on left side





click on layout button.
then on right corner ckick on template designer .
now u can see this image



click on adjust widths now you can adjust as your need
next on right side click on apply to Blog you are done.
View blog u can see the widths changed.


Read more...

7 January 2013

Tutorial:Creating Blog with Blogger




  • Hi everyone 


As i told you all in my previous post about what is Blog. Now lets create it.

First thing to create you need a mail id ie gmail is must. If you have allready one start here. 
You will get this page so type your mail id n pass word you wil enter this page.



We get into this page so give the Tittle name which you want later you can change and then give address of your blog and select template even template also you can change later click on create.




So you done with creating your Blog.

Designing Blog is next step it includes adding gadgets and adding pages n links labels there is lot with designing which i wil write a tutorial on it as soon.


Read more...

Tutorial:How to Creat New Blog

Hi everyone 

We Keep hearing about people saying i own a blog n talks they have n discussions they do on there blogs its quite interest right.

So let us have a blog by creating one for us why should we hide our talents lets share what we know and share the knowledge with world. when we share we make ourself's learning more things. 

What is Blog:

First thing what is Blog.....? its nothing but writing a daybook or a diary but its upto you as what you write what you share and since people are able to read what you write. so the good and original content makes you have a worthy Blog. If you really want to make your Blog into buisness or to get traffic make sure your writing valuable contents and writing by your own or notify if your writing from others but dont copy and write contents as if its your's. copying is not a good hobby to a blogger specially. Try to learn to write by your own at the begining you may not able to write how exactly you want later you wil be able to write best.. that is how i m also learning. 

Which Blogger to choose:

Any how to have a blog its very easy since it is free the main thing is choose which provider. Mainly we have 2 Blog providers Blogger  and world press both are free. I personally prefer Blogger i havent used Worldpress so i m not familiar with it though i have seen most people prefer blogger so you decide which one to have.

Once you choose the blog provider. Lets start creating it. 
I have choosen Blogger. 

To create Blog using Blogger Click here.




Read more...

30 December 2012

Tutorials: Creating website with google sites.

Hi everyone 

     In my previous post here i had told you can create website in google sites. Now wil give brief details on how can u get started to have your own website in google.

  • Creating Website:
           Here you no need to have Domain name if you have gmail account ie fine so Click here to start. Click on sign in button down n login with your gmail account if you dont have one create new by clicking here.

Once you logged in you can see this page.

 










     

      Click on create then select any template later you can change as you need, give site name of your choice select home page option then after filling all the options click on create.

     Before getting started with your website designing you need to be familiar with this basic things. 


     Any one who is creating website first time may feel difficulty, for this you need practise keep editing your site and deleting it doing it repeatedly wil give you a good grip on your site options so lets start.

      Learn this basics click here and understand them well.

      I will not give detailed explanation on everything since i will give link to all the steps of creating website, in case if you cant understand anything particularly leave me comment wil try to sort it out.

My most links in this post are from JS she has given instructions clearly and easy to follow and i have created my site by following her instructions. Thanks to JS for sharing those tips with us.


Editing Site: 


  More references:


      Video on how to create google sites click here.
Slide show on how to create website click here.
After creating site you want to fill things like gadgets links images posts n content which makes look more better. 

 Adding Gadgets
           Another comment form from Mori click here.
      Once you finish adding gadgets. lets add some links buttons and image links and slide shows.

Adding Links :
               Another link to add google + button by Mori click here.
              Another link to add Rss feed subscription click here.
  •  Add email subscription feed burner click here
  
  Note: 
   1. You should have an account before adding them on your site.
  2. Wherever i have written another link, its just i have given alternative but both are on same topic. please compare them among and then follow instructions i have tried making you all to give alternatives if at all anyone cant follow by one.

  Leave your valuable comments. 
  Any questions or doubts related to topic pls leave them will answer as soon i can. 

     Thanks for reading. Hope its helpful.
  
Read more...