Thursday, November 21, 2013

Add Google Plus Follower Gadget For Blogger

Posted by Unknown , 11:09 AM Be the first to comment!
Add_google1I have discussed about How to add sticky footer menu to your blogger in my last tutorial. Read my earlier post to add sticky footer menu to your blog.
In this tutorial I want to discuss about adding Google plus followers gadget to your blog. Blogger has recently launched  its new feature to add Google+ followers gadget to your blog. This gadget helps your readers to follow you easily through your blog. This will make you help in increasing your readers by following you on google+. It doesn't require any code to add this widget to your blog. Because blogger has  introduced a new gadget to add this to your blogger.   


You may like to read:

 How to earn money with your facebook pages?

 How to add separate contact page to blogger?

How to add facebook like button below blogger posts?

Best practices to write titles for Search Engine Optimization(SEO)

Great tips to reduce loading time of your blog to increase more readers

Idiotic and funny ways you never know to promote your blog

How to earn money from blogs?

Add floating widget to your blogger blog

Get more viewers to your blog using facebook fan page





1.Login to your Blogger account first.
2.Click the arrow mark of your blog in your dashboard(shown in the figure).
Add_google
3.Now select Google+.
add_google followers_gadget_to_blogger
4.Now you will be asked to change your profile data to your Google plus. That means you need to select your Google+ profile data to be your Blogger profile.
5.After making those changes in your profile, you need to go to your blog LAYOUT.
6.Select Add Gadget.
7.Click on Google+ Followers.
google_followers_badge

8.Save it.
add_google
That’s it. You are done.
Thanks for reading this post. Please comment below to share your ideas or suggestions or ask your queries if you need any help.
Don’t hesitate to ask me your doubts regarding blogger. I am always ready to help you.
Labels: ,

0 comments:

How to add floating widget to blogger blog

Posted by Unknown , 5:37 AM Be the first to comment!
In previous article we have discussed about adding a google plus follower gadget. In this post I'm going to show you how to create floating widget with simple css and adding it to your blogger blog. This will be helpful when you want to show ads or widgets that float. I already discussed how to add floating sticky meny with social widget bar at bottom of your blog.

Here is how to add this floating widget to your blog. Before adding this you need to backup your template.
Here is a simple CSS code and small HTML div to add.



You may like to read: How to earn money with your facebook pages?

 How to add separate contact page to blogger?

How to add facebook like button below blogger posts?

Best practices to write titles for Search Engine Optimization(SEO)

Great tips to reduce loading time of your blog to increase more readers

Idiotic and funny ways you never know to promote your blog

How to earn money from blogs?

Get more viewers to your blog using facebook fan page


Go to template.
Click Backup/Restore.
Download the template.

Be careful: Backup your template first before you continue further.

Edit HTML.
Find the ]]></b:skin> in your blogger template code.
(Use CTRL+F and search for ]]></b:skin>)

Just above ]]></b:skin> Add the below CSS Code:
#trickstown-float {
position:fixed;position:absolute;bottom:0px; left:0px;
clip:inherit; top:expression(document.documentElement.scrollTop+
document.documentElement.clientHeight-this.clientHeight); left:expression(document.documentElement.scrollLeft+ document.documentElement.clientWidth - offsetWidth); }
  

Add HTML Code:
Now you have to place the HTML code for the widget that needs to float.
Place the widget code between the div tags as shown

<div id=”trickstown-float”> and </div>.
  
For Example the code looks like this.

<div id="trickstown-float">
Widget Code
</div>

You can make customizations for this floating widget as you like. Make changes such as the background, margins, 'bottom' with 'top' , and 'left' with 'right' and which ever the change you may want to make.
Please let me know if you have any doubts to clarify.
Thank you
Labels: ,

0 comments:

Wednesday, November 20, 2013

Add awesome sticky footer menu to Blogger with simple HTML

Posted by Unknown , 10:50 PM 6 Comments so far
Hi friends, I have already started blogger tutorials for you. Today I want to discuss about adding a sticky footer menu to blogger. Have you ever thought of having a sticky menu in your blog footer? If you like to have it then you have read this article. You will have to use simple css and html to add this to your blog. This menu looks very beautiful and it adds a perfect finishing to your blog. Add a sticky menu in  the footer of your blog and it will attract your readers and is very much easier to them to go through the links on your blog. It helps your readers to catch the links very sooner. This sticky menu also adds professional look to your blog.
Look at the image below to know how the sticky menu bar looks in your blog's footer.


You can also watch the live demo of this sticky menu bar here.

View LIVE DEMO



You may like to read:

 How to earn money with your facebook pages?

 How to add separate contact page to blogger?

How to add facebook like button below blogger posts?

Best practices to write titles for Search Engine Optimization(SEO)

Great tips to reduce loading time of your blog to increase more readers

Idiotic and funny ways you never know to promote your blog

How to earn money from blogs?

Add floating widget to your blogger blog

Get more viewers to your blog using facebook fan page



Now let me explain how to add this menu to your blog.
  • Login to your Blogger account
  • Go to Dashboard.
  • Select Template>Edit HTML.
Warning: First you need to restore your blogger template before editing your HTML code.
Search in your Template for the piece of code shown below.
]]></b:skin>
Just copy the code above and press CTRL+F in your browser to find and paste it in your browsers search box.
After finding that code you need to follow this method.
Just above/before
]]></b:skin>
Copy and paste the below given lines of code.
CSS Part:
#cmb-stickey_footer { /* This will make your footer stay where it is */
    background: none repeat scroll 0 0 #1D1D1D;
    border: 1px solid rgba(0, 0, 0, 0.3);
    bottom: 0;
    font-family: Arial, Helvetica, sans-serif;
    height: 40px;
    left: 50%;
    margin: 0 auto 0 -490px;
    padding: 0 10px;
    position: fixed;
    text-shadow: 1px 1px 1px #000000;
    width: 960px;
}
/* border curves */
#cmb-stickey_footer {
    -moz-border-radius: 10px 10px 0px 0px;
    -webkit-border-radius: 10px 10px 0px 0px;
    border-radius: 10px 10px 0px 0px;
}
/* hover effect */
#cmb-stickey_footer:hover {
    background: none repeat scroll 0 0 #2b2a2a;
}
/* shadow for the footer*/
#cmb-stickey_footer {
    -moz-box-shadow:0px 0px 11px #191919;
    -webkit-box-shadow:0px 0px 11px #191919;
    box-shadow:0px 0px 11px #191919;
}
#cmb-footer_menu {
    margin: 0;
    padding: 0;
    width:auto;
}
#cmb-footer_menu li {
    list-style: none;
    float: left;
    font-size:12px;
    padding: 12px 14px 14px 14px;
    border-right:1px solid rgba(0, 0, 0, 0.4);
    background: rgba(0, 0, 0, 0.1);
}
#cmb-footer_menu .imgmenu {
    padding:5px 8px 3px 14px;
    float:left;
    background:url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEghO0X6WnBFI1QNtiD61FGbQeM9V975K0lhC5o1abcLj5CH4YvuMVmnKr8WvUmuliEyiLVUWRZceLJt3o33s_ryWO3aV5M2i42HczQZXqBCrnlCvQt-Z42UyUSwWl80nJJbZNFEvADo5Jc/s1600/home.png") 13px 5px no-repeat;
    width:36px;
    height:30px;
    border:none;
    border-right:1px solid rgba(0, 0, 0, 0.4);
    cursor:pointer;
}
#cmb-footer_menu li:hover {
    background:#202020; /* Fallback color for old browsers */
    background: rgba(0, 0, 0, 0.3);
}
#cmb-footer_menu .imgmenu:hover {
    background:url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiVEMyughNa1otwnTTmxwuyPKjZNV0QX58s9kEW3Uwh-zVXY3YeGKktAXMssBuVBvH9FauC3iJRAjNQDbvEFadx7Ixg8Z0JZu7oGkBBDlhPyGvw5NfdoitFp3o3cqEekNNhh1dYH9Ad1FI/s1600/home_hover.png") 13px 5px no-repeat;
}
#cmb-footer_menu li a {
    display: block;
    color: #cccccc;
    text-decoration: none;
}
#cmb-footer_menu li a:hover {
    color: #ffffff;
}
#cmb-footer_menu li span {
    display:none;
}
#cmb-stickey_footer #cmb-social_icons {
    float:right; /* social icons positions */
    width:auto;
    margin:5px 15px 0px;
    padding:0px;
    overflow:hidden;
}
#cmb-stickey_footer #cmb-social_icons li {
    margin-right:12px; /* 12px is the space between each one of them */
    float:left;
    width:24px;
    padding:0px;
    height:32px;
    list-style:none;
    _margin-right:0px; /* this is for IE6 only */
}
Now find the ending tag of body i.e., </body> tag in your template.
Search for
</body>
and just above/before ending body tag place this HTML code.
<div id='cmb-stickey_footer'>
  <ul id='cmb-footer_menu'>
    <!-- Begin Footer Menu -->
    <li class='imgmenu'><a href='#'><span>Home</span></a></li>
    <!-- This Item is an Image, the "span" is hidden via CSS -->
    <li><a href='#'>Blogger Tutorials</a></li>
    <li><a href='#'>Blogger Templates</a></li>
    <li><a href='#'>CSS tricks</a></li>
    <li><a href='#'>HTML tricks</a></li>
    <li><a href='#'>Click My Blog3 Tricks</a></li>
    <li><a href='#'>Contact</a></li>
  </ul>
  <!-- End Social Icons -->
  <ul id='cmb-social_icons'>
    <!-- Social Icons -->
    <!-- The span is the text appearing on hover, use the tooltip class in the link -->
    <li><a href='#'><img alt='' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg3f0k0w2mA-qUae53pFudFIVHYKJb7trJ0-yi6vOoeboGeAN1_LO58wyGQFxf6cF_r6BmcNseL9ZWm3DWU1_wy0KBV4Ke3sxLmxOg0AaHjbii7hfnYPy57jSPxpsewve47tApQBqtLS-A/s1600/twitter.png'/><span>Twitter</span></a></li>
    <li><a href='#'><img alt='' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjdQjWHOn1Xo194KnNyPM4473vfYp65x9vQiUIC6rQgQ3p4ow3O6lAl2U2fqKDWRttKHfDydKizvCExlAbQXO_WQY8mCHAodR6diHDECjO-OtrJbTMSBThNshK2O7H20aRE1C23AyzJ4MU/s1600/digg.png'/><span>Digg</span></a></li>
    <li><a href='#'><img alt='' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiH3kCl_JCDWOxdM1HDV7KsxSxSqOaTYqLC2IpOapZ3nN7wV1tsGnHqB6L0dAlDjpczaTQEqjQXaGQNlVAocl2dgjugZhQuyCrdni1zMliLsyPz6xq9ThGo05SgeiinYYDxNfDvuO1o1mY/s1600/flickr.png'/><span>Flickr</span></a></li>
    <li><a href='#'><img alt='' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi_8xAV2zGawGn0y2nu3e7QTutQOXLU-WmhD7iWVFQoR-UUSIvVtk1km4E-tFx8FuQmjqtGWZsAYtuURs09vixgWKtXRI2Gh_UUaP7UyZgUaK3yctt2SlHhXLV6B9gsTpb-xdbzrLWwFyE/s1600/facebook.png'/><span>Facebook</span></a></li>
  </ul>
</div>
Now you have to save your template. Then you are done.
If you have any doubts regarding this tutorial you can comment below. If you have any suggestions please suggest me. Thanks for reading this tutorial. Please share it with your friends if you liked it.




Get Mobile Tricks, Free Balance tricks and all Computer solutions click here
Labels: ,

6 comments:

Tuesday, November 12, 2013

How to trace details of an unknown person with mobile number

Posted by Unknown , 6:46 AM Be the first to comment!
Is anyone irritating you on mobile or with an email? Frustrating you ? and you really don't know who is that ? Then go through this complete article. I am going to talk about some points to find a particular person without having the support of police or any authorized measures. Tracing is pretty much simple because of internet. But internet is not generally helpful in all situations. However there are few methods to trace a particular person. For your convenience I have written this article to give you the solution so that you can quickly have an understanding of how to trace any person. Tracing a particular person is not simple task as much as we consider. We need to have few details of the individual to track him/her. such as Mobile Number, Email Id , Name etc.

How to use facebook to trace the details of a mobile number?

 

  1. Go to facebook website.
  2. Click on forgot password below the login fields.
  3. You will be asked to enter a mobile number or email id.
  4. There you can simply add the mobile number or an email id that's troubling you.
  5. Now you will see the person's profile pic along with the last three digits of his phone number(if you have entered email id as choice) or a hint to his/her email id(if you have entered mobile number).

That's it you are done. This can simply give you the information/details of any person who is registered on facebook with a mobile number.

How to trace mobile number with true caller? 

  1. Just search for true caller app on your android mobile.
  2. Install it.
  3. Search for mobile numbe.
  4. That's it you will get the details of the person

Please comment below if you have anything to share or ask your query. Thank you.
Labels: , ,

0 comments:

Wednesday, November 6, 2013

Why every freelance worker wants to be a blogger?

Posted by Unknown , 3:06 AM Be the first to comment!



Freelancing and writing a blog are among the many ways you can make money online. We have been discussing about the earning tips and blogging tips on this blog. But the dilemma is, which one is better among freelancing and blogging? Sure, they both equally have their benefits and drawbacks, but the simple fact is, they are significantly interdependent on each other. Most freelance workers are now ambitious to become blog writers/authors at some stage or an additional. Why? Simply because it's their need to have an extra hour to get some money! So the question is, should they really need to get started blogging as a career?

Free lance work is ever more challenging the existence of running a blog, which is why a bunch of Freelancers are now blog owners as well. Here i will discuss why you need to blog if you are a freelance worker.

A much easier way to get yourself recognized

Running a blog allows freelancers a chance to represent themselves on a entire new stage. Why don't we face it? The idea of talking about yourself in only two lines in a profile is just silly. Therefore, when you are going to apply for a outsourcing job, that is when a blog comes in handy. Besides your bio and portfolio, you can add a link to your blog. Now, you can dive into into the wide strength of a blog site, and present them your complete work. You can display things that's not even relevant to the job you've looking for. This makes a genuinely optimistic impact, which is why a lot of freelancers are now beginning to blog.




You may like to read:

 How to earn money with your facebook pages?

 How to add separate contact page to blogger?

How to add facebook like button below blogger posts?

Best practices to write titles for Search Engine Optimization(SEO)

Great tips to reduce loading time of your blog to increase more readers

Idiotic and funny ways you never know to promote your blog

How to earn money from blogs?

Add floating widget to your blogger blog

Get more viewers to your blog using facebook fan page




More credibility

Recognized blog writers have credibility. They have connections with expert people, and they have obtained a name(credibility) for themselves, and therefore acquired some reputation. They are also energetic on social media. Now free-lance clients always have a preference for offering a task to a person who appears to be real enough, and to whom they can get in touch with via several options in case of an urgent situation.

Bloggers are prioritized

Bloggers, and people on the web presence are usually prioritized. This is for the reason that bloggers are  likely to have a greater point of view on elements particularly related to the internet, and they are open to thoughts. Many blog writers even have a talent about web understanding, web designing, operating with graphics, and so on. Therefore, in tasks that require various skill-sets, bloggers are chosen as their knowledge can quickly be evaluated from the blogs they deal with.

Something new to study

Previously mentioned all, blogging and site-building isn't only about publishing. It's a lot much more than writing and publishing. Freelancers or people today who really don't have a idea about web design can start out blogging. But along the way, they get to learn new points, and new technologies like as HTML, CSS, JQuery, AJAX and PHP. And these are beneficial skills to have, and increases the wide range of jobs they can bid for.


Supplemental source for income

Now when it comes to the money, we have already discussed about making money from a blog. Writing a blog can establish a considerable source of income if performed with hard work and dedication. A freelance worker does not know if he will find work for next time or not.

But to a blogger who has set up a blog, this isn't an issue. Income from blogs is more efficient, which is why running a blog looks to freelancers like a normal workplace job, but can be done at home or even from anywhere and anytime.
When it comes to running a blog vs freelancing, both offer genuine chances. But why not consider the benefits of the two if you can? Searching for the opportunities bloggers have, it's no question to point out. So more and more freelance workers are approaching over to this practice. If you are a freelancers, then it absolutely would be a excellent concept to at least try it out. All the best.



Please comment below if you have anything to share or ask your query. Thank you.
Labels: , , , ,

0 comments:

Tuesday, November 5, 2013

Which is the best way to optimize mobile site?

Posted by Unknown , 10:53 AM Be the first to comment!
The idea of looking for articles online making use of mobile devices is

continuously on the rise, mainly due to the wide variety of mobile

devices and tablets now commonly available in the market. They actually

appear to be improving the cause, and more and more people today are

purchasing and using them. So how are these evolving styles altering

things, and how does it shows impact on you as a website owner?

Earlier, we have seen different ways to optimize our sites for mobile

devices. And there are much more  ways to handle this. So which

alternative is the best for offering content to mobile devices?


There are many ways to provide mobile content to your users, and they

are generally considered into three basic categories; Responsive Web

Design (obvious!), dynamic content serving, and creating the mobile

version of a site.


You may like to read:

 How to earn money with your facebook pages?

 How to add separate contact page to blogger?

How to add facebook like button below blogger posts?

Best practices to write titles for Search Engine Optimization(SEO)

Great tips to reduce loading time of your blog to increase more readers

Idiotic and funny ways you never know to promote your blog

How to earn money from blogs?

Add floating widget to your blogger blog

Get more viewers to your blog using facebook fan page



Responsive Web Design


This is one of the well-known mobile optimization techniques used

today. Responsive Web Design (RWD) includes designing content that

automatically resize itself to suit the screen size and resolution of

any mobile device. Here the content itself is rearranging itself, hence

there is no need to create custom redirects to other mobile pages, or

modifying the on-page content itself.


For the user, this would be simple to use, and for a content manager,

it means content only needs to be updated once. From a developer

viewpoint, Responsive Web Design may require rebuilding your site with

flexible templates, grids, style sheets and JavaScript but with very

rewarding results.


Dynamic content serving

This technique is similar to some extent to Responsive Web Design, but

at the same time it is also very different from Responsive Web Design.

We discussed that Responsive Web Design detects screen size and

resolution of the mobile device and resizes the content, but in dynamic

content serving  the device used by the user is detected at the

server-end, and then the provides a customized page on the same URL.

The custom page is generated dynamically at the server end.


Even though this strategy is very difficult to put into practice and

needs more maintenance, it is the most highly effective method for

offering mobile content to users, and industry experts suggest it for

experienced webmasters.

Separate Mobile Site

The final setup you might want to think about is developing a separate

mobile site, where mobile phone users will be directed to a

mobile-optimized version of your site. This implementation enables you

completely personalize your content for a mobile users. Very similar to

making dynamic serving content, this means you need to make separate

updates for content or decorating your mobile site to enable smooth

user experience.


For example we can consider facebook for separate mobile site. It uses facebook mobile version and desktop version. Both looks different and mobile version doesn't allows some extended features. apps, games etc.

If you have anything to suggest please comment below.
Labels: , , ,

0 comments:

Subscribe to: Posts (Atom)