Sunday 29 December 2013
Saturday 28 December 2013
How to Use LocalStorage in Blogger to Set Cookies?
In our last post we learned the
difference between a web cookie and HTML5 Local storage. Now when you are
cleared what are the benefits of using HTML5 Local and Session storage methods
to store data on a client's browser, lets now learn how to implement these
functions to any HTML DOM in Blogspot blogs. This method is not limited to
Blogger but can also be used in exact same procedure in Wordpress blogs. Lets
learn this interesting new technology with this extremely easy first time
guide.
1. Assigning ID
If you are
familiar with HTML and CSS basics then this would be extremely easy for you.
You know that in order to apply a CSS style, you either use ID starting with (#)
sign or a Class starting with (.) sign. Any HTML DOM can be given an identity i.e. ID. This
id is then used in front-end scripts like jQuery, JavaScript etc. to add visual
effects to HTML section. You can add an ID to any HTML tag may that be
<div>, <span>, <img> or <a>.
Suppose if
you wish to add an ID to a popup container then find its DIV and add an ID as
shown below:
<div id="KEY">
---
---
---
---
---
---
</div>
Key= The
name of your ID. it can be anything.
If incase
the popup container already contains an id called mbtpopup then you can add a new ID in this way:
<div id="mbtpopup KEY">
---
---
---
---
---
---
</div>
Just give a
space and there you go with the new ID name. You can add as many IDs as you
want with a space in between any two IDs and also make sure the ID names should
be unique. In the above example the Key could be anything except the mbtpopup. Lets take KEY as hidepopup
2. Using Jquery to setup a Cookie
Now when
you have assigned an ID name, its time to set a HTML5 cookie in order to
control the behavior of the popup. Suppose if you wish to show the popup window
only once to your visitors then you can simply add the following script just
above </head> tag in your blogger template:
<script type='text/javascript'>
$(document).ready(function() {
if(sessionStorage.getItem("popupcookie") ==
1) {
$("#hidepopup").hide();
}
sessionStorage.setItem("popupcookie", 1);
});
</script>
Carefully
understand these important points:
Setting cookie:
- The yellow highlighted part is responsible for creating/setting a
sessionStorage. You already know the difference between a session and
Local Storage. If not then please read Part1 of
this tutorial series.
- In yellow section we kept the name of cookie as popupcookie. You can give your cookie any name you like. We also
assigned it a value 1.
- The yellow part will execute as soon as the page loads
first time.
Reading Cookie:
- The green highlighted section is where we are checking
the value of popupcookieusing an if conditional statement.
- The if condition will run only if popupcookie is set
and has some value stored in it. In our case the value is 1.
- If the condition is met, the red section will execute and it will hide the popup from appearing
on screen. This condition is true only if the popup has already been
viewed and we are trying to hide the popup the next time a visitor comes.
Remember
the order of writing the codes for setting and reading cookie. We will first
check whether the popup has already appeared once or not. If this is the first
time a visitor has opened your blog, then of course there will be no value
stored inside popupcookie because it never executed before. But if this is the second
time then we already have some value stored inpopupcookie (the
yellow section) , the condition will be true and the popup will not be shown
this time.
Installation
- First install the stickybar on
your blog by reading this tutorial: Add
stickybar
- Next paste the following script
just above</head> tag in your blogger template
<script
src='http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js'
type='text/javascript'></script>
<script
type='text/javascript'>
$(document).ready(function() {
if(sessionStorage.getItem("HideBar")
== 0) {
$("#bloggernotification").show();
}
if(sessionStorage.getItem("HideBar")
== 1) {
$("#bloggernotification").hide();
$("#openbloggernotification").css('top','0px');
}
$("#closebloggernotification").click(function(){
sessionStorage.setItem("HideBar",
1);
});
$("#openbloggernotification").click(function(){
$("#bloggernotification").show();
sessionStorage.setItem("HideBar",
0);
});
});
</script>
- Delete the yellow highlighted code if you have already
added the jQuery library inside your blog.
3. Save your blog and you are all done! :)
How can you increase your broadband speed in XP
1) First u Click on Start Button.
2) Then Select Run From Start Menu.
3) Now Type gpedit.msc
4) Expand the [Administrative Templates] branch.
5) Then expand the [Network] branch.
6) Highlight (Select by Single Click) [QoS Packet Scheduler]
7) Double-click “Limit Reservable Bandwidth” (Available in Right Side Panel)
8) Check(Select By Single Click on it) [Enabled]
9) Change [Bandwidth limit %] to 0 %
10) Click OK Button.
11) Restart Your PC.
12) Now Check Your Broadband Speed.
Security tips to Avoid Virus /Trojan/ Key logger Infection
Tuesday 24 December 2013
Monday 23 December 2013
Saturday 21 December 2013
Friday 20 December 2013
live geo super (Pakistan vs Sri Lanka 2nd ODI)
1st
Test - India V South Africa
|
|
Match in progress
|
|
2nd
ODI - Pakistan V Sri Lanka
|
|
Match
in progress
|
Subscribe to:
Posts (Atom)
-
Vulgarity is being encouraged by Pakistani... by f100002648576063 -
B.E. / B.Ed. / BS / BBA / BPA / M.A. / M.Sc. / MCS / MBA / MPA / M.Com. Admissions 2014 (on Entry Test Basis ) :: JPG Pharm-D E...
