Different Background In Each Post Of Blogger

So in this tutorial i'am gonna show you how to use different background in each post of your blogger......ok so here we go.....

• Go To Your Blog > Settings > Posts And Comments 

• Paste this code at the top of the box :

<div style="background:url(Image_URL) no-repeat;">

• And paste this code at the bottom of the box :

</div>

• Click on Save Settings and then Create a new post

• The Post Editor will open with the code already in it.

• Replace Image_URL with your background image url

• Type in your post before the </div> tag at the bottom, give it a Title and Publish.

Disable Right Mouse Click On Blogger

If you wanna disable right mouse click on your blogger blog then just add the below widget on your blog :

Comment/Request/Question

Display/Hide Widget On Specific Pages In Blogger

When you add a widget (or a gadget as Blogger would call it) to your blog, by default the widget would appear on all pages –homepage, index, archive, post and static pages. But what if you want a certain widget to appear only on a certain page or pages, can it be done? In other words can you select on which page/pages the widget would or would not appear?  The answer is yes you can -by using Blogger conditional tags.

Note: This trick doesn't work with Labels, Archive and Followers gadgets.
Let us proceed,

• Locate the widget code in HTML

1. Go to Dashboard > Design > Edit HTML.
2. Check the  Expand Widget Templates check box on top right of the HTML window.
3. Find your widget in the HTML by using Ctrl+F and entering the widget Id in the search box.
   

Your widget code might look like this. It may be a little different, but it’s okay. Just pay attention to  the highlighted lines. Widget content is contained in between those two lines -in "includable" section.

<b:widget id='WidgetID' locked='false' title='Widget title' type='HTML'>
<b:includable id='main'>
<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>

• Choose the appropriate conditional tag

I listed some conditional tags in another post -Targeting specific pages with conditional tag. Copy your desired tag from there and apply it here.

• Apply the tag

Paste the tag (from step 3) immediately after <b:includable id='main'> and the code line 11 to 15 immediately before </b:includable>, as shown below.

<b:widget id='WidgetID' locked='false' title='Widget title' type='HTML'>
<b:includable id='main'>
PUT CONDITIONAL TAG HERE
<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:else/>
<style type='text/css'>
#WidgetID {display:none;}/*to hide empty widget box*/
</style>
</b:if>
</b:includable>
</b:widget>  

Replace WidgetID in line 13 with the widget ID from code line 1.
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. 

• You need to hide the widget because in most templates the content-less widget will still appear -as an empty box.

• Save And Done

Click Save Template button and view your blog.

That’s all to it. Enjoy!

List Of Conditional Tags

List of conditional tags :
Below is a list of conditional tags that target specific pages. I only list the opening tags here. Just make sure you include the closing </b:if> tag when applying a conditional in your template.

1.Index (list) pages 

Index pages include homepage, labels page and yearly archive page.

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

2.Post (item) pages 

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

3.Static pages 

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

4. Archive pages 

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

5. Homepage 

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

6.Specific page/URL 

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

7. Post and static pages

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

8. Label-search pages 

<b:if cond='data:blog.searchLabel'>

9. First post 

This is not a page, but a conditional for the first post. Used for targeting the first post on multi-post pages.

<b:if cond='data:post.isFirstPost'>

Random Banner Widget For Blogger

Random banner widget is the best way to promote your blog content or to promote your
advertisements on your blog.....every time your visitor will see a random banner of your post/advert on your blog..... and its simple to add just follow these steps

• Go To Blogger > Layout > Add A Gadget > HTML/Javascript

• Paste the following script

<script language="JavaScript">
images = new Array(3);
images[0] = "<a href = 'URL OF ADVERTISER' rel='nofollow' ><img src='URL OF BANNER’S IMAGE-1' border='0' height='60px' width='468px' ></a>";
images[1] = "<a href = 'URL OF ADVERTISER' rel='nofollow' ><img src='URL OF BANNER’S IMAGE-2' border='0' height='60px' width='468px' ></a>";
images[2] = "<a href = 'URL OF ADVERTISER' rel='nofollow' ><img src='URL OF BANNER’S IMAGE-3' border='0' height='60px' width='468px' ></a>";
index = Math.floor(Math.random() * images.length);
document.write(images[index]);
</script>

• Now Change URL OF ADVERTISER with your links and  URL OF BANNER’S IMAGE-1/2/3 with your images..

• You can also change height and width of pics by chaning  height='60px' width='468px' .

• You can also add more banners by changing the script.

Confused or need help then please comment....i won't bite... :p

Creating A HTML Email Form

So today i'am gonna teach you a simple HTML tutorial on Creating HTML E-mail Form for your blog, website or any html page ....First of all sorry i wrote wrong form/forum spelling on pic above ......so here we go :

• On Blogger : Go To Post/Page > HTML and paste the html given below.

• On HTML : Paste html given below on your html document.

<h3>Send E-mail To Your Name:</h3>
<form action="MAILTO:USERNAME@gmail.com" method="post" enctype="text/plain">
Name:<br />
<input type="text" name="name" value="Your Name" /><br />
E-mail:<br />
<input type="text" name="mail" value="Your Email" /><br />
Message:<br />
<input type="text" name="comment" value="Your Message" size="50" />
<br /><br />
<input type="submit" value="Send">
<input type="reset" value="Reset">
</form>

• Change  USERNAME@gmail.com  with your email and you're done.....

CSS3 Round Corner Generator

Password Protect Posts In Blogger

This tutorial is gonna be about how to password protect your blogger posts and this trick is not so hard and i think this is the best trick i know yet so check the tutorial out below

Here we go :

• Go To Blogger > Design > Edit HTML

• Backup your template

• Search for ]]></b:skin>

• And just below it paste the following JavaScript code,

<!--WidCraft Password Code--> <script type="text/javascript" src="http://widcraft.googlecode.com/svn/jsencryption.js"></script>

Now whenever you wish to show images, text, media or anything only to selected people then you may create and write the post as you normally do in your blogger editor :

• Switch to the Edit HTML mode and copy all the code that you see. As shown below,

• Go To Encryption Page

You will see 4 boxes with names: Key, Plain Text, Clipher Text and HTML Code.  We are only interested in the key, plain text and HTML CODE box. Follow these steps:

• Enter a password in the Key Box

• Next Paste the code that you copies from your Blogger Editor into the Plain Text box

• Hit the Encrypt Button below Plain Text box  

• Copy the code from the HTML CODE box

• Now get back to your Blogger Editor. Create a New Post. Give your post a title and paste the HTML Code that you just copied inside your blogger Editor in the  Edit HTML Mode.  You can write anything in place of this text -> Show Encrypted text but make all changes in Edit HTML mode only.

That's It.....just publish your post and have fun.....you can also have some fun with this trick :p

Leave your Questions/Review/Requests/Phone Numbers(Only Girl) in the comment section below! 

JavaScript Encryption and Decryption

    Key

   

  Plain Text

   

   Cipher Text

   

      HTML Code

Standard       Inline       ***

     HTML Test

See the instructions for how to use this in your blogger.

How To Create Table Of Content On Blogger

Click Here To See A Demo

• Go To Blogger > Pages > Create A New Page > HTML and post the script given below 

<script src="http://widcraft.googlecode.com/svn/TOC.js">
</script>
<script src="/feeds/posts/summary?alt=json-in-script&max-results=1000&callback=loadtoc" type="text/javascript">
</script>

Now just sit and eat your dinner!!