Select Menu

Ads

Random Posts

Powered by Blogger.

Design

Technology

Circle Gallery

‹
›

Shooting

Racing

News

Bottom

Add Static Facebook Pop Out Like Box with Smooth JQuery Hover

Hello friends, here's another Facebook jquery pop up for facebook like box widget for bloggers (or) website. Advantages this widget is to free space on the page. Because Facebook can prevent website normal as the box. Static Pop Out Facebook as soft box with jQuery effect of activation for the blogger, this is another cool control. Here I have added as the box with simple jQuery hover effect. See Facebook static plate to the right of the page and move the mouse over the plate with the frame, as is visible by sliding to the left. 


Add Left Side Static Facebook Pop Out Like Box with Jquery Hover Effect
Step 1: Adding Static Facebook Pop Out Like Box Widget To Blogger layout.

 Now let's start adding it...

 Step 2. Login to Your Blogger Account.Go to your Blogger Dashboard.Click on Layout tab from left pane and click on Add a Gadget link.




Step 3. After click on Add a Gadget link A pop-up box will open now

 with many gadget list, Choose HTML/JavaScript from the gadget options by clicking the blue plus sign for that gadget.






Step 4. Select 'HTML/Javascript' and add the one of code given below.

 Step 5. Now Click On Save 'JavaScript' You are done.
<script src="http://code.jquery.com/jquery-1.10.2.min.js"></script>

<script type="text/javascript">
//<!--
$(document).ready(function() {$(".w2bslikebox").hover(function() {$(this).stop().animate({right: "0"}, "medium");}, function() {$(this).stop().animate({right: "-250"}, "medium");}, 500);});
//-->
</script>
<style type="text/css">
.w2bslikebox{background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgQ3ob6mfcSp3DODPRv4Dxtxo8O9NnV5lnCVRx9-Y6YnyThzYiLVDVGQqWebsP5mX1GTcAkgDaV0Eq7rpUwkb_wBIBusHSvF5f1rI0Y0-aP88k-5a3t81tDJl87h_RzSzxeKtC2i-8EQQWG/s1600/facebookbadge.png") no-repeat scroll left center transparent !important;display: block;float: right;height: 270px;padding: 0 5px 0 46px;width: 245px;z-index: 99999;position:fixed;right:-250px;top:20%;}
.w2bslikebox div{border:none;position:relative;display:block;}
.w2bslikebox span{bottom: 12px;font: 8px "lucida grande",tahoma,verdana,arial,sans-serif;position: absolute;right: 6px;text-align: right;z-index: 99999;}
.w2bslikebox span a{color: #808080;text-decoration:none;}
.w2bslikebox span a:hover{text-decoration:underline;}
</style><div class="w2bslikebox" style=""><div><a href="http://24work.blogspot.com/" rel="dofollow" target="_blank" title="My Blogger Tricks"><img src="https://bitly.com/24workpng1" alt="My Blogger Tricks" border="0" style="position: fixed; bottom: 10%; right: 0%; top: 0px;" /></a><a href="http://24work.blogspot.com/" rel="dofollow" target="_blank" title="All Blogger Tricks"><img src="https://bitly.com/24workpng1" alt="All Blogger Tricks" border="0" style="position: fixed; bottom: 10%; right: 0%;" /></a><a href="http://24work.blogspot.com/" rel="dofollow" target="_blank" title="Techtunes"><img src="https://bitly.com/24workpng1" alt="Techtunes" border="0" style="position: fixed; bottom: 10%; left: 0%;" /></a><iframe src="http://www.facebook.com/plugins/likebox.php?href=http://www.facebook.com/pages/Walkize/220888831260608&amp;width=245&amp;colorscheme=light&amp;show_faces=true&amp;connections=9&amp;stream=false&amp;header=false&amp;height=270" scrolling="no" frameborder="0" scrolling="no" style="border: medium none; overflow: hidden; height: 270px; width: 245px;background:#fff;"></iframe></div></div>
>> In Customize Field Replace "pages/Walkize/220888831260608" with your own facebook page name (Not your own profile name)
<script src="http://code.jquery.com/jquery-1.10.2.min.js"></script>
Note :If your template already have a jquery do not put again, just copy after it

Your personal Facebook as the box is ready to be served! That's it. Paste this code anywhere you want and your personalized style box is displayed to perfection. If you have any problems let me know. I will post more designs and tutorials on this topic on this week.

-
What’s the second most important part of your blog post after the title?
Just imagine how disappointed you’d be after crafting a killer headline for your post, only to lose readers with an opening that failed to carry the momentum. A great headline mixed with a lame opening is like inviting someone into your house, only to slam the door in their face as they approach.

 So, here are 5 ways to open your post that will capture the reader’s imagination and pull them deeper into your content..

1. Ask a Question :-


Opening your post with a question is a rhetorical device (hence, the “rhetorical question”) that creates curiosity and gets the reader thinking. Thinking equals active engagement with your writing, and that’s a very good thing.


2. Share an Anecdote or Quote :-

Anecdotes are quick stories that can make people laugh or immediately establish the main point of your post. A nice quote from a recognizable authority or famous person can also work wonders when holding attention in those crucial opening seconds.

3. Invoke the Mind’s Eye :-

Producing a mental image in a reader’s mind is one of the most powerful things you can ever do as a writer, so expressly engaging the imagination is a powerful opening technique. Activate the mind’s eye of the reader by using words like “imagine,” “picture this,” “do you remember when,” etc.

4.  Use an Analogy, Metaphor or                           Simile :-

Analogies, metaphors and similes are some of the most powerful devices available when it comes to telling a story in a single sentence. This is a great way to capture a reader’s attention and also acts to provoke mental imagery that allows readers to tell a story to themselves.

5. Cite a Shocking Statistic :-

Starting off with an interesting factoid is also a great technique. People love being provided with interesting data, but only if it is unique, startling, or even shocking. The statistic should also be directly relevant to the point of your post as well.

Bonus Tip:

"The third most important part of your blog post is the closing. A great way to close is to tie back into your opening."

So, which of the 5 techniques did I NOT use in the opening to this post?




-

Top10 tips for Improving Site Speed

Blogging is a very common thing and very much popular also which is now used by almost every internet savvy people. But there is a problem which is facing by many people that the loading time of the blog. Sometimes it brings irritations amongst the readers and they leave the blog. By this you will lose your readers and also increase your bounce rate of blog. Thus you have to implement some business strategy to handle with this problem by reducing blog loading time. Below there are some useful tips of how to reduce the loading time of a blog.

#1 Start using a CDN (Content Delivery Network) :-

                It’s so worth it, especially if you have a decent amount of traffic. Your audience will thank you with extra dollars.


MaxCDN - Lots of people say good things.
CacheFly - Another trustworthy provider.
Cloudflare - Part CDN, part security tool. 
Inscapsula – similar to Cloudflare, but has shown to offer a much better level of security / protection according to research.

#2 Host your static files in the cloud that uses a CDN :-
         
             Serve static content from a cookieless domain, backed by a CDN. Why cookieless domains? Every time a browser sends an HTTP request, it has to send all associated cookies that have been set for that domain and path along with it. Static content, such as images, javascript and CSS files, don’t need to be accompanied by cookies. You can decrease latency by serving static resources from a domain that doesn’t serve cookies.

#3 Install Google PageSpeed on your server :-

         PageSpeed improves web page latency and bandwidth usage by changing the resources on that web page to implement web performance best practices. It will automatically apply web performance best practices to web pages and associated assets (CSS, JavaScript, images) without requiring that you modify your existing content or workflow. Plug’n'play.

#4 Optimize your images :-

          Images can be large, and make your website slow to load. That’s why you need to reduce the file size of your photos that you use on your blog posts and other content, logo files, graphics etc. The good thing is that you can significantly reduce image size without compromising quality.

                 If you use WordPress, use a plugin like EWWW Image Optimizer which optimizes your images as you upload them (can also optimize them in bulk in Media Library). 

#5 Optimizing the size of image :-

        If the image of your blog and website take lots of spaces at your blog then there is a change for taking more time to loading the blog. Thus there is advisable to take help of some picture editor tools to optimize the size of the image. Below there are some external picture editors which is very much useful-

  • JPEG and PNG Stripper


  • Using Online Image Optimizer is also a great internet marketing strategy

  • Smush.it is also a great tool

  • SuperGIF
                      If you are using 700 X 700 pixels size image for 400 X 400 to your post means, edit that image size in mspaint , photoshop or any other online image editing tools.

Always use image .PNG, .GIF type images instead of .JPEG, .JPG. This will reduce your page load time.
          

#6 Limited Widgets :-

                   Widgets are very much important for a blog. However, sometimes it may cause some problem and the loading time of your blog may increase due to some widgets. Thus, it will be good to use

  • Avoid pop-up widgets

  • Do not implement too much social media widgets

  • Use only necessary widgets


By limiting the uses of widgets you can able to reduce the loading time of the blog and your blogging experience will be very much delightful.

#7 Compress your website with g-zip :-

      Compression reduces response times by reducing the size of the HTTP response. Gzipping generally reduces the response size by about 70%. Some caching extensions / plugins do it automatically, sometimes you need to set it up manually at the web server level.

#8 Add an Expires header :-

          Browsers use cache to reduce the number and size of HTTP requests and hence making web pages load faster. A web server uses the Expires header in the HTTP response to tell the browser how long a component can be cached. For static components: implement “Never expire” policy by setting far future Expires header, and for dynamic components use an appropriate Cache-Control header to help the browser with conditional requests.

While most caching systems take care of it, you need to look into it.

#9 Limited Advertisement :-
      
        It is advisable to reduce advertisement during blogging in the respective blog. Advertisement is coded with JavaScript and this will enhance pressure on the blog.

#10 Switch off all the plugins you don’t need or use :-

            I see a lot of WordPress and other sites that have a ton of plugins / extensions installed that are actually not used. Many of them require loading different css and javascript files – all that slows down your site. Perform a plugin audit and switch off all the plugins you don’t use.

Conclusion

"Those above are some significant tips are required to be followed in the blog/website for better performance of it and improving user experience and revenue at the same time.These tips are considered as best internet marketing strategy for blogging."

Insert Adsense Ads & Chitika Ads inside your Blogger Posts






                       As you know that if you want to earn handsome amount of money through an advertising program .You need a good advertisement placement plan . Placing ads between title and post can be very useful . It means more clicks and more revenue .If your platform is blogspot , so today's tutorial is for you .             


 In this post we will see how to place AdSense Ads & Chitika Ads Above Or Below Posts or Anywhere in Blogger.

                   Firstly you need an HTML Parser tool to convert your Chitika ad code into the XML format . Go to this Post and convert your Chitika ad code into the XML format through this tool and save it in notepad .



Go to blogspot dashboard and click on << Template << Edit Html >>


Tick mark on " Expand Widget Templates  " and if you want to place a Chitika ad between title and post body , press " F + CTRL " and search this line . 



<div class='post-header-line-1'/>




 IF YOU WANT TO SHOW IT ON LEFT SIDE

<b:if cond='data:blog.pageType == "item"'>              
<div style="float:left;">                                                
Your Converted Chitika Code Here (Saved in notepad)
</div>                                                                             
</b:if>                                                                            

IF YOU WANT TO SHOW IT ON RIGHT SIDE

<b:if cond='data:blog.pageType == "item"'>                 
<div style="float:right;">                                               
Your Converted Chitika Code Here (Saved in notepad)
</div>                                                                             
</b:if>                                                                            

IF YOU WANT TO SHOW IT AT THE CENTER


<b:if cond='data:blog.pageType == "item"'>               
<div align="center">                                                      
Your Converted Chitika Code Here (Saved in notepad)
</div>                                                                                
</b:if>                                                                               

Save the template and see results .

             If you want to place Chitika ads on below the post so follow these instructions . Go to blogspot dashboard and click on << Template << Edit Html >>




Tick mark on " Expand Widget Templates  " and  Press " F + CTRL " and search this line .


<data:post.body/>


Now paste your desired code after this line and save template and see results .

 IF YOU WANT TO SHOW IT ON LEFT SIDE


<b:if cond='data:blog.pageType == "item"'>                      

<div style="float:left;">                                                         

Your Converted Chitika Code Here (Saved in notepad)       
</div>                                                                                       
</b:if>                                                                                       


IF YOU WANT TO SHOW IT ON RIGHT SIDE



<b:if cond='data:blog.pageType == "item"'>               

<div style="float:right;">                                               
Your Converted Chitika Code Here (Saved in notepad)
</div>                                                                               
</b:if>                                                                              

IF YOU WANT TO SHOW IT AT THE CENTER




<b:if cond='data:blog.pageType == "item"'>               
<div align="center">                                                      
Your Converted Chitika Code Here (Saved in notepad)
</div>                                                                               

</b:if>                                                                              



          So, Now it’s your turn to 



earn handsome amount of money through an advertising.I

f you know about any other method, do let us know in the comments.
-
     
      In this post we will see how to add related posts to Blogger. You should not leave your blog visitors when they finish reading your post. 

 Just add “You might also like” or “related posts” below every posts and have three to four linked pages with thumbnail images and send your visitors to related posts. By adding related posts below your Blogger posts you will get more page views. The more page views in more Alexa rank and more the rank is more you have the chance of making money.


 How to add related posts to Blogger  :-

            To add related posts in Blogger all you need is related posts widgets which you can create one at link within...

                       Go to linkwithin.com and you will see a space for get widget. Enter your email address, your blog URL, select the platform as Blogger. In width select whether you want 3,4 or 5 related posts for your Blogger to display. If your Blogger template is dark then check that box that says “my blog has a light text on dark background” and click Get widget.


Now at the next page you will see install widget on Blogger, Click that link which says install widget.

       Now a new window opens like this. If you have more than one blogs then select one from that list where you wish to display related posts. In link title change the link within to Related Posts and click add widget.


         In your Blogger layout settings you can see the related posts widget that gets added in your sidebar. For best results you must drag the related post widgets and drop it below your blog posts.
Now open one of your Blogger posts and you will see the related posts displayed with thumbnails. Happy Blogging!

 Hope you enjoyed this article on how to add related posts to Blogger.

5 Basic Pillars of Creating Successful and Profitable Blog!

By saps 
To a lot of people blogging is deemed as “difficult” to create a profitable blog and making money from it seems next to impossible. I believe making money blogging is very easy and this is the mindset I approach my blogging ventures with and is also the same mindset you should have. The basic components of a creating a profitable blog blog are simple if you get everything right from the start. The only challenge is the execution of making money online. A lot of people have high aspirations of making money online but what most of them seem to be lacking is the right mindset, patience, dedication and perseverance.
Blogs have become one of the most popular past times in our day and age today, and it almost seems like everyone on the web is looking to start a blog. When the idea of the weblog was first created in 1997, the idea of making money had not even been a factor but now it seems that everyone is writing about something they love and making money from it.
So how do they do it? Well, having extensively studied many successful blogs online, I have compiled a list 5 basic but very important components that will factor in whether you are successful online and if you take the basics of the top bloggers and apply them into your own blogging, then you too can make a profitable blog in less time. Below are 5 Basic Pillars of Creating Successful and Profitable Blog..

12 Things to Do Before Applying for Google Adsense

By Saps 
I know many of you want to make some good money with adsense right? 
But it’s not easy to get into adsense program now a days. You have to do few things before applying for adsense.
Google Adsense is world’s larges Ads Network and works at Pay Per Click system. It’s paying rates are better than all of other networks which is the biggest reason it is so popular to all Bloggers and Webmasters. But since everybody is running behind them, they have made the approval system very strict. You make little mistakes and get disapproved every time. So you need a complete guidance and list of thing that you need to do before applying for Google Adsense and supposing that you are ready.
12 Things to Do Before Applying for Google Adsense

12 Things to Do Before Applying for Google Adsense

1. Privacy Policy :

One of the common mistakes that every Blogger makes and that I made many times before finally getting approved. Even though there are people out there who say that having a Privacy Policy for a Blog doesn’t makes sense but they are wrong.
A Privacy actually describes to your readers about what they will get on your Blog , what they should do and what they should not. So obviously there is nothing bad in having a Privacy Policy. While it can affect somehow on your Adsense Approval, you must give it a try. You can write it yourself or find Privacy Policy Generators online (You don’t need a lawyer anyway).

2. About Page

An About has major role and importance if you don’t want to apply for Adsense. But when it comes to Adsense, they are about Zero chances of getting approved if you are not showing this page.About page simply describes about you and your Blog . This will not only help you establish a relationship with readers but it will also make them trust upon you.

3. Contact Us Page

It’s quite obvious that everyone has his/her own opinion. What one of your readers likes may be bothering someone else. Than it is better to give them opportunity to speak up to you and tell how they feel about your Blog, what they want to be edited , what they liked or hated.
It will also show the Google Adsense Team that is viewing your site that you actually care about your readers and not only the money and Adsense.

4. Name/ Email Verification

Make sure to put you Name and Email address in some easily visible area like About Me and Contact Us pages. It will confirm to Google Adsense Team that it is the same person who applied for Adsense and not some spam, crappy bots.

5. Age Verification

I’m really laughing out typing this. ;)
Why?
Because this is where I encountered a problem. Instead of 18, I accidentally published my age as 17 while on Adsense Application Form, it was accurately 18.
Hence there started a problem . Because Google Adsense is not for under 18 people. I realized this problem after being disproved a few times without any legitimate reason. So I advice you to be accurate while typing your age.

6. Minimum Number of Posts

There is no exact answer. Not even one. Because I have seen very established Blogs with 400+ posts and their owner telling me that Google Adsense is rejecting them while somewhere ,people with 40,50 posts are enjoying making money. Exactly what I said that there is no actual answer. However, we can always predict things. According to my experience , you should only apply after you have more than 70 posts. Posts length should must be 500+ words too.

7. Design

Your Blog is the biggest thing after Content. This represents your expertise ,experience and Professionalism. So be careful because anything can kill your Chances.

8. Content Type

Be careful with what type of content you are publishing. Because it is something that truly matters. Google Adsense is not for Pornographic, Illegal Items, Drugs or other Blogs / Sites like that. Also Adsense team won’t be willing to allow you to step in if you own a Non English Blog. Having posts shorter than 300 words in length is also Red Signal.

9. Providing Value

Don’t complain about not making money and don’t clearly state that your are Blogging for Money only and have no other interest in it. Because this will show them that you will not be providing values to your readers any day. Hence another Red Light glows up.

10. Top Level Domain

12 Things to Do Before Applying for Google Adsense
Those are gone far away when Adsense used to approve “Blogspot” and “WordPress.com” Blogs. As for today, you must have your own unique domain that specifies your Blog. If you don’t have one yet, stop dreaming about getting approved with Sub domains and go buy a Top Level Domain.
Another important thing about domain is it’s age. Because for most of Asian Countries, Adsense has placed an age restriction. They don’t accept any sites before they are 6 months old.

11. Other Ad Networks

If you have any other Ads placed like Chitika, Clicksor or anything, it’s time to drop them off.
Even Google Adsense allows you to use other Ad Networks along with them, it’s better to remove the ads before Applying and don’t put them back until you get a reply from Adsense Team.

12. Paid Traffic 

Google hates the sites that are getting Paid traffic and mostly penalizes them so there is not a damn chance of getting Adsense Approval letter for a site that is getting paid traffic. You can bring traffic from Search Engines or any other way you want but if you want to earn via Google Adsense the right way, paid traffic is not a solution.

-

What Is the Difference Between Tags & Labels in Blogspot?

by SAPS

Tags in Blogger are used in regard to HTML, while labels are a classification system.
Tags in Blogger are used in regard to HTML, while labels are a classification system.
Blogger is Google's push-button publishing website; registered users can choose a domain name ending in ".blogspot.com" for their website. Blogger's user-friendly interface gives users the ability to design their website using pre-designed templates, but it also has the flexibility to allow users to modify or create their own HTML. While tags are used in this creation and modification of HTML, labels are used to categorize and organize individuals posts.
When you click on the "New Post" button on your Blogger dashboard, you are sent to a page with a large text box for composing your post. Scroll down to the bottom of this text box to see a section titled "Labels for this post" with a smaller text box next to it. You can place single words or longer phases in this box; whatever you choose to write here, it should reflect what your post is about. While labels are an optional, added feature to your blog -- one that benefits both you, the author, and your readers -- tags are a standard part of your website. This is because they are a part of the HTML, the computer language used to build your website. In fact, HTML tags are even used to build and give labels their functionality on your website.

How Your Readers See Them

While your readers can see and use labels on your blog, they can't see tags directly. When you publish a post with labels, the labels you assigned to it are published along with it; they appear underneath your post title. Readers who click on one of the labels are redirected to a page where all of your previously published posts labeled with the same word or phrase are listed. This gives readers an easy way to navigate your blog based on category. Unlike labels -- which are visible to your readers -- tags are not immediately apparent; what you write in a tag does not directly appear on your blog. Instead, Blogger translates the information in these tags, turning it into text, pictures and template commands that give your blog the style and layout you desire.

Gadgets

Labels and tags both play a role in the use of gadgets -- sometimes referred to as widgets -- on your blog. Tags, the HTML building blocks for website design, allow you to create a widget that displays the labels assigned to your various posts on your blog's sidebar. In this situation, the two work in tandem to produce a tangible result on the blog that allows readers to interact with the site by giving them a place to not only see all the labels assigned to various posts, but to navigate them quickly and easily. The tag for the label widget looks like this:
<b:widget id="header" type='HeaderView' locked="yes"/>
<b:widget id="myLabels" type='Labels' locked="no" title="My Blog Topics"/>

Examples

While all tags look basically the same, their functions vary widely. Tags can change the alignment of font within a post, such as this:
<center>This text will be centered on the page.</center>
The tag "<center>" is the opening part of the tag, while "</center>" is the closing part of the tag. Anything that appears between the opening and closing portions of the tag will be affected by the tag's command; in this case, the instructions to center text. Tags can also command whether or where information should be displayed, such as:
<MainPage> </MainPage>
Anything that appears between the opening tag (<MainPage>) and the closing tag (</MainPage>) appears only on the front page of your blog; for example, a widget or biographical blurb placed between these tags won't appear on individual post pages. It will appear on your blog's home page.
A label, on the other hand, requires no HTML knowledge. Instead, using a label simply requires you to summarize your post in a few key words. For example, if you wrote a post about your family's summer vacation to Walt Disney World, you might use "family vacation," "Walt Disney World" and "Florida" as your post's labels. There is no rule for how many words each label can have; they can be as long or as short as you choose. Insert a comma between each label to signify the end of one label and the beginning of another.
Please Recommend Us On Google     
Subscribe to: Posts (Atom)

Copyright © 2014 Blogger Templates Designed By: Templatezy