Showing posts with label Blogger Tricks. Show all posts
Showing posts with label Blogger Tricks. Show all posts

Monday, May 20, 2013

How To Install Blogger Template

0 comments

How To Install Blogger Template 

Installing Blogger Template is a simple Process,but new bloggers sometime take a wrong step and as a result they lose their all blog posts/content.In this regard i will share some tips about how to install a blogger template.Installing any blogger template to blog is not a great deal,but the thing is How much you are smart?So Uploading Template to blogs just require some steps which are mentioned below.

  1. Backup :- The main thing is whenever you want to upload/install a template to your blog,must backup your Blog template,if you not may be you lost your blog posts.Now How To Backup Blogger Template it will be explained below.
  2. Extracting Blog template and uploading to blog.
  3. Editing and installing.
  4. Never Remove CopyRights

How To Backup Blogger Template

  • Visit Blogger dashboard.
  • Click On Template (See image below)
  • See here and there, you will see Restore/Backup at the left most of your PC Screen(Shown Below)
How To Install Any Blogger Template
  • Now Click On Download Full template
  • Now you will see a file in Downloads Directory (something like template12344.xml) and that's it.

How To Install Blogger Template 

  • Visit Blogger Dasbaord
  • Then Click on template
  • And Now Click On Back/restore
  • A Box will popup
  • Click on Chose File
  • Now Select the .XML File of template and hit upload
  • That's it,you have uploaded the template :D.
Extracting Template from RAR:- You may have seen that usually bloggers upload template in RAR Files,so now you have to extract the template from RAR.For Extracting follow the below steps.
  • Click On Template(which is in RAR File)
  • Now Right Click on filename.xml and click on Extract,then select Desktop and now you will see that file has been extracted to the Desktop.

Can I Remove Copyrights?

Template Authors waste too much time on designing a template,and another thing they are allowing you to download the template for free.So as a Credit award them with the footer link of their blog.If you remove Copy Rights  they can surely report your blog to DMCA and as a result your blog will be deleted in 24 hours.So Be Care full,always be original,never edit or copy.

 

7 Tips & Tricks to Creating a Gorgeous Restaurant Website

0 comments

7 Tips & Tricks to Creating a Gorgeous Restaurant Website

 

In order to create a proper website for people, you should start think in the same way they do. When it comes to designing a gorgeous restaurant website, what should you put your mind to? Well, why do people like going to restaurants? For the food, the ambience, to relax and have a good time with friends. Keeping that mind, restaurant websites can be real useful to the dining business.
Guests can have an opportunity to be acquainted with your menu, style, interior and services. Moreover, an online website also means that you can receive orders online as well as reservations for those interested to check out your restaurant. The website is a necessary attribute of any modern business.
So today I’d like to talk about creation of a proper restaurant website design. It seems easy on the surface, but still there are a few tips you totally should follow in order to create a gorgeous restaurant website that you can be proud of.

1. Target Audience

From the very beginning you have to find out your target audience. If there is a university near your cafe, students will probably be your frequent visitors. If there is a business center not far from your restaurant then expect business-executive types to lunch at your place. Check your surroundings for the type of target audience, their age group and ultimately their preferences.
After the target audience is defined, you can begin website creation. If it is a students’ cafe, a clean and bright design will be the perfect choice. But if you are trying to engage the more serious managers and office workers, go for an elegant or professional style.
CAU Restaurant
Also, you can arrange “happy hours” or some other discounts to attract more customers. Don’t forget to create an extra website page, slider image or pop-up window for a brief description about it. Here you can see an offer in a slider at the website header. The visitors of this website are well-informed, because the offer is on the main page.
Giraffe

2. Keep It Simple

Every good restaurant website should include important and required pages, such as a home page or main page, the menu, the ‘About us’ page, and a Contact form. It’s critically important to create all these pages, because without any of them the website will never be complete. You can also add a review page in order to show your visitors what people say about your restaurant.
Cantilever
Also, try your best to keep it as simple as possible. There is a design principle noted by the U.S. Navy that is called KISS. It means “Keep it simple, stupid”. By this principle, simplicity and a user-friendly design is your main goal. If a user doesn’t find what he or she is looking for in three clicks,it’s byebye for good.

3. Color Sheme

Have you noticed that the color palette of most restaurant sites consists of four main colors: brown, white, red and black. Of course, these days you can see a full spectrum of colors on restaurant websites, but these main four colors were selected for a reason.
Brown color symbolizes reliability, stability, and adherence to tradition.
FIG
White gives a feeling of freshness, purity, and freedom.
Solegiallo
Black is associated with mystery and power of creation. Moreover, food photography looks great on a black background.
Daimu
The color red is most often used by fast food restaurants as it is the symbol of passion and secret desires. Always try to take into consideration the fact that colors influence a user’s behaviour. Use this knowledge to your benefit.
Backyard Burgers

4. Easy-to-use Contact Form

Your restaurant website should have an easy-to-use contact or feedback form. It’s not enough just to leave an email address or a phone number on the contact page. A contact form lets you add fields which can help narrow down what the person is trying to contact you for.
Also, don’t forget to attach a map to the form in order to show the location of your restaurant, that will remove questions about the location of your restaurant.
Cannolificio Mongibello

5. Stay Sociable

There are lots of social websites you can use to share information and find potential customers. Let your visitors follow your news, updates, and even staff via social networks. Stay open to communication, be friendly with your customers, be kind and they will act in the same way.
The Noodle Box
Word of mouth” is a quite strong motivator. You can turn it to your advantage. Just share information that is really useful and interesting to your target audience, for example, the rules of proper nutrition with the corresponding dishes from your menu.

6. High-Quality Images

On the Web we are constantly fighting for attention and the website is usually on the front-end trying to get people to click in and find out more. Hence, it needs to be attractive first of all. Large background photos are an amazing choice for restaurant website design.
Also, you can add some high-quality images to the menu page in order to demonstrate how your dishes look like. Make the images “delicious”, they are supposed to arouse an appetite. Food photography should awaken a desire to try them out, because when they do, people can’t wait to step into your restaurant and get a bite.
Easy Bistro
Moreover, you can add some interior photos to your site to convey the cozy atmosphere that prevails in your restaurant.

7. Killing “About Us” Page

Your website is an instrument to win over the crowd and to top your competitors. The “About us” page should be unique and make you stand out from the crowd. Try to find your personality layer and add it there. Show your potential customers how friendly and professional your team is.
Square
People read the web information differently from the way they read books and magazines. They read fluently, selecting the key points for themselves. Keep this fact in mind and highlight the main moment with bold font. It will help not just to perceive the information better, but also to index it for search engines, such as Google.

Bonus Tip: Logo Placement

I’d like to share one more small tip with you. Almost all websites try to place the logo on the top left corner of the page. But why?
Napoli Centrale
According to the scientific research, when a person opens a website, his or her view runs from left to right. People are used to reading in a such way. So, the best place on the page to put a logo is the top left corner.

 

Monday, May 13, 2013

Use Your Own Search Box with Google Custom Search | Blogger

0 comments
The accuracy of Google search and the ability to monetize your blog with it's flagship Adsense program are the two primary reasons one would replace blogger's default search with Google custom search. Other than that, adding a simple search box to blogger can do job for you. And its easier than 123. You can either add it from the 'Add a gadget' menu or grab the simple search form HTML code given after Step 7 below.

And as for the "Using your own search box with Google custom search" part, here are 7 easy steps you need to take.


 Use Your Own Search Box with Google Custom Search | Blogger

Method:

Step 1. Visit google.com/cse and create a new search engine (If you don't already have it set).

Step 2. Navigate to 'Look and feel' on the left pane.

Step 3. Choose Results only layout and customize the style according to your liking.

Step 4. Now, Save and Get Code.

Step 5. Two code are displayed. Place the JavaScript code before the closing tag in your template. (Highlighted in red in Image below).



Step 6. Create a new page and name it "Search" (Without Quotes). Now paste the second code in HTML mode there and publish your page.

Step 7. Finally, add a new HTML/JavaScript gadget where you want to display your search box and paste the code below.

<form action="/p/search.html" class="clearfix">
<div>
<input class="search-input" name="q" placeholder="Search..." size="35" style="float: left;" type="search" /></div>
<div>
<input class="search-button" type="submit" value="Search" /></div>
</form>

Note: If you're using your own search box, just add the action="p/search.html" parameter.

There you go. Now you have your own search box integrated with Google CSE.

Recover an Accidentally Deleted Post on Blogger

1 comments
 Recover an Accidentally Deleted Post on Blogger
While it may take hours to write a lengthy and well thought out blog post, you never know when you accidentally hit the delete button while saving or modifying your work -- And Poof!, all your previous work is gone.

You my have lost a post that was in draft or a previously published one. Fortunately, in both cases you can still recover or retrieve the post that was deleted unintentionally. There are several ways to do so:



Recovering a Post in draft / Unpublished:


If your post was in draft and got deleted, you need to find its URL:
  • Depending on your browser, navigate to the your browser history and start looking for the link to the draft post.

Once you've found, you are most likely to retrieve it.

Recovering a published post:


If your post was published earlier, you have two places to look for:

    1. Search Engine Cache:

All popular search engines maintain the cache of indexed pages. To access the cache of your blog, enter the following and click the cache button right next to the results.

site:yourblogurl.com
For example: site:techmarshal.blogspot.com

    2. Blog Feeds:

If your blog publishes feeds, subscribe to your own feeds using Google Reader (google.com/reader) or any other similar feed readers and recover your post.

Good Luck!


Source: makingdifferent 

Monday, May 6, 2013

How to Create “Sticky” Sidebar Widget in Blogger Using jQuery

0 comments

Ihave seen at more and more website, they created sticky sidebar on their blog/websites, then today I’m here with how to create “Sticky” sidebar widget in blogger using  jQuery .

People visit your blog to read the posts, Not to see the widgets. Most of the time they open the post, scroll & read the content and left. When they are at the bottom of the post your sidebar was out of their screen. And you don’t get any benefit from it. I know you put many widgets there!
One of the best way to get benefit from your widgets is make one of your widget STICKY that scroll with user.
For example you want more subscribers then just make your Subscription Form sticky.
Note : - Don’t try to stick your google adsense ads for getting more clicks on it, your A/C can be ban or blocked by this reason.
  • You can stick your Subscription form to get more subscriber.
  • You can stick Facebook/Google Plus Widget for more Like.
  • You can stick Popular post to decrease bounce rate.
  • You can stick any offers to generate Revenue.

How to create sticky sidebar in blogger?

Go to blogger–>Template—>Edit HTML
CTRL + F to find </head> tag in your blogs HTML
Copy and paste below code just above it.

<script src='//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js'/>
<script type='text/javascript'>
/*<![CDATA[*/
// Sticky Plugin
// =============
// Author: Anthony Garand
// Improvements by German M. Bravo (Kronuz) and Ruud Kamphuis (ruudk)
// Created: 2/14/2011
// Date: 9/12/2011
// Website: http://labs.anthonygarand.com/sticky
// Description: Makes an element on the page stick on the screen as you scroll
// For Blogger by : http://www.makingdifferent.com

(function($) {
var defaults = {
topSpacing: 0,
bottomSpacing: 0,
className: 'is-sticky',
center: false
},
$window = $(window),
$document = $(document),
sticked = [],
windowHeight = $window.height(),
scroller = function() {
var scrollTop = $window.scrollTop(),
documentHeight = $document.height(),
dwh = documentHeight - windowHeight,
extra = (scrollTop > dwh) ? dwh - scrollTop : 0;
for (var i = 0; i < sticked.length; i++) {
var s = sticked[i],
elementTop = s.stickyWrapper.offset().top,
etse = elementTop - s.topSpacing - extra;
if (scrollTop <= etse) {
if (s.currentTop !== null) {
s.stickyElement.css('position', '').css('top', '').removeClass(s.className);
s.currentTop = null;
}
}
else {
var newTop = documentHeight - s.elementHeight - s.topSpacing - s.bottomSpacing - scrollTop - extra;
if (newTop < 0) {
newTop = newTop + s.topSpacing;
} else {
newTop = s.topSpacing;
}
if (s.currentTop != newTop) {
s.stickyElement.css('position', 'fixed').css('top', newTop).addClass(s.className);
s.currentTop = newTop;
}
}
}
},
resizer = function() {
windowHeight = $window.height();
};

// should be more efficient than using $window.scroll(scroller) and $window.resize(resizer):
if (window.addEventListener) {
window.addEventListener('scroll', scroller, false);
window.addEventListener('resize', resizer, false);
} else if (window.attachEvent) {
window.attachEvent('onscroll', scroller);
window.attachEvent('onresize', resizer);
}

$.fn.sticky = function(options) {
var o = $.extend(defaults, options);
return this.each(function() {
var stickyElement = $(this);
if (o.center)
var centerElement = "margin-left:auto;margin-right:auto;";

stickyId = stickyElement.attr('id');
stickyElement
.wrapAll('<div id="' + stickyId + 'StickyWrapper" style="' + centerElement + '"></div>')
.css('width', stickyElement.width());
var elementHeight = stickyElement.outerHeight(),
stickyWrapper = stickyElement.parent();
stickyWrapper
.css('width', stickyElement.outerWidth())
.css('height', elementHeight)
.css('clear', stickyElement.css('clear'));
sticked.push({
topSpacing: o.topSpacing,
bottomSpacing: o.bottomSpacing,
stickyElement: stickyElement,
currentTop: null,
stickyWrapper: stickyWrapper,
elementHeight: elementHeight,
className: o.className
});
});
};
})(jQuery);
/*]]>*/
</script>
  • Remove above red colored line if  your blog have already jQuery plugin.
  • Next search for </body> tag,
  • Copy and paste below code just above it.
<script type='text/javascript'>
$(document).ready(function(){
$(&quot;#mdstickybar&quot;).sticky({topSpacing:0});
});
</script>
  • Now search for ]]></b:skin> tag,
  • Copy and paste below css code just above it.
#mdstickybar {
background-color:#ECEEF5;
padding-top:10px;
width:300px!important;
padding-bottom:15px;
color:#474747;
}
You can change your widgets background color, width, text color by editing into above css code.
  • Lastly save your template and lets try to stick any widget…
  • Go to Layout–>Choose which widget you want to stick—>Click on edit.
Edit
  • After appearing widget page, copy the widget ID from the top address bar.
Copy
Blogger give automatically one uniqe ID for per widget, thats you copied ID of your widget which you want to stick .
  • Now go to Template—>Edit HTML
  • Press CTRL + F search/find box will appear, paste your widget ID and hit enter to search your widget in the template.
Search
  • Open folded code by clicking on black arrow
  • Your widgets full code will look like this :
<b:widget id='HTML1' locked='false' title='Subscribe' type='HTML'>
<b:includable id='main'>
<!-- only display title if it's non-empty -->
<b:if cond='data:title != &quot;&quot;'>
<h2 class='title'><data:title/></h2>
</b:if>
<div class='widget-content'>
<data:content/>
</div>
<b:include name='quickedit'/>
</b:includable>
</b:widget>
  • Copy and paste below code just above <b:includable id=’main’>
<div id="mdstickybar">
  • Now copy and paste below code just after <data:content/>
</div>
  • Finally your code will look like this :
<b:widget id='HTML1' locked='false' title='Subscribe' type='HTML'>
<b:includable id='main'>
<div id="mdstickybar">
<!-- only display title if it's non-empty -->
<b:if cond='data:title != &quot;&quot;'>
<h2 class='title'><data:title/></h2>
</b:if>
<div class='widget-content'>
<data:content/>
</div>
</div>
<b:include name='quickedit'/>
</b:includable>
</b:widget>
Now save your the template and see the result :D
Now visitors will see your sticky widget when they scroll. Hope this widget will help you get benefit from your sidebar.
Drop your comments and Question below.. :)

Sunday, May 5, 2013

New ! Use Google+ Comments in Blogger

0 comments

Comments are always important for any type of blog. reading and responding to comments can be one of the most rewarding aspects of blogging. not only do they help you connect with your readers, they can also inspire later blog entries.Now Google has made few improvements for blogger users.Now you would be able to use Google+ comments in your blog as well.Once you’ve enabled the feature through your Blogger Dashboard, you’ll enjoy a number of important benefits:
Google+ Comments is an alternative to the default commenting system on Blogger, available to blog authors who have upgraded their Blogger profile to Google+. Google+ Comments lets you bring the following conversations together in one place, right under your blog post:
  • Comments made on your Blogger blog post
  • Comments on the blog post that you’ve shared to Google+
  • Shared content on Google+ that links to your blog post
Readers will need a Google+ page or profile to comment on your blog.
Google+ Commetns

Features of Google+ Comments

Google+ Comments look similar to traditional Blogger comments, but have some important differences. For example:
  • When you leave a comment on a blog, you’ll see the option, checked by default, to also share that comment to Google+.
  • Google+ posts that link to blog posts will show up as a comment underneath those blog posts
  • If original comment is shared to Google+, replies to the comment on the blog will show up in Google+ and vice versa, but only to the people that the original comment was shared with
  • If a comment is not shared with the blog author, the blog author will not be able to see the comment in either location
  • As the author of a post, you’ll receive Google+ notifications when readers comment on or share your blog post.

How to use Google+ Comments in Blogger?

To use this feature,follow the below simple steps:
Make sure you have upgraded your Blogger profile to Google+ ?
  • Log in with your Blogger Profile.
  • Now click on “Google+” option and place a tickmark on the option which shows “Use Google+ Comments on this Blog“.The screenshot of the same is shown below:
Google+ comments2
Drop your comments and questions below…  :D


Source: makingdifferent 

Keep These in Mind Before Submitting a Guest Post

0 comments
If you’re fond of writing and want to submit your guest post on blogs, but they rejects your post then you should be ready to accept your mistake and improve them with right method, so read this and let yourself inspire with making mistakes.

Don’t Use Old or Released Articles

Some articles are really too old, so you should not submit articles like that, Writing these types of article can not improve your chances to be accept your post on blog. In addition they may remove your last published article if they blindly trusted on your article for uniqueness. So be unique and write unique articles.

Don’t submit Uncategorized Article

When you submit article you write but if your article doesn’t suits there blog or does not matching with their blog for publishing, then ofcourse it won’t be published. So First read the categories of posts they’re accepting and then submit your guest post.

Never Submit Article with Lack of Visualisation

If you’re writing a tutorial based article or something like that then you must show some images or video for your articles, there will be more interest if your article have images, as considering w/o image article and with image article, with image article will be more successful and keep finding traffic itself by various sources. So just have some visualized content like image or video. Don’t bore with text only. J

Don’t Submit w/o Layout Adjustment

If your post does not have adjusted layout, then it may rejected in blog with more guest post traffic, some bloggers may adjust layout suitable to their blog, but your post should be ready to publish in seconds without any adjustment, this will bring easy and speedy approval for your future guest posts.

Write Some Bio About Yourself

If you will write a short description about yourself and give your link then it will be easy to approve your guest post, after all you are posting for that :D . And if your bio is not available then you’ll not able to get credits because user cannot see your name there. So its recommended to give your bio with post.

Follow Instructions Carefully

If there is description or faq about guest posting then read that because you’ll get knowledge of niches of your posts and how many links they allow, etc… and if you’re not knowing this then you’ll submit a post with your backlinks then your post may get disapproved.

Use Some Nice Word Vocabulary

If you’re using some conventional word its just simple article but you can use many more words which have the same meaning but gives you nice impressions to readers, for example if you’re writing “Live Demo” then instead you can write “Visualised Sample” or “Have Eyes on Project” this will improve your wrting skills too and let you give more impressions


Source: makingdifferent 

Saturday, May 4, 2013

New Javascript ~ Automatically Redirect A Blogger Blog To Another URL

0 comments

There are a number of reasons you may want to automatically send visitors to your blog to another URL or from one blog to another.For example if you moved your blog, if you had two blogs and wanted to focus one just one and cover both topics.Automatically directing visitors to another URL is actually quiet easy and only requires a snippet of code added to the top of the template.In this post i will show you the code needed to automatically Redirect from a Blogger Blog to any other URL.
How To Redirect A Blogger Blog To Another URL?
  • Replace http://www.makingdifferent.com  With The URL You Want To Forward To.
  • Click on “Generate Code” button
  • Copy and paste generated code after <head> in your blogs html
  • Finally save your template and you have done !! :)

Drop your comments and questions below …


Source: makingdifferent 

Change the “Post A Comment” message with an image/text in Blogger

0 comments
In default Blogger template ” Post A Comment” message prompts readers to make a comment on an article.
If you are not using the embedded comment form, then there will be a link ” Post A Comment” on your blog. And if you are using the embedded comment form in your blog, then there will be ” Post A Comment” message on your Blogger blog, just above the comment box.
Now if you want to change the “Post A Comment” message with an image/text in your Blogger blog, then here’s a simple hack for you.
How to replace this ” Post A Comment” message in your Blogger/blog?
  • Log in to Blogger, go to Template– >Edit HTML
  • Tick the “Expand Widget Templates” checkbox.
  • Now find (CTRL+F) this piece of code (marked in red):
<a expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'>
<data:postCommentMsg/>
</a>
  • and this one too
<h4 id='comment-post-message'><data:postCommentMsg/></h4>
  • Now replace the code (marked in red), with the text you want, like “Share Your Views ” etc.
You can use an image instead of a simple text, create a small image with your new message, and upload it
Now replace the code highlighted in (marked in red) with Below code (Don’t forget to replace IMAGE-URL-HERE with the direct link to the image):
<img src="IMAGE-URL-HERE"/>
  • Preview and save the template.


Source: makingdifferent 

    20 Useful Blogging Tools and Services

    0 comments

    BlogRoll – This service helps you to manage your links.
    Creative Commons – Protect your hard work which you applied in creating your Blog.
    Ping-o-Matic – Updated Blog Update all the Search Engine about your current Blog Standing.
    FeedBurner – Make Subscribers and keep an eye on ur RSS Feeds.
    Flock Browser – Firefox like browser with extended capabilities.
    Copyscape – Search for Websites duplicate contents.
    Icerocket – Blog search engine – can be very useful.
    Basecamp – Special project management, collaboration and talk service.
    Backpack – Intranet, Group calendars, organizer and more…
    CoComment – Track all the comments where ever you left with this service.
    Disqus – Create a highly effective and powerful comment form for your Blog.
    Del.icio.us – Popular social networking site good for bloggers.
    Gabbly – Create chat forms for your blog – can be very effective and useful tool.
    Odeo – Record and share audio podcasts & streams completely for free.
    TagCloud – Create a attractive cloud from tour RSS Feed.
    FavIcon – Generate favicon from the image or your Twitter account.
    Blip.tv – Popular and cool video uploading and sharing website.
    Vimeo – Best video sharing and uploading site with HD support.
    OnlyWire – Bookmark and Share your blog contents through the internet.
    Stock.Xchng – The leading free stock photography site.
    Check all of these Blogging Tools and Services I mentioned above maybe they could help you increase Subscribers, Fans and make you more Money.



    Source: makingdifferent 

    Hide/Show Widgets/Gadgets in Home/post/static/archive pages in Blogger

    0 comments
    Once you activate any widget, in your blog, it will be displayed in all the pages by default, including your homepage.But what if you want a certain widget to appear only on a certain page or pages, can it be done? Yes You can do this easily using conditional tags.
    first go to Blogger’s Dashboard > Design > Page Elements tab and add a “HTML/JavaScript” gadget.
    I prefer it because it will be easy for everyone to understand. Give it a unique title so that it does not match with any of the titles of other widgets added.
    Go to Dashboard > Design > Edit HTML.
    Check the Expand Widget Templates check box on top right of the HTML window.
    Find your widget in the HTML by using Ctrl+F and entering the widget Id in the search box.
    Let’s say I have given the title for my widget as “Recent Comments”. After searching you will find the below snippets:
    <b:widget id='HTML1' locked='false' title='Recent Comments' type='HTML'>
    <b:includable id='main'>
    <!-- only display title if it's non-empty -->
    <b:if cond='data:title != ""'>
    <h2 class='title'><data:title/></h2>
    </b:if>
    <div class='widget-content'>
    <data:content/>
    </div>

    <b:include name='quickedit'/>
    </b:includable>
    </b:widget>
    It’s the widget/gadget that you have added from Page Elements tab. All is left is to add conditional tags just below and above to hide the widget form specific pages or posts in Blogger. Let us see some examples:
    To show the widget only in HomePage
    <b:widget id='HTML1' locked='false' title='Recent Comments' type='HTML'>
    <b:includable id='main'>

    <b:if cond='data:blog.url == data:blog.homepageUrl'>

    <!-- only display title if it's non-empty -->
    <b:if cond='data:title != ""'>
    <h2 class='title'><data:title/></h2>

    </b:if>

    <div class='widget-content'>
    <data:content/>
    </div>

    <b:include name='quickedit'/>

    </b:if>

    </b:includable>
    </b:widget>
    To Show Blogger Widget in Post Pages only
    <b:widget id='HTML1' locked='false' title='Recent Comments' type='HTML'>
    <b:includable id='main'>

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

    <!-- only display title if it's non-empty -->
    <b:if cond='data:title != ""'>
    <h2 class='title'><data:title/></h2>

    </b:if>

    <div class='widget-content'>
    <data:content/>
    </div>

    <b:include name='quickedit'/>

    </b:if>

    </b:includable>
    </b:widget>
    To show the widget in any particular page
    <b:widget id='HTML1' locked='false' title='Recent Comments' type='HTML'>
    <b:includable id='main'>

    <b:if cond='data:blog.url == "URL of the page"'>

    <!-- only display title if it's non-empty -->
    <b:if cond='data:title != ""'>
    <h2 class='title'><data:title/></h2>

    </b:if>

    <div class='widget-content'>
    <data:content/>
    </div>

    <b:include name='quickedit'/>

    </b:if>

    </b:includable>
    </b:widget>
    To hide a widget only in a particular page
    <b:widget id='HTML1' locked='false' title='Recent Comments' type='HTML'>
    <b:includable id='main'>

    <b:if cond='data:blog.url != "URL of the page"'>

    <!-- only display title if it's non-empty -->
    <b:if cond='data:title != ""'>
    <h2 class='title'><data:title/></h2>

    </b:if>

    <div class='widget-content'>
    <data:content/>
    </div>

    <b:include name='quickedit'/>

    </b:if>

    </b:includable>
    </b:widget>
    To show widgets only in Archive Pages
    <b:widget id='HTML1' locked='false' title='Recent Comments' type='HTML'>
    <b:includable id='main'>

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

    <!-- only display title if it's non-empty -->
    <b:if cond='data:title != ""'>
    <h2 class='title'><data:title/></h2>
    </b:if>
    <div class='widget-content'>
    <data:content/>
    </div>

    <b:include name='quickedit'/>

    </b:if>

    </b:includable>
    </b:widget>
    To show widgets only in Static Pages
    <b:widget id='HTML1' locked='false' title='Recent Comments' type='HTML'>
    <b:includable id='main'>

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

    <!-- only display title if it's non-empty -->
    <b:if cond='data:title != ""'>
    <h2 class='title'><data:title/></h2>
    </b:if>
    <div class='widget-content'>
    <data:content/>
    </div>

    <b:include name='quickedit'/>

    </b:if>

    </b:includable>
    </b:widget>
    To hide widgets in Static Pages
    <b:widget id='HTML1' locked='false' title='Recent Comments' type='HTML'>
    <b:includable id='main'>

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

    <!-- only display title if it's non-empty -->
    <b:if cond='data:title != ""'>
    <h2 class='title'><data:title/></h2>
    </b:if>
    <div class='widget-content'>
    <data:content/>
    </div>

    <b:include name='quickedit'/>

    </b:if>

    </b:includable>
    </b:widget>
    The code will check whether the condition is true or false:
    • If the result is true, it executes (and display) the widget’s content.
    • If the result is false, it skips the content and hide the widget.
    Click Save Template button and view your blog.
    That’s all:)



    Source: makingdifferent 

    Automatically Increase Facebook Fans Using JavaScript

    0 comments
    Well today i have found another simple to be applied script for your blogs or website which can gain few more unique likes to your facebook page, with this script applied any unique visitor who comes to your page can become your fan. He just needs to click anywhere on the webpage as a small invisible like button will follow his mouse cursor and as soon he clicks anywhere he will be liking your fan page. So now straight away jumping on how it can be applied in a webpage or blog just follow the below simple steps.

    How to Add This JavaScript to blogger?
    • Go to blogger—>Template—>Edit HTML
    • Hit “proceed”
    • Tick on “Expand Widget Template” Check box
    • Search for </head> in your blogs HTML and paste the below script above it.
        <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.2/jquery.min.js" type="text/javascript">
    </script>
    <script type='text/javascript'>
    function ClickJackFbHide(){
    jQuery(&quot;div[id^=\&#39;clickjack-button-wrapper\&#39;]&quot;).hide();
    }
    function ClickJackFbShow(){
    jQuery(&quot;div[id^=\&#39;clickjack-button-wrapper\&#39;]&quot;).show();
    }

    </script>
    •  Now again search for </body> in your blogs HTML and paste below code above it.
    <div id="clickjack-button-wrapper-5" style="position: absolute; opacity: 0; filter: alpha(opacity = 0); -ms-filter:'progid:DXImageTransform.Microsoft.Alpha(Opacity=0)';  margin-left: -50px; z-index: 100; width:27px; height:20px; overflow:hidden">

    <!--<div style="position: absolute; top: 5px; left: 5px; z-index: 1000; height: 13px; width: 15px;"></div>-->

    <iframe src="http://www.facebook.com/plugins/like.php?href=Fanpage URL Link&amp;layout=button_count&amp;show_faces=false&amp;width=50&amp;action=like&amp;colorscheme=light&amp;height=21" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:45px; left:-19px; height:21px; z-index: 0; position: relative;" allowTransparency="true"></iframe>

    </div>
    <script type="text/javascript">
    jQuery( document ).ready( function() {
    $( "#clickjack-button-wrapper-5" ).parent().mousemove( function( e ) {
    jQuery( "#clickjack-button-wrapper-5" ).css( {
    top: e.pageY - 10,
    left: e.pageX + 30
    } );
    } );
    clickjack_hider();
    var clickjack_fb_timer = setTimeout("clickjack_hider()",5000);
    } );
    function clickjack_hider(){
    jQuery("input").mouseout(function(){ClickJackFbShow();});
    jQuery("a").mouseout(function(){ClickJackFbShow();});
    jQuery("button").mouseout(function(){ClickJackFbShow();});
    jQuery("textarea").mouseout(function(){ClickJackFbShow();});
    jQuery(".ratingblock").mouseout(function(){ClickJackFbShow();});         jQuery("object").mouseout(function(){ClickJackFbShow();});
    jQuery("input").mouseover(function(){ClickJackFbHide();});
    jQuery("a").mouseover(function(){ClickJackFbHide();});
    jQuery("button").mouseover(function(){ClickJackFbHide();});
    jQuery("textarea").mouseover(function(){ClickJackFbHide();});
    jQuery(".ratingblock").mouseover(function(){ClickJackFbHide();});         jQuery("object").mouseover(function(){ClickJackFbHide();});
    }
    </script>
    • Now just replace the red line in above code with your facebook page URL and that’s it now just save the template and jump over to your website to test it out.
    Now as soon as you refresh your blog you will see that your cursor has been changed into the hand one as there is a link moving with it. Now your blog readers will see similar thing and ass soon as they will click it they will become your page fan.
    Remember :- There are some issues you might face using this script in your website or blog, the first thing is that when people drag they might not able to select the text as they will a semi visible Like button which will be attached to your mouse cursor as it moves, the second one some other gadgets might get affected and act weirdly, try using it if everything works ok than start increasing your fans :)
    Drop Your Comments And Questions Below


    Source: makingdifferent 

    Blogger Layout Solution for New Blogger Interface ~ Video Tutorial

    0 comments
    In this video tutorial i’ll show you how to solve blogger layout problem , actually i have noticed in some blogger template on new blogger interface, the sidebar and blog not showing into layout section so… finally i solve it and share it with you all

    See the below image to know what i talking about :-

    Sidebar and Blog not showing into layout:


    After solve it :-
    2
    Video Tutorial :-
    Hope you find this helpful , drop your comments and questions below…


    Source: makingdifferent 

    Automatically Remove Links from your Blogger Comments using jQuery

    0 comments

    Well commenting is a powerful way to build quality backlinks, but people or I say spammers are using this same trick to spam on quality blogs and get their page rank and traffic right to their blog, so no matter how much quality blog do you own this thing can happen and will surely happen. Well now the one way easy way to get rid of these stuff is too use the Disqus or Intense Debate commenting system that allows you to configure on how you wanna show the links posted in your comments.
    But what can you do when the thing comes for blogger’s default commenting system, well then you do not have much options to configure it out, but we have an awesome script trick that will allow you to remove links from your comments or even transform those links into simple lines of text.
    Remove Links in New Blogger Commenting System
    Well if you are using new blogger commenting system, then below provided are two codes that can be using to remove and to transform your links into text.
    Transforming Links into Text – well if you just need to transform links into text and do not want to remove them up, then copy the below code and paste it above the </body> tag in your blogger’s Edit HTML, if you already have jQuery installed remove the red line.
        <script src='https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js'/>
    <script>$('.comment-content a[rel$=nofollow]').replaceWith(function(){return ($(this).text());});</script>
    Removing Links – well if you do not want to transform links into text but just wanna remove them out then paste the below code above </body> tag.
        <script src='https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js'/>
    <script>$('.comment-content a[rel$=nofollow]').hide());</script>
    Remove Links in Old Blogger Commenting System
    Well if you are still using the old blogger commenting system and the above code is not working for you website then you might have to use the below code to get this stuff working. So just copy the below code & paste it above the </body> tag.
    <script src='https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js'/>
    <script>$('.comment-body p a[rel$=nofollow]').replaceWith(function(){return ($(this).text());});</script>
    So that’s it, this will help you in controlling some spam on your website that is caused due to spammers and commenting system in combined, well do comment if you find any problem using this script.



    Source: makingdifferent 

    How to make all links open in new windows

    0 comments
    Today i want to share a trick how to make all links open in new windows i know it old trick but i want to post on my blog so i posted and it also helpful for beginners , This request to make all hyperlinks pops up every now and then so might as well make a post for it. To make all links open in new window is amazingly simple.
    • Just sign in to Blogger,
    • Go to Template—>Edit HTML
    • Hit Proceed.
    • Tick on Expand Widget Template Check box
    • Ctl+F to find <head>
    • And immediately after that, add a single line <base target=’_blank’ /> so that it become

     <head>
    <base target='_blank' />

    Save the edited template and you have done, all links in your blog will now open in new tabs or windows
    Note: Blogger is now XHTML so all tags must have matching closing tags or be self closing. The above tag is self closing because it has that forward slash / at the end of the tag.


    Source: makingdifferent