D.C.R.U.S.T Murthal: Blogger Hack

Showing posts with label Blogger Hack. Show all posts

Saturday, 9 June 2012

Protect all images in your Blog jquery trick

Here is a most important trick every blogger need. This trick is about how to protect all your images in your blog with a transparent image covered on it. I recently posted an article about How to protect images? .This article about to protect all images.

Related Articles
How to protect images in your blog?
Do you want to see demo? Try to save picture in this blog.
----------------------------------------------------------
What's inside this article

Step 1: Add jQuery plugin (if your blog have a jquery plugin,ignore this step)

Go to Template->Edit HTML [A dialog box appears click Proceed]
Copy and paste the below code <head> and save it

<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js' type='text/javascript'/>

Go to Blogger Account
Template->Edit HTML [Click Proceed]
Copy the code above </head>

Protect only First image in every Post

Protect all images in every post

I think you liked this article...please like and share..

Friday, 8 June 2012

How to Add Yahoo Smileys on Blogger Threaded Comments?

Yahoo smileys for Blogger Threaded Comments

I 'm going to say about how to add yahoo smileys to Blogger Threaded comments. This is an awesome trick was scripted by an Indonesian Blogger Kang Ismet and I think he did a very good job for us. This Blogger hack works with New Blogger Threaded commenting system.
Follow the instructions Below..

To see demo :
Go to Comments OR Click Here

What's inside this article?

How to Add yahoo smileys to Blogger Threaded comments in 3 steps..?

Go to Blogger Account
Go to Template -> Edit HTML [click Proceed]

Add CSS code

Find ]]></b:skin> [easily find Ctrl + F]

img.bhacksmly {
    height: auto !important;
    vertical-align: middle !important;
    width: auto !important;
    border:0px !important;
}

Add Javascript code

Find </body> and copy the below code just above it.

Save the template
Save Template

Add HTML code

Check Expand Widget Templates
Find <div class='post-footer-line post-footer-line-3'>
Find the next </b:includable> and copy the code above it

Example
</div>
.
Place code here

</b:includable>

Copy the below code above </b:includable>

<b:if cond='data:blog.pageType == "item"'>
<div class='netoopsblogysmile' id='ysmile' style='

background: -moz-linear-gradient(top, #e4f5fc 0%, #bfe8f9 50%, #9fd8ef 51%, #2ab0ed 100%);background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#e4f5fc), color-stop(50%,#bfe8f9), color-stop(51%,#9fd8ef), color-stop(100%,#2ab0ed));background: -webkit-linear-gradient(top, #e4f5fc 0%,#bfe8f9 50%,#9fd8ef 51%,#2ab0ed 100%);background: -o-linear-gradient(top, #e4f5fc 0%,#bfe8f9 50%,#9fd8ef 51%,#2ab0ed 100%);background: -ms-linear-gradient(top, #e4f5fc 0%,#bfe8f9 50%,#9fd8ef 51%,#2ab0ed 100%);background: linear-gradient(top, #e4f5fc 0%,#bfe8f9 50%,#9fd8ef 51%,#2ab0ed 100%);border-radius: 3px;width:100%; padding:10px; height:65px;'>

Save the Template
That's all

We proudly introduced our new yahoo smileys to Blogger threaded comments...Please Check it and feel it...Click HERE
We will post like our Yahoo smileys soon...

If you liked this article please Join via Google Friend Connect,Share,Like us to get Stronger...

Sunday, 25 March 2012

Awesome Stylish 404 Error Pages For Blogger

404 Error or Page Not Found Error generated by Blogger when a user enters an invalid URL or 404 Error is an HTTP status code that means the page you are trying to reach on your Blog couldn't found or Page not exist in the Server.
By Default Blogger shows Error page message in a box and its not look Style.
Here I am saying about how to Customize it much better...

View Demo

Only Custom message [No Style]

If you want to show only a custom message then First Go to updated Blogger Interface
Then Go to Setting->Search Preferences

Error Message with Stylish 404 images

If you want Colorful Stylish 404 page do the following.

Go to Design->Edit HTML
Find </head> and copy the below code just above it.

<b:if cond='data:blog.pageType == "error_page"'>
<style type="text/css">.status-msg-wrap{font-size:100%;margin:none;position:static;width:100%}.status-msg-border{display:none}.status-msg-body{padding:none;position:static;text-align:inherit;width:100%;z-index:auto}.status-msg-wrap a{padding:none;text-decoration:inherit}</style>
</b:if>

Save the Template

Error Page Style 1

Go to Setting->Search Preferences
Copy below code in Custom Page Not Found section [as shown in fig. first]

<h2 style="font-size: 35px;margin: 0;text-align: center;">Oops..! </h2>
<h3 style="font-size:17px;">Sorry,You are trying to reach an invalid page...!<br><a href="/">Click here</a> to go to Homepage <br> Have a nice Day...</h3><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg31SkovdoP1ziWgRUV8YdofZbOQKM1aHvEWpV7lfx823NOijdCodnTyTYtL7dRcrn2R0QDFx_UKy3Ut9iEbh_b5uXHsBEeO5dEY1OGsFrGu72YKA-1t6ccnv9Vpe6nW4xCgZJLBqU-zm8/s1600/404+error+page+1.jpg"/>

Error Page Style 2

Go to Setting->Search Preferences
Copy below code in Custom Page Not Found section [as shown in fig. first]

<h2 style="font-size: 35px;margin: 0;text-align: center;">Oops..! </h2>
<h3 style="font-size:17px;">Sorry,You are trying to reach an invalid page...!<br><a href="/">Click here</a> to go to Homepage <br> Have a nice Day...</h3><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh4DMZ8yT18Z1ymTW6r4WbOUNQD92NILjwyOrBRY1_VxAOC9CoCQc_RKhk3ufg45WIET2lUchOu4reMWXeyoxT-SltThpMZYQTad4YB6ZKMmyDYFdGI1IGbs9BDJBs_sszkowUp_0vg94o/s1600/404+error+page+2.jpg"/>

Error Page Style 3

Go to Setting->Search Preferences
Copy below code in Custom Page Not Found section [as shown in fig. first]

<h2 style="font-size: 35px;margin: 0;text-align: center;">Oops..! </h2>
<h3 style="font-size:17px;">Sorry,You are trying to reach an invalid page...!<br><a href="/">Click here</a> to go to Homepage <br> Have a nice Day...</h3><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhp_62M_afX4RuuIWp5FSdc0f2EEf2cDnAlKNMhkZ9te64kndoNnHZm26sjXXdzElQLntln4fQ15SdITU9y0HzBHE8REjtST9DWsnYgDFO0ieGDeq5oar7mQ8pvslx2RohA5mcYrMvO6LU/s1600/404+error+page+4.jpg"/>

Error Page Style 4

Go to Setting->Search Preferences
Copy below code in Custom Page Not Found section [as shown in fig. first]

<h2 style="font-size: 35px;margin: 0;text-align: center;">Oops..! </h2>
<h3 style="font-size:17px;">Sorry,You are trying to reach an invalid page...!<br><a href="/">Click here</a> to go to Homepage <br> Have a nice Day...</h3><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhTa2BpT-efVXTn07YoWZRFM2kahexjF3YhEmI4NZKaq041JXDN56FA9H5mI3XQxhkeDWYrC-5QXCWstGfIvhNFgDcSHYVWjS80l4AE-9T5rK4-P-FtTD0ojUPHyksP0z909HSynueoECQ/s320/404+error+page+6.jpg"/>

Error Page Style 5

Go to Setting->Search Preferences
Copy below code in Custom Page Not Found section [as shown in fig. first]

<h2 style="font-size: 35px;margin: 0;text-align: center;">Oops..! </h2>
<h3 style="font-size:17px;">Sorry,You are trying to reach an invalid page...!<br><a href="/">Click here</a> to go to Homepage <br> Have a nice Day...</h3><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhycYF678xLTILBHjYTm9Pk9jpeT10KUa2abXX9AxeZgOd-AMgz7eD9rxagFvGxSUrcLYlYEerCkSqq3xcmSThnlVnWZf4hyeAssOGkQORFn-WuljpY9IWk1X38kphLabPiRqK2Bqm_2no/s1600/404+error+page+7.jpg"/>

Error Page Style 6

Go to Setting->Search Preferences
Copy below code in Custom Page Not Found section [as shown in fig. first]

<h2 style="font-size: 35px;margin: 0;text-align: center;">Oops..! </h2>
<h3 style="font-size:17px;">Sorry,You are trying to reach an invalid page...!<br><a href="/">Click here</a> to go to Homepage <br> Have a nice Day...</h3><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgKhyphenhypheny94qMvZU_axA3ZWSvstN-aT377abXMcj53OPFal3Cqdmlms88PGMIE7SS2J5C1aX7UftaZrOdUO5tQsCP4bbbyo3v25z8E-lSU2qQoKONTi5bGhO3WnIFExz4VvTvTdWAwEv6DgDE/s1600/404+error+page+3.jpg"/>

Then Click Save..That all..
First thanks to Bloggerplugins.com for the custom error page code, visit here. Then i made some changes and add beautiful 404 images that i was inspired from HongKiat .

I thinks this article helped you..If any bugs of doubts don't hesitate to ask..do comment...
Like and share...