23 Mar 2012

How to add 'read more' with thumbnail in blogger post

These days every blogger loves to make his blog look professional and one such hack to make it so is read more hack, where the post would just show little bit of description with a small thumbnail    so I just collected a method to do this in a simple manner from way2blogging.org. So what are you waiting for just follow the tutorial given below.

Step 1 : Log in to blogger dashboard
Step 2 : Click on template and click edit HTML and click proceed
Step 3 : Check expand widget templates 
Step 4 : Find </head>
Step 5 : Just add the below code above </head>

<script type='text/javascript'>
var thumbnail_mode = "no-float" ;
summary_noimg = 430;
summary_img = 340;
img_thumb_height = 100;
img_thumb_width = 120;
<script type='text/javascript' src='http://bloggerblogwidgets.googlecode.com/files/auto_readmore_blogger.js' ></script>
Step 6 :  Now find <data:post.body/> and replace it with following code

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<b:if cond='data:blog.pageType == &quot;static_page&quot;'>
<div expr:id='&quot;summary&quot; + data:post.id'>
<script type='text/javascript'>
<div style='clear: both;'/>
<span class='rmlink' style='font-weight:bold;padding:5px;float:right;text-align:right;'><a expr:href='data:post.url' >Read more ... </a></span>
Step 7 : Save the template and refresh your blog 

Frequently asked questions?
How to change the width and height of the image?
You can just change the numbers in the step 5 code default values are 100 and 120, you can change it to any number of your desire until you get the desired size. The code to be altered is shown below.
img_thumb_height = 100;
img_thumb_width = 120;

How to increase the post content height?
To do this you have to adjust the numbers in code 5 for the below code.
summary_noimg = 430;
summary_img = 340;

keep on changing your numbers until you get your desired size.

How to replace read more text with a read more image?
in the code given in step 6 just replace the Read more... text with the following code and add your image url into the quotes.
<img href='PUT YOUR IMAGE URL HERE' /> 
21 Mar 2012

How to change 'newer posts' and 'older posts' links to post title in Blogger

Many people who have blogs in blogger want to make their blog look professional but few of its default features make them little bit sad. One such feature is newer and older post links at the bottom of the page. Now I have just collected a tweak from Bloggersentral though there are many ways I felt this one as the easier one so I am sharing it here.

See the below image it is how it looks like when you have replaced it with the tutorial given below.

Step 1 : Log in to your blogger dashboard
Step 2 : Click on Template
Step 3 : Click Edit Html and then click Proceed
Step 4 : Find </head>
Step 5 : Paste the below code above </head>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js"></script>
Step 6 : Save the template and go to layout
Step 7 : Click add a gadget and select Html/Javascript and add the below code into it and save.

<style type="text/css"> #blog-pager-newer-link {font-size:85%;width:200px;text-align:left;}
#blog-pager-older-link {font-size:85%;width:200px;text-align:right;}
<script type="text/javascript">
var newerLink = $("a.blog-pager-newer-link").attr("href");
$("a.blog-pager-newer-link").load(newerLink+" .post-title:first", function() {
var newerLinkTitle = $("a.blog-pager-newer-link").text();
$("a.blog-pager-newer-link").text("<< " + newerLinkTitle);
var olderLink = $("a.blog-pager-older-link").attr("href");
$("a.blog-pager-older-link").load(olderLink+" .post-title:first", function() {
var olderLinkTitle = $("a.blog-pager-older-link").text();
$("a.blog-pager-older-link").text(olderLinkTitle + " >>");//rgt
Now if you have done everything correctly just refresh your blog and you can see that your older page and newer page links are being replaced by the titles of the next and previous post. 

How to remove border or shadow from images in blogger

People who upload images in blogger post always have a ash colour border or shadow around the images. Many don't like to have that border around images.

In the above picture you can observe image with border and an image without border. So in order to have an image without border you just need to tweak a little bit of CSS code. Below is how you do it.

1st Procedure 
Step 1: Log in to your blogger Dashboard.
Step 2: Click on Template
Step 3: Next click Edit Html and click Proceed
Step 4: Search for ]]></b:skin>
Step 5: Add the below code just above it.
img{ box-shadow: none !important;padding: 0px !important;border: 0px !important;}
Hope this solves your issue you can also go to template designer and add the above code in the Add Css link.
8 Mar 2012

Apple's iPad3 going to hit the markets with retina display

Apple has introduced the new iPad, the third generation of its category defining mobile device, featuring a stunning new Retina™ display, Apple’s new A5X chip with quad-core graphics and a 5 megapixel iSight camera with advanced optics for capturing amazing photos and 1080p HD video.

The new iPad Wi-Fi models will be available in black or white on Friday, March 16 for a suggested retail price of $499 (US) for the 16GB model, $599 (US) for the 32GB model and $699 (US) for the 64GB model. iPad Wi-Fi + 4G for either AT&T or Verizon will be available for a suggested retail price of $629 (US) for the 16GB model, $729 (US) for the 32GB model and $829 (US) for the 64GB model.

The Retina display on the new, third-generation iPad makes everything look crisper and more lifelike. Text is razor sharp. Colors are more vibrant. Photos and videos are rich with detail. All thanks to 3.1 million pixels powered by the new A5X chip. It’s the best mobile display ever.

The new iPad features a 5-megapixel iSight camera with advanced optics, a backside illumination sensor, auto white balance, and face detection for incredible still images. And you can record 1080p HD video, too. So every moment you capture looks as great as you remember.

Apple is coming up with a new iPad will it hit markets soon?

 The upgrades from the iPad 2 to the new model are more modest than in the past — including the sharper resolution that Apple calls "Resolutionary," faster processing power and the camera's ability to shoot video in full 1080p high-definition. Is that enough to get consumers to ditch their iPad 2 and first-generation iPad for the new one? The answer is mixed.

"I'm an iPad 1 user," said Ted Brockwood of San Francisco. "So I'm all over the new display. I'm going to trade in the old one as fast as possible."

Mario Kroll, also of San Francisco, thinks the better graphics will be great for video games. "Now you can take your big HD TV with you." But as an iPad 2 user, he's not sure whether the better graphics will be enough of a sell to make him ditch the old one. Dylan Novicky, an aerial theatrical stagehand, wasn't impressed. The new features, to him, were "not that spectacular." What would it take for him to want to buy it? "Give me free wireless," he said, "and I'd be the first in line."

The entry price for the new iPad remains the same as the previous model, $499 for a Wi-Fi only version with 16 gigabytes of storage. IPads that can run at 4G speeds start at $629.
Monthly data plans for the iPad start at $14.99 for a 250 MB plan at AT&T Wireless and $20 for a 1 GB plan at Verizon Wireless.

Katie Small, who works at the Macy's here, says she is "tempted" by the new features, but not sold. She's interested in the better graphics and the introduction of the iPhoto image editing app, "but I don't know if that's enough to make me want to buy the new one."
Eugene Steptoe, who works on the fabled San Francisco cable cars, says he has no choice but to buy the new iPad. His wife will want the new one, and they'll have to stand on line next week to get it. "She always wants the latest," he says.

And Mick Steier, a 15-year-old tourist from Omaha, says he was sold on the iPad 2, and he's even more jazzed to get the new iPad. "It's cool," he says.
Meanwhile the iPad 2 could get a boost. Apple cut the price $100 to $399. While that's still much higher than Amazon's tablet competitor, the $199 Kindle Fire, the smaller price gap could hurt Fire, says Piper Jaffray analyst Gene Munster. "Their strongest sales point was price."