Wednesday, March 21, 2012

Google Wallet Re-Enables Prepaid Credit Card Support For Users

Google Wallet users will remember that back in February Google suspended the ability for users to use prepaid credit card functions within Google’s service. In an attempt to respond to reported security flaws
Google Wallet
Well if you have missed the ability to use your prepaid credit card functions with Google Wallet you might be pleased to know that Google has now re-enabled the service for users.
Google also wanted to apologise to users that have been effected by the suspension of the prepaid credit card service, with another $5 payment for any inconvenience they may have caused. Google explains:
Hello,
As you may have experienced over the last few weeks, we temporarily disabled the feature to add the Google Prepaid Card back to your wallet if you previously removed the card or reset your wallet. We temporarily disabled this feature to ensure the security of our Wallet customers. We recognize this may have been an inconvenience for you, and we did not make this decision lightly.
We are happy to announce that you can now add the Google Prepaid Card back to your wallet with the newest version of Google Wallet, and any funds that you previously had on the card should be restored, unless you contacted Money Network and asked for a refund of those funds. To add the Google Prepaid Card back, you will first need to update your Google Wallet application to the most recent version.
To compensate you for any inconvenience this may have caused, we have credited an additional $5 (five US dollars) to your Google Prepaid Card. If you have further questions or concerns, feel free to contact us at 855-492-5538.
Thank you for your continued support of Google Wallet, and we look forward to launching many new and exciting features for you to enjoy in the coming months.
Sincerely,
The Google Wallet Team



New Samsung Galaxy S III Image Leaked

We heard earlier today that we may get an official announcement from Samsung on their new Galaxy S III smartphone some time in April, and now another image has been leaked which is reported to be of Samsung’s new flagship Android smartphone.
The image below is from the guys over at GSM helpdesk, and it apparently looks very similar to previous leaked images of the handset.
Galaxy S III
We still don’t have any official specifications on the new Samsung Galaxy S II, but the device is rumored to feature a quad core 1.5GHz processor and a 12 megapixel camera.
As soon as we get some more information on the new Samsung Galaxy S III we will let you guys know.



LA Noire Touch Edition For Android Via OnLive Announced

It seems like a lot of game to fit onto anything with a screen 10 inches or below in size, but apparently OnLive is making a go of updating its version of cop drama LA Noire with a touch-friendly interface for mobile platforms, specifically Android. No information yet on whether an iOS version is forthcoming.
The resulting effort is being described by OnLive’s Steve Perlman as “the highest-performance console video game developed specifically for touch-enabled play via mobile cloud gaming. Ever.” A lot of qualifiers for that superlative, but definitely an admirable and entertainingly disruptive move on OnLive’s part.



TiVo Android App In Development, iOS App Update Rolls Out

TiVo has announced a new update has rolled out for their iOS application, taking the release to version 1.9. The new update brings with it new additions to “Browse”, making it easier to discover and find TV shows and films.
TiVo have also added the ability to create a WishList search within the iOS app. Allowing you to find a TV show or movie you want to watch, and add it to a list if its not currently available to record. Once added the program or film will automatically record the show when it next appears on TV.
TiVo iPad App
In today’s announcement TiVo has also revealed that an Android companion app for their service is also in development and is expected to be launched this summer. We will keep you updated on that as more information becomes available.
The TiVo app is supported on both the iPad and iPhone and is now available to download from the iTunes App Store for free.



Splinter Cell: Extinction Fan Made Live-Action Short Movies (videos)

Splinter Cell gaming fans out there are sure to enjoy this fan made live-action series of short movies which have brought the popular video game into real life. You can watch the series, currently four short approximately 10 minute movies, in their release order after the jump. Enjoy!
Splinter Cell: Extinction
“Corbin, a Third Echelon operative, infiltrates a hostile compound to detain a high-value target. But things don’t go as planned and soon, he’s in a fight for his life against the greatest threat he’s ever faced – his own agency.”
**Extinction is a fan made series created to celebrate the Splinter Cell franchise. It is not affiliated with Ubisoft and in no way represents their original work.




Galaxy Nexus To Get Android 4.0.5 Next Month

It looks like the Samsung Galaxy Nexus may be getting an update to Android 4.0.5 some time next month, as Verizon are reported to be testing the update for the handset.
According to @black_man_x, is currently being tested on the Samsung Galaxy Nexus with US mobile carrier Verizon, and is expected to be released early in April.
Samsung Galaxy Nexus
As yet we don’t have an exact date on when the Samsung Galaxy Nexus will get the Android 4.0.5 update, as soon as we get some more information we will let you guys know.



Samsung Galaxy S III To Launch In April

We have been hearing rumors for a while that the new Samsung Galaxy S III would be announced some time in May, with the device going on sale some time in June.
Now it would appear that Samsung could move the launch of the new Galaxy S III up a month and we may get some sort of official announcement from the company in April.
Galaxy S III
The news comes from Samsung’s Greater China President, Kim Young-Ha, who has been speaking to the press in China and has confirmed that the company are considering moving the launch date.
This is the first official word we have had from anyone at Samsung on the actual launch date of the new Galaxy S III, as soon as we get some more information we will let you guys know.



New Ready To Use Rss And Social Icons For Your Blog

In this post i have a brand new set of stylish icons you can use on your blog for readers to subscribe and follow you on social platforms.I really liked the look of this icon set and it includes an icon for Google + (Plus) you can use for people to check out and follow you on Google's new social network.In total i have four icons here for Facebook, Twitter, Google Plus and your Rss Feed.However the complete set has 24 icons for other sites including YouTube, LinkedIn and Stumble Upon, the complete set can be found on Social Icon Studio.

Live Preview


Use The New Social Icons On Your Blog


Step 1. In Your Blogger dashboard click Design > Add a gadget > Choose Html/Javascript





Step 2. Copy and paste the following code into the html gadget then make the changes shown below.

<a href="http://facebook.com/geekyvalley" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhhaKHl9Xcf4NFWpVNisVhyphenhyphen7RG0qffm4G27W2K14_wjSiDOAHAfWiVPJNzyqjrMgwarK2RRxhHMUFfYoh1Fo3Iv_vSYXFbNHuf0jMJ1td67NS8thnuS_uvXhg4JQAP8mYM92lI2WfIJFHk/s1600/facebook-30x43.png" /></a><a href="http://twitter.com/GeekyValley" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgVo8HeQqZd2gAaOfu0gnfGgJNVfttcGGG-Ss-41RdzDfkADXx8Yk4u9cdhw94opzOvWpYHgkSHoXNkC8AXdu4C15L4DcB7OBV63xjBnWMJkbdDxs7nS8y81np2YHaUbootoKU32IzUp3M/s1600/twitter-30x43.png" /></a><a href="https://plus.google.com/u/0/117023786342362231815/" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh5QwG5pfDII0j83lwQWwOGVb2ae5tSCkwc0vjZ_zwPsGMAIwOjTjZH2PQ-Rh68mI0Y_HnHZk2_Rb_G5hFrF1pqk1YZ_NOl4TzkkDFsFMokRLD3KmPwQwsyH-hQnqs3kIJG2sifZ6fHAK8/s1600/googleplus-30x43.png" /></a><a href="http://feeds.feedburner.com/GeekyValley" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjBkcwd7QmRnkZMpbLifER_XaNnFMFO1L4izRYIIxbcNiQOErdwT_QUQX06G56-i9kyhKXtuGh6s7wzSQMtAypwPf98d9frOpdDovqnZhmvHDNuQCx00Xvyzvo9nF-1UN1Iub92s3CvIfs/s1600/rss-30x43.png" /></a>
Note - Change the links in yellow to your social and feed links.

Step 3. Save the gadget and your done.

Drop Your Comments And Questions Below.



Cool Shareaholic JQuery Slide Bookmarking Gadget With Tooltips And Counters For Blogger

Over the years on Spice Up Your Blog i have found Social Bookmarking gadgets to be amongst the most popular posts.Whats more the most popular Bookmarking gadgets have been from the "Sharing Is Sexy" series.Back in May 2011 we published a post with The Awesome Complete Animated Sexy Social Bookmarks V3 For Blogger, that post really did cover all options.Today i want to give you something similar but with some cool extras.The Shareaholic bookmarking widget still has the "Drop Down" and "Slide Up" features but also features tool tips and counters showing how many times your posts were shared.Take a look at the demo and screenshot below (for the demo scroll to the foot of the post on the test blog).



View Demo Button 

Add The jQuery Slide Bookmarking Gadget To Your Blog


Remember Always Back Up Your Template Before You Make Changes -

Step 1. In Your Blogger Dashboard Click Design > Edit Html > Tick The Expand Widget Templates Box

Step 2. Find the following piece of code in your blogs Html : (Click Ctrl and F for a search bar to help find the code 

]]></b:skin>

Step 3. Copy and Paste the following code Directly Above / Before ]]></b:skin>


div.shr-bookmarks{margin:20px 0 8px;clear:both !important;display:block !important}div.shr-bookmarks ul.shr-socials{width:100% !important;margin:0 !important;padding:0 !important;float:left !important}div.shr-bookmarks ul.shr-socials{background:transparent none !important;border:0 none !important;outline:0 none !important}div.shr-bookmarks ul.shr-socials li{display:inline !important;float:left !important;list-style-type:none !important;padding:0 !important;height:29px !important;width:60px !important;cursor:pointer !important;margin:3px 0 0 !important;background-color:transparent !important;border:0 none !important;outline:0 none !important;clear:none !important}div.shr-bookmarks ul.shr-socials li:before,div.shr-bookmarks ul.shr-socials li:after,div.shr-bookmarks ul.shr-socials li a:before,div.shr-bookmarks ul.shr-socials li a:after{content:'' !important;}div.shr-bookmarks ul.shr-socials a,div.shr-bookmarks ul.shr-socials a:hover{display:block !important;width:60px !important;height:29px !important;text-indent:-9999px !important;background-color:transparent !important;text-decoration:none !important;border:0 none !important}div.shr-bookmarks ul.shr-socials a:hover,div.shr-bookmarks ul.shr-socials li:hover{background-color:transparent !important;border:0 none !important;outline:0 none !important}.shareaholic-show-on-load{display: block !important;}div.shr-bookmarks div.shr-getshr{line-height:20px !important;padding-left:8px !important;float:left !important;}div.shr-bookmarks div.shr-getshr a{width:auto !important;font-size:10px !important; text-indent:0px !important;text-decoration:none !important;}div.shr-count{font:12px bold,arial !important;position: relative !important;}div.shr-count-outline{position: absolute !important;color: white !important;}div.shr-count-center{position: absolute !important;color: blue !important;}li.shr-2{background-position:-120px bottom !important}li.shr-2:hover{background-position:-120px top !important}li.shr-3{background-position:-180px bottom !important}li.shr-3:hover{background-position:-180px top !important}li.shr-5{background-position:-300px bottom !important}li.shr-5:hover{background-position:-300px top !important}li.shr-7{background-position:-420px bottom !important}li.shr-7:hover{background-position:-420px top !important}li.shr-10{background-position:-600px bottom !important}li.shr-10:hover{background-position:-600px top !important}li.shr-38{background-position:-2280px bottom !important}li.shr-38:hover{background-position:-2280px top !important}li.shr-40{background-position:-2400px bottom !important}li.shr-40:hover{background-position:-2400px top !important}li.shr-43{background-position:-2580px bottom !important}li.shr-43:hover{background-position:-2580px top !important}li.shr-52{background-position:-3120px bottom !important}li.shr-52:hover{background-position:-3120px top !important}li.shr-74{background-position:-4440px bottom !important}li.shr-74:hover{background-position:-4440px top !important}li.shr-88{background-position:-5280px bottom !important}li.shr-88:hover{background-position:-5280px top !important}li.shr-106{background-position:-6360px bottom !important}li.shr-106:hover{background-position:-6360px top !important}li.shr-201{background-position:-12060px bottom !important}li.shr-201:hover{background-position:-12060px top !important}li.shr-219{background-position:-13140px bottom !important}li.shr-219:hover{background-position:-13140px top !important}

Step 4. Find the following piece of code in your blogs Html : (Click Ctrl and F for a search bar to help find the code 

<div class='post-footer'>

Step 5. Now Copy And Paste This Code Directly Below / After <div class='post-footer'>

<!--Start Ssocial Bookmarks from http://www.spiceupyourblog.com -->
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div class='shr_class shareaholic-show-on-load'>
</div>
<script type='text/javascript'>
var SHRSB_Settings = {&quot;shr_class&quot;:{&quot;src&quot;:&quot;http://www.shareaholic.com/media/css/styles/sb&quot;,&quot;link&quot;:&quot;&quot;,&quot;service&quot;:&quot;5,7,2,38,3,219,43,52,201,88,74,10,106,45,40,210,78,39&quot;,&quot;apikey&quot;:&quot;6ffe2cbf142c45bd4cd03b01ec46b8658&quot;,&quot;localize&quot;:true,&quot;shortener&quot;:&quot;google&quot;,&quot;shortener_key&quot;:&quot;&quot;,&quot;designer_toolTips&quot;:true,&quot;twitter_template&quot;:&quot;Some fancy post title - http://goo.gl/dbqlx via @paulcrowepro&quot;}};
</script>

<script type='text/javascript'>
(function() {
var sb = document.createElement(&quot;script&quot;); sb.type = &quot;text/javascript&quot;;sb.async = true;
sb.src = (&quot;https:&quot; == document.location.protocol ? &quot;https://dtym7iokkjlif.cloudfront.net&quot; : &quot;http://cdn.shareaholic.com&quot;) + &quot;/media/js/jquery.shareaholic-publishers-sb.min.js&quot;;
var s = document.getElementsByTagName(&quot;script&quot;)[0]; s.parentNode.insertBefore(sb, s);
})();
</script><a href='http://www.spiceupyourblog.com/' target='_blank'>Blogger Social Bookmark Gadget</a></b:if>
<!-- End Social Bookmarks from http://www.spiceupyourblog.com -->

Important :

Change paulcrowepro in red with your twitter username, if you dont have a twitter username please remove paulcrowepro and leave it blank.

The two sections of code in yellow make the gadget only appear below your posts on the post pages not the home page.If you want the gadget to appear on your home page remove the two snippets.

Step 6. That's it save your template and check out your cool new gadget.

Credit for the original version of this goes to Shareaholic.

Drop Your Comments And Questions Below.



Tips And Guidelines For Accepting And Publishing Guest Posts On Your Blog

 
Guest Blogging has become hugely popular over the last few years.It is also hugely beneficial for both the guest submitting the post and the blogger publishing the post.The main benefit for the guest blogger lies in their work being shown to a new and often larger audience and of course those ever so valuable backlinks in the author bio section at the foot of their post.Indeed many articles have been written on the benefit of becoming a guest author and strategies in writing and submitting guest posts.

But what about the other side of the coin, the blogger looking to publish guest posts.Here i want to look at my personal experience as a blogger going from wondering if the link to submit guest posts on my blog was working to receiving up to 50 posts and enquires weekly.While it's fantastic having such an interest from bloggers all over the world in contributing, not all submissions have your blogs best interests in mind.I have probably only actually published between ten or twenty percent of posts submitted.

As the number of guest post submissions increased i realised i needed a system to deal them.I also realised i needed a strict policy and set of rules.

First i have 4 basic Guest Post rules.

1. Post must be on topic with your blog - On my blog that covers blogging tips and tutorials i have received posts on topics as far afield as Picking a cellphone to buying a used car.While you may think its easier to just ignore emails with such posts you may end up wasting time opening follow up emails, i reply with simply "No Thanks post is totally off topic".In one case a blogger has accidentally sent me the wrong post and the post that was written for my blog was subsequently published so do reply.

2. Post must have no links in the body - The accepted rule in guest posts is two Do-Follow links for the author in the foot of the post.However i have received countless posts stuffed with links to the authors sites.Of course there are exceptions, some posts use references that will require a link.In such cases links advance the post and are not an author looking to benefit.Recently i have been contacted by writers for SEO company's that submit

3. Quality - I know when i started to receive guest posts it was exciting in the same way as the first few comments you receive as a new blogger.This can lead you to perhaps letting your standards drop in an effort to publish those first few guest posts.However i feel you need to be strict when it comes to quality right from the start.If I'm unsure of a post i will delay replying and take a second look the following day, i find on a second read i usually know if it's up to scratch or not.

4. Exclusive - Every guest post much be original and not published anywhere else.Posts should be written for your blog and your audience.One post sticks in my mind when it comes to this.I read a post submitted for my blog and was extremely impressed but i had a feeling i had seen it before.I copied a few of the main phrases from the post and popped them into Google and sure enough when i searched i found the post published previously numerous times.

In Search Of Backlinks


One of the trends i have seen recently is SEO company's hiring writers to submit guest posts to blogs.Webmasters and Bloggers hire SEO company's to help their sites performance on search engines.One of the best ways for an SEO to do this is by building backlinks to their clients site.We all know building backlinks is not easy, even for experienced SEO's.With this in mind SEO's have taken advantage of the Guest Post.Writers create and submit posts with the sole purpose of linking to the clients website.

I guess this would not necessarily be a bad thing if the posts were quality and did not break any of the 4 rules above.But i have found these posts are written with the sole purpose of building links, not providing information to my readers.The posts are often off topic, stuffed with keywords connected to the site they link to and contain links in the main content.Indeed many posts submitted by these writers will have an external link in the first paragraph and no author bio, a real indication of the posts purpose.

Don't Be Afraid To Edit


Once you have received a post you are happy to publish it does not need to be a direct copy and paste, remember you have the final say on how it's published.Don't be afraid to make changes to the title or content if you think it will improve the finished article.

Saving Time


As mentioned i receive many Emails from potential guest writers.Replying to each individually can become very time consuming.With that in mind i have a collection of messages ready to copy and paste into my reply.Then all i have to do is add the name of the recipient and extra info if needed.

These include :
  • A reply message to original enquires.
  • A reply message accepting a guest post.
  • A reply message declining a guest post.

This is an example of a reply message to original enquires :


Hi Name,

Thanks for getting in contact.

I'm always looking for quality guest posts so feel free to submit a post in the format your most comfortable with.

You will receive 2 links in the author bio section, but links (Unless necessary to the post) can not be added to the main content.

Further details can be found here - Link To Your Guidelines Page .

Regards,

Name.



Guest Posts can be a fantastic content resource, But don't lower your standards or let your blog become a link farm for cunning SEO's.

Drop Your Comments And Questions Below.



Social Bookmarking Buttons With Spinning Effect for Blogger

Till now many social bookmarking widgets has been released for Blogger. Simply, social bookmarking buttons and icons helps you to make your blog socialize and get more traffic. Adding social bookmarking buttons is cool way to get more readers and targeted audience.


Before using social bookmarking option, you must be aware of icons design how much clickable is it. Your readers are likely to click social bookmarking button containing in your blog if they find the buttons really cool. If you haven't such buttons, so here is something special for you.

Social bookmarking buttons with spinning hover effect. Buttons are cool itself and when your reader hover the mouse over it, it spins a round.

Check the demo yourself!

Here is how to add these cool buttons to your Blogger blog:

Login to Blogger > Design > Edit HTML > Expand widget templates. Find the following code in your template:

<data:post.body/>

Just below that add the following group of codes:

<b:if cond='data:blog.pageType == "item"'>
<div class='spinning_icons'>
<a class='twitter' expr:data-text='data:post.title' expr:data-url='data:post.url' href='http://twitter.com/share' rel='nofollow' target='_blank' title='Twitter'>Twitter</a>
<a class='delicious' expr:href='&quot;http://del.icio.us/post?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' target='_blank' title='Delicious'>Delicious</a>
<a class='digg' expr:href='&quot;http://digg.com/submit?phase=2&amp;url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' target='_blank' title='Digg'>Digg</a>
<a class='facebook' expr:href='&quot;http://www.facebook.com/sharer.php?u=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' target='_blank' title='Facebook'>Facebook</a>
<a class='stumbleupon' expr:href='&quot;http://www.stumbleupon.com/refer.php?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' target='_blank' title='Stumbleupon'>Stumbleupon</a>
<a class='rss' href='http://feeds.feedburner.com/hacktutors' target='_blank' title='RSS'>RSS</a>
</div>
</b:if>


Replace hacktutors with your feedburner username. Again, find the following code:

]]></b:skin>

Just above that code, past the following:


.spinning_icons a{
    width:48px;
    height:48px;
    display:inline-block;
    text-indent:-9999em;
    background-position:0 0;
    background-repeat:no-repeat;
    z-index:2000;
    overflow:hidden;
}
.twitter{ background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi3kmh03RLxrDg4wZufYA8Ws_XXqhY-G8L3cDY4waNTrejozU_1fgR7cpTXT9yCxazWZWQcprON6K9H2C-USBvqCW_B2KCbiYB55TJZcAh2LbyAWbEmXAK6lDBqNgcGuso7jhz0UOeSuJM/s1600/twitter_32.png'); }
.delicious{ background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg2WSde-4GmEgir1srgWq0d5XqKcl7ivl-rWvt2JMqVkRntt9PqZBgp8D0Okl9nR74aFiaUILvXYJUfUuHrW_fa1wB38jRlox1r6wuWXJXkoXFCkABifjLFj6dR9_2ukJhvthchJGnko54/s1600/delicious_32.png'); }
.digg{ background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEim7Fu4qWrRbS7LAt2sLOYo0jwvwFACjemO5gkoMRCtRnJGYOHuGmklRjCPQrinM8w89FffuW62PHI3IUBtiBzhw-UqSroNMp7o93yNRqNd_vP_ElOz6RUfVYhM0yY3ubakdV8bVeetz6s/s1600/digg_32.png'); }
.facebook{ background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiyJkxMcnFUnDS0GKc7Z37nJ7I5cPJ-SvHe3_2OXh3Pc0lohrDGELoBR3tuTCMUdMOBj0F_Z6DXad2RJx6Oc6koheFUq1EvE8Te3mO8ADW3xOoX7vj-Re0L1IrHtV6KRp4rXIAUhRxUyv0/s1600/facebook_32.png'); }
.rss{ background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgWw74app5biR7ocW55dPRQ9_liEW5wysKIHNN5jZlxPAjhPeGS4a1GGFxfSu0_i-X8qbMDmJMj0UIlYuPAeer4j_CHFt-k-W5RtOwP4fFT2_bQNhPyEazCdSWSLwQzegQhQU2wtaH4IBQ/s1600/rss_32.png'); }
.stumbleupon{ background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjCO5Cxoa4JtjwPVfowlrJmLCWlY7m3ZYxkJL9yHwolUBUpbA2Zyrn7Kerd0QbjIvLN3-uDX5wy4o8thBcGk9uxPgDG3mza-4MdgilvCzZtBbrjs0kaRduPVBKYaqT0ypyS6HMQZFOSXf0/s1600/stumbleupon_32.png'); }
.spinning_icons a:hover{
    transform: rotate(360deg);
    -webkit-transform: rotate(360deg);
        -moz-transform: rotate(360deg);
    transition: transform 0.2s ease-out;
    -webkit-transition: -webkit-transform 0.2s ease-out;
        -moz-transition: -moz-transform 0.2s ease-out;
}

Now save the template and your are done! Have a look at your cool new bookmarking button that appears at the bottom of your post.



Add Stylish Navigation Menu to Blogger

This is the our first post about blogging. One of the most important gadget in blog is navigation menu. Navigation menu help to you access your blog category pages, and your blog readers can easy to access your category pages. So now we going to show you how to add stylish animated navigation menu to blogger/blogspot. This navigation menu make your blog attractive and stylish blog. 


Features:
1. Simple and very easy to add
2. Menu with mouse hover effect and awesome look
3. Easy to add Links and use.

How To Add Navigation Menu To Blogger/Blogspot

1. Go to Blogger Dashboard by clicking here >Design >Edit HTML
2. Copy the below code and paste before </head>   
<style type='text/css'>
ul#topnav {
margin: 10px 0 20px;
padding: 0;
list-style: none;
font-size: 1.1em;
clear: both;
float: left;
width: 99%;
}
ul#topnav li{
margin: 0;
padding: 0;
overflow: hidden;
float: left;
height:40px;
}
ul#topnav a, ul#topnav span {
padding: 10px 20px;
float: left;
text-decoration: none;
color: #fff;
text-transform: uppercase;
clear: both;
height: 20px;
line-height: 20px;
background: #1d1d1d;
}
ul#topnav a { color: #7bc441; }
ul#topnav span {
display: none;
}

ul#topnav.v2 span{
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgjJQbZVxMcd9pla8HN9kVNsId-S2O6b03IacmXcTlj-Fb5Lt073IKg6rDDmAT-Co6nnxTwkxwEeBlv-_yYelOdTxPzjIaRjuawikyHljmg0nFWtksT4t5lS1lSqubmbfc1V0MM4HRiAIU/s1600/menu-bg-b-w.png) repeat-x left top;
}
ul#topnav.v2 a{
color: #555;
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgjJQbZVxMcd9pla8HN9kVNsId-S2O6b03IacmXcTlj-Fb5Lt073IKg6rDDmAT-Co6nnxTwkxwEeBlv-_yYelOdTxPzjIaRjuawikyHljmg0nFWtksT4t5lS1lSqubmbfc1V0MM4HRiAIU/s1600/menu-bg-b-w.png) repeat-x left bottom;
}
</style>
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.3/jquery.min.js' type='text/javascript'/>
<script type='text/javascript'>


$(document).ready(function() {


$(&quot;#topnav li&quot;).prepend(&quot;<span/>&quot;); //Throws an empty span tag right before the a tag

$(&quot;#topnav li&quot;).each(function() { //For each list item...
var linkText = $(this).find(&quot;a&quot;).html(); //Find the text inside of the a tag
$(this).find(&quot;span&quot;).show().html(linkText); //Add the text in the span tag
});

$(&quot;#topnav li&quot;).hover(function() { //On hover...
$(this).find(&quot;span&quot;).stop().animate({
marginTop: &quot;-40&quot; //Find the span tag and move it up 40 pixels
}, 250);
} , function() { //On hover out...
$(this).find(&quot;span&quot;).stop().animate({
marginTop: &quot;0&quot; //Move the span back to its original state (0px)
}, 250);
});


});
</script>
4. Then click SAVE TEMPLATE 
5. Once again go to Design tab >Page Elements >Add Gadget > HTML/Java Script
6. Copy the below code and paste it  


<div class="container">

<ul id="topnav" class="v2">
<center>
<li><a href="#">Home</a></li>
<li><a href="#">Download</a></li>
<li><a href="#">Internet</a></li>
<li><a href="#">Facebook</a></li>
<li><a href="#">Google</a></li>
<li><a href="#">Advertise</a></li>
<li><a href="#">Contact us</a></li>
</center>

</ul>

</div>

Important :- Replace # with your Link and change title your wish.. Save it 



Share

Twitter Delicious Facebook Digg Stumbleupon Favorites More