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

How To Show Date and Time in Title

No comments
1.Login to your blogger dashboard and go to Layout --> Page Elements.
2.Click on 'Add a Gadget' on the sidebar.
3.Select 'HTML/Javascript' and add the one of code given below and click save.



<Script Language="JavaScript" Type="Text/JavaScript">

var mytime1=24;
function mytime2() {
mytime3=mytime1+6;
mytime4=mytime1+mytime3;
timexx=mytime1+mytime3+mytime4;
timexxx=timexx/mytime4*mytime1; twelfth=mytime4*mytime1/12*mytime3;
timexxxx=mytime1+mytime3/timexxx-16*timexx;
timexxxxx=twelfth*(mytime1-5)/mytime4+timexx;
timexxxxxx=timexxxxx/timexxxx+mytime1*mytime4-timexx;
mytime5=(timexxxxxx+mytime1/mytime4*timexx+mytime3*timexxx)/twelfth+timexxxxx-timexxxxxx-1;
mytime6=Math.floor(mytime5);
mytime8=mytime6*mytime3/2+100;
mytime7 = window.setTimeout("mytime2()", mytime8);
var mytime9 = new Date();
var mytime10= mytime9.toLocaleString();
document.title = mytime10;}
function op(){mytime2()}
window.onload=op;

</script>

Now you are done.Now refresh your site and look at your browser status bar
Read more »

Facebook Pop-Out Like Box for Blogger

No comments
How to Add A Static Pop Out Like Box with smooth J query hover effect in Blogger?

1-Go to Blogger Dashboard < Design tab > Edit Html
2- Search for tag.
3- Add the below code Before tag

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js" type="text/javascript"></script>

4-Now Save Template
Now,
Go to blogger Dashboard and click on layout
then Add a Gadget > Html/java script.

Add below code in the Html/java scipt box.

<a href="www.lilipool.com" target="_blank" title="Blogger Widgets"><img src="" border="0" alt="Blogger Widgets" style="position:absolute; top: 0px; right: 0px;" /></a><script type="text/javascript">


//<!--


$(document).ready(function() {$(".w2bslikebox").hover(function() {$(this).stop().animate({right: "0"}, "medium");}, function() {$(this).stop().animate({right: "-250"}, "medium");}, 500);});


//-->


</script>


<style type="text/css">


.w2bslikebox{background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgO3f2RfqIUgKIprujnHFFui-oCC_Zt0UFSYc5wQ5KI-jMSSAaYxo8pU5l-ysrXfYHmk49_KJoJ4w8htq99AeRGCzzYK_-s27-ZVu7WZOvCenWzAsKBhH2RCMejGAzeZRmYDJZyC_3q9-YK/s1600/facebookbadge.png") no-repeat scroll left center transparent !important;display: block;float: right;height: 270px;padding: 0 5px 0 46px;width: 245px;z-index: 99999;position:fixed;right:-250px;top:20%;}


.w2bslikebox div{border:none;position:relative;display:block;}


.w2bslikebox span{bottom: 12px;font: 8px "lucida grande",tahoma,verdana,arial,sans-serif;position: absolute;right: 6px;text-align: right;z-index: 99999;}


.w2bslikebox span a{color: #808080;text-decoration:none;}


.w2bslikebox span a:hover{text-decoration:underline;}


 </style><div class="w2bslikebox" style=""><div><iframe src="http://www.facebook.com/plugins/likebox.php?href=https://www.facebook.com/pages/Lilipoolcom/432836580077874&amp;width=245&amp;colorscheme=light&amp;show_faces=true&amp;connections=9&amp;stream=false&amp;header=false&amp;height=270" scrolling="no" frameborder="0" scrolling="no" style="border: medium none; overflow: hidden; height: 270px; width: 245px;background:#fff;"></iframe><span>By <a href=" http://tricksplanet.lilipool.com ">TricksPlanet</a> / <a href="http://tricksplanet.lilipool.com/2012/07/how-to-add-static-pop-out-like-box-with.html ">+Get This!</a></span></div></div>


</div>

Change my facebook page link in red with your facebook page link.
Now click on save and thats all..If you need any asistance then comment in the comment box.



Read more »

How to Create Static Pages in Blogger

No comments
Recently, Blogger launched the much awaited Blogger Pages Feature.
So, lets see how to Create Static Pages in Blogger.

1. Sign into Blogger Draft (draft.blogger.com)

2. Click on New Post as usual.

3. Select the Edit Pages from the top menu



4. Click on 'New Page' button.


5. Now, give your page a title and write the content and publish the page.


read more : lilipool.blogspot.com/2012/02/how-to-create-static-pages-in-blogger.html
Read more »

No select text content JAVA SCRIPT

No comments

  • No select text script 
  • JavaScript no text selection
  • Protect your WEB content 
Instillation steps for blog
  1. Add this script to blog
  2. Open your blog acct
  3. Click design
  4. Then Layout
  5. Add a gadget 
  6. Select HTML/Java Script 
  7. Copy and Paste and click on add
  8. Complete 














Read more »

Change Blogger Background

No comments
-->
How to change blogger background?
How to change blog background?
How to change the colour of the background?
How to put image as background?
How to repeat the single image on the background?

Here's how.
First, go to your Edit HTML Template page.

Dashboard > Layout > Edit HTML

Then look for the body { ... } section, usually appear after the Variable Definitions.

body {
background:$bgcolor; margin:0;
color:$textcolor;
font: x-small "Trebuchet MS", Trebuchet, Verdana, Sans-serif;
font-size: small; text-align:
center; }

 It doesn't have to look exactly like that. As long as you found the body { } section.
Now to change the background, all you need to do is play around with the background:line.
Change Background Colour

background: #FFFFFF;

Just change the #FFFFFF to other hexadecimal colour value. #FFFFFF is white. For more colours, check them out here here.
Also, you can put the colour name if you want.

background: white;

However, for more variety of colours, you are recommended to use the hexadecimal colour code.

Add Background Image
First upload your background to the Internet - ImageShack, Photobucket or any of your favourite photo uploading sites. Then obtain the direct link to the picture.

background: url(LINK);

Just add the image URL to LINK and you're done. Also you can modify the positioning and location of the image.

Just add these code after the URL part.
Repeat the image horizontally (left to right):

repeat-x

Repeat the image vertically (top to bottom):

repeat-y

No image repeat:

no-repeat

Repeat both vertically and horizontally:

(don't put any "repeat" tag)

Position image to the left or right:

left (for left side)
or
right (for right side)

Position image to center of screen:

center

Fix image on background (to prevent image from moving when scrolling):

fixed

Now your complete background code may look like this:

background: #FFFFFF url(http://abc.com/image.jpg) repeat-x fixed;

So just play around and you'll understand it. Enjoy!
-->
Read more »

Disable right click in Blogspot or any webpage

No comments
This post explains how to disable right click on blogger(blogspot) or any other webpage using a html(javascript) code.
It is so annoying if someone copies(thefts) your blog posts,articles,images and another kind of information owned by you saying that they are the original owners of the content.
But,I think 'disabling right click' is not the right solution for that.
Most people come to your site to read information and very small percentage of people come to your site to steal your work,images,etc.So,most people feel it insulting and I think it's very unprofessional thing to do

If you want to protect your images,my suggestion is to add a Watermark(logo) of your sitename,or your name on the images,pictures,etc.
Note:Using this javascript code,you only disable the right click by warning the visitors that the content is copyrighted.

That's all my personal opinion,However if you despirately want to add this feauture,You can get this code



Where to paste it in blogger ?

Sign in to your blogger dashboad>layout>Add a Pageelement>html/javascript(look at the screenshot below)


and paste the below javascript code and Save the changes.

How it works?
If you right click on the webpage,a message will pop up on screen saying "function disabled".If you want to change the message to you own one like "sorry....the work is copyrighted" or something like that,replace the "funtion disabled" text with your own message in the Javascript code.


Read more »

Disable Subscribe to: Posts (Atom) on Blogspot

No comments
Hello, I was just just wondering if there is a code on how to remove the feed link at the bottom of a post, the one which says Post (Atom). Without affecting anything.

  • Go to dashboard/ template/ edit HTML
  • Click the 'Expand Widgets Templates' box
  • Find:












Example


Read more »

Disable newer and Older Post Links in Blog

No comments
Disable newer and Older Post Links in Blog

If you are using Blogger as blogging platform, you might be used to some of the built-in features, that you consider hard coded, but can be changed with slight template code modification. One of the trick, presented in this publication, addresses a seemingly minor issue on the page - two links “Older Posts” and “Newer Posts” on the bottom of the page.

For those, who prefer their blog to be maximally close to the static webpages, these links not just unnecessary, but are plainly irritating. There is a way to remove them once and forever. And that is quite easy to do, even for not very experienced users. Note, that this trick will also remove “home” link from the bottom of the blog page.

Open Layout Tab in your blog profile page, choose Edit HTML, and search your code in your blog template for the following text:

#blog-pager-newer-link {
float: left;
}
#blog-pager-older-link {
float: right;
}
#blog-pager {
text-align: center;
} 

Now replace that code with the following code:

#blog-pager-newer-link {
display: none;
}
#blog-pager-older-link {
display: none;
}
#blog-pager {
display: none;
}








Read more »

Change blogger background color

No comments
Change blogger background color

Find EDIT blogger template using HTML editor
Actual code for your background color

If you look the actual code of your template then you see there is a linebackground: $bgColor;. This line is actually represented for the background color. See there is a field $bgColor which is responsible for defining color. You may choose any color value here. So, the actual code segment for background color looks like the following.


?
1
2
3
4
5
6
7
8
9
10
body{
    background: $bgColor;
    margin: 0;
    padding: 0px;
    font: x-small Verdana, Arial;
    text-align: center;
    color: $textColor;
    font-size: small;
    font-size: small;
}
Look, the second line of the above code. It's the actual line which define the color of your template color.

Change the color of your blog template
Now, we want to change color of our Minima template. Let we want to change the background color to the right hand side rectangle color. To change any color, we have to replace$bgColor field to any color value. For color value of the right-hand side rectangle is #FFCCFF. Now change the code with that value. After changing the color value the code will look like the following:
?
1
2
3
4
5
6
7
8
9
10
body{
    background: #FFCCFF;
    margin: 0;
    padding: 0px;
    font: x-small Verdana, Arial;
    text-align: center;
    color: $textColor;
    font-size:small;
    font-size: small;
}
Look the above code's second line. We just change the second line of the code. After changing that line, your template background color will be changed.

Note:
You may choose any color. To see the color value of several color, you may visit the following link:













Read more »

 
Worlds best tips and tricks website