Showing posts with label JavaScript. Show all posts

Encrypt Your Personal Details with JavaScript

When you have a lot of online accounts to handle and don't have enough time to memorize all the passwords it becomes an annoying problem. What if you could save your passwords and other details in a simple text file on your PC ?

That makes sense but if your PC is accessible to others it is not a good idea to explicitly save your personal account details in a text file available to every user on your PC.

There are many other ways to keep your account credentials safe on your computer but they are often a folder password software or something like that, but it is a waste of time and most of the times those software are malware itself.

Another option is using an encryption/decryption software on your PC but you won't be able to decrypt your details if you don't have that particular software on the other PC too. Say you downloaded the encrypted file from your Dropbox on a public PC, now to decrypt it you need to install an extra software on it, and it's not a good idea though.  

Let's Start Encrypting/Decrypting

There's an inbuilt encode and decode function in JavaScript that takes in an string and output the result. The function we are talking about are btoa and atob, in JavaScript these functions are generally used for transmission of data that may cause communication problems.

But I found another use of these functions and when I found myself saving my account details on my PC accessible to anyone. I then used those function to encode the details, save it in a text file and when I needed it I used the decode function.

Open the JavaScript Console

First we need to open the Developer Tools with JS Console in the browser. If you want to learn how to open developer tools in different browser check this tutorial.
http://www.stramaxon.com/2013/10/developer-tools-in-browser.html

If you don't want to read that tutorial then just use these keyboard shortcuts to open JavaScript console on your browser :
Chrome - CTRL+SHIFT+J (CMD+SHIFT+J on Mac)
Mozilla Firefox - CTRL+SHIFT+K

Encode it first

Finally when we have the Console open, we are ready to use it for encoding any text we like. The function that encodes any text is btoa("Text you want to encode") if you run this in your Console it will output this VGV4dCB5b3Ugd2FudCB0byBlbmNvZGU= .

We now know what the function does now see how can you use it
btoa("Something here");

The text between the parentheses and double quotes is the text you are encoding so replace it with your personal details you want to encode and once you run it the console will return the encoded version of it, now you can save that text in your file and no one be able to read it (if you don't have any geek or programmer kind of people near you, can be worry free).

Here's a screenshot


Time to Decode

Encoding is of no use if you can't decode it for later use. As btoa() encodes a string similarly atob() decodes the encoded text.

Try running this code in your open JavaScript Console
atob("VGV4dCB5b3Ugd2FudCB0byBlbmNvZGU=");

This will output "Text you want to encode". You use this function in the same way but you just need to pass encoded data in the parentheses.


Tip: If you want extra protection, you can encoded the encoded data too but you also need to decode it the times you encoded it.

Bonus Tool!

Even before writing this article I had written a small JavaScript tool you can use to encode/decode data without worrying about the Console and function codes. Click the link below and start using it.

Sometimes it's fun to to a work in the difficult way ;)

JavaScript 'Unexpected Token ILLEGAL' Error

Some errors in JavaScript are hard to find out and this is one of them, 'Unexpected Token ILLEGAL' message on your console can make you go crazy and re-check the code but if you didn't solve the problem read the post.

What can be worse than getting an error after writing a long JavaScript code ? 'Unexpected Token ILLEGAL' error is a frustrating one, it's often caused by an invalid character in the script. Most of the times you will find the unwanted character after thoroughly checking the script and then error is fixed but many times finding that unwanted character becomes a headache and to fix it we have to do something else than just checking the script again and again.

If you didn't find any invalid character in your code then it's obvious that the character is an hidden character and your are a JsFiddle fan. The invalid hidden character can be u200b (zero width space) or other hidden characters but how to find or fix it ? Good question, as the characters aren't visible how could we remove it ?

Removing whitespace in the code

If you want to fix it fast then the best way is to remove all the whitespace around and in the code and then run it. 

Testing your script with JSBin


If you use JsFiddle or some other code editing site/program which don't have support for ignoring or displaying invalid characters then this might always happen.

To check the code for an invalid characters use JsBin to find the invalid characters and remove it. Go to JsBin and paste your script in the left panel now your invalid hidden characters will be displayed as red dots, just remove those red dots and done, the code is now ready to use.

See this image :



To prevent it in future don't copy and paste the codes from JsFiddle or any other program that creates invalid hidden characters.

But there can be more reasons for this error and if you find one please tell us in comments. 

Implement PrismJs Syntax Highlighting to your Blogger/BlogSpot

As the web becomes more open source and beautiful, programmers and designers are coming up with their own ideas. Syntax Highlighter is the most used code highlighter for websites since it was the first of it's kind and opensource. The web has changed then and now and you need a brand new Syntax highlighting plugin that really looks like the 2012's site
Last updated: 15th April 2017

Still wondering what's PrismJs ? Check it's official page for more information http://prismjs.com/, it's the second generation of syntax highlighting, it is more lightweight and that doesn't affect your page load time at all.


The overall adding procedure is the same as mentioned on the PrismJS official page but there are yet some modifications need to be made if you want it to work properly on Blogger blogs. In this tutorial i will provide the links to minified version of the codes, once you get the idea about adding it, you can use whatever version you want.

Include the files in your template

The first thing you have to do is adding the CSS and JavaScript files, to make Prism Syntax Higlighter work, you just need to add two files into your template and both are less than 10kb. That's a good thing for you Page Speed.

<link rel="stylesheet" href="http://prismjs.com/themes/prism.css"/>
<script type='text/javascript' src="http://prismjs.com/prism.js"></script>

And where to add this ? It is simple, just above the ending </head> tag. Go to your Template -> Edit HTML -> Proceed -> Use CTRL+F to find </head> and paste the HTML script and link tag just above </head>


Note : The links in the script and link tag is only for demo of the code, if you want to use different theme then you can download the version of your choice on PrismJS Download page, upload it to your hosting service and replace the links with your hosted file's links.

Now display codes in your post

Wrapping the display code into <pre> tag is normal for displaying codes on webpages and to display the codes in Prism style you have to do it like this way. (demo for codes display)


The following example is for displaying HTML codes in your pages, to define any languages you have to edit language-xxx
<pre class='language-markup'>
<code>
// Your HTML Code here
</pre>
</code>

Tip: You can add the class for a language to any parent element and the children elements will inherit the defined language. It is very useful when you just want to display codes of the same language in a page.

Escape HTML characters

But in Blogger you have to escape the HTML characters so it don't get interpreted as raw HTML. Use QuickEscape tool to convert Raw HTML into displayable HTML. For example, if you want to display this HTML code
<ul class='make-tea'>
<li>Tea</li>
<li>Water</li>
<li>Sugar</li>
<li>Milk</li>
</ul>
It should be converted into this, so you can paste it into the HTML mode of Blogger post editor to make it displayable
&lt;ul class='make-tea'&gt;
&lt;li&gt;Tea&lt;/li&gt;
&lt;li&gt;Water&lt;/li&gt;
&lt;li&gt;Sugar&lt;/li&gt;
&lt;li&gt;Milk&lt;/li&gt;
&lt;/ul&gt;
The whole code witth <pre> and <code> tag will be then look like this.
<pre class='language-markup'>
<code>
&amp;lt;ul class='make-tea'&amp;gt;
&amp;lt;li&amp;gt;Tea&amp;lt;/li&amp;gt;
&amp;lt;li&amp;gt;Water&amp;lt;/li&amp;gt;
&amp;lt;li&amp;gt;Sugar&amp;lt;/li&amp;gt;
&amp;lt;li&amp;gt;Milk&amp;lt;/li&amp;gt;
&amp;lt;/ul&amp;gt;
<code>
</pre>
The HTML is then ready to be pasted in your post. In the post editor switch to HTML view and place the code but always remember to escape raw HTMLs.

Languages

To define languages you just have to change the language-xxxx in the class you can find in <pre> and <code> tags.
  • For HTML we will use this tags to wrap the display codes
    <pre class='language-markup'>
    <code>
    // Your HTML Code here
    </code>
    </pre>
    language-markup is used for HTML markups. You may use this for XML codes too.
  • CSS will be wrapped into this tags
    <pre class='language-css'>
    <code>
    // Your CSS Code here
    </code>
    </pre>
  • JavaScript can be wrapped into this
    <pre class='language-javascript'>
    <code>
    // Your JS Code here
    </pre>
    </code>
    JQuery can also be displayed with this.
  • Want to learn more than check out the PrismJS homepage

For Different Themes

The great thing about PrismJS syntax highlighter is that you can make the code blend with your site's overall theme by using different themes provided by PrismJS. There are the following themes available by default for it : default, dark, funky, okaidia, twilight, coy and solarized light

With a single addition of a CSS file you can change the theme for all PrismJS syntax highlighter instances on your blog.
In the first step we added the default theme,

<link rel="stylesheet" href="http://prismjs.com/themes/prism.css"/>
<script type='text/javascript' src="http://prismjs.com/prism.js"></script>

The http://prismjs.com/themes/prism.css in the first line of code sets the theme to default, while the following sets it to its corresponding theme.

Dark 
<link rel="stylesheet" href="http://prismjs.com/themes/prism-dark.css"/>

Funky
<link rel="stylesheet" href="http://prismjs.com/themes/prism-funky.css"/>

Okaidia
<link rel="stylesheet" href="http://prismjs.com/themes/prism-okaidia.css"/>

Twilight
<link rel="stylesheet" href="http://prismjs.com/themes/prism-twilight.css"/>

Coy
<link rel="stylesheet" href="http://prismjs.com/themes/prism-coy.css"/>

Solarized Light
<link rel="stylesheet" href="http://prismjs.com/themes/prism-solarizedlight.css"/>

Your feedback

I tried to put as much information as I can but if you find something missing or needs to be reviewed then please drop your comments. Also you can write to us on depy45631@gmail.com or see the contact page.

Add Syntax Highlighter into Blogger to display codes

Syntax Highlighter is a widely used code highlighter on websites and blogs, almost every web developer, web designers or any people who want display codes on their pages. In this tutorial you will learn how to add it on your blog on blogger.

Use the PrismJS,a simple and lightweight opensource syntax highlighting plugin
Syntax Highlighter is a tool by Alex Gorbatchev and thanks to him for developing such useful tool. In order to the add the Syntax highlighter scripts and make it work on your blog follow the steps.

Add the scripts 

The script files i will be giving links to in the script tag is hosted on the developer's server, if you want to download it to host on your own server then click here to download Syntax Highlighter files.
<!-- SyntaxHighlighter starts -->
<link href='http://alexgorbatchev.com/pub/sh/current/styles/shCore.css' rel='stylesheet' type='text/css'/>
<link href='http://alexgorbatchev.com/pub/sh/current/styles/shCoreMDUltra.css' rel='stylesheet' type='text/css'/>

<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shLegacy.js' type='text/javascript'/>
<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shCore.js' type='text/javascript'/>
<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushAS3.js' type='text/javascript'/>

<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushBash.js' type='text/javascript'/>
<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushCSharp.js' type='text/javascript'/>
<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushColdFusion.js' type='text/javascript'/>
<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushCpp.js' type='text/javascript'/>
<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushCss.js' type='text/javascript'/>
<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushDiff.js' type='text/javascript'/>
<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushErlang.js' type='text/javascript'/>
<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushGroovy.js' type='text/javascript'/>
<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushJScript.js' type='text/javascript'/>

<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushJava.js' type='text/javascript'/>
<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushJavaFX.js' type='text/javascript'/>
<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushPerl.js' type='text/javascript'/>
<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushPhp.js' type='text/javascript'/>
<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushPlain.js' type='text/javascript'/>
<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushPowerShell.js' type='text/javascript'/>
<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushPython.js' type='text/javascript'/>
<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushRuby.js' type='text/javascript'/>
<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushScala.js' type='text/javascript'/>

<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushSql.js' type='text/javascript'/>
<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushVb.js' type='text/javascript'/>
<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushXml.js' type='text/javascript'/>
<script language='javascript'>
SyntaxHighlighter.config.bloggerMode = true;
SyntaxHighlighter.defaults[&#39;auto-links&#39;] = false;
SyntaxHighlighter.config.clipboardSwf = &#39;http://alexgorbatchev.com/pub/sh/current/scripts/clipboard.swf&#39;;
SyntaxHighlighter.all();

</script>
<!-- SyntaxHighlighter ends -->
Looks very heavy but all you have to with is to add it into your Template.

Add it to your blog's Template

And to do that Go to Blogger Dashboard -> Template -> Edit HTML -> Proceed -> Use CTRL+F to find </body> in the template and paste the codes above </body>


Tip : The codes can differ in your page loading time, if you don't display codes on your homepage then use this script, which is same to above scripts but only added blogger conditional tag around it to load it only on post pages.
<b:if cond='data:blog.pageType == "item"'>
<!-- SyntaxHighlighter starts -->
<link href='http://alexgorbatchev.com/pub/sh/current/styles/shCore.css' rel='stylesheet' type='text/css'/>
<link href='http://alexgorbatchev.com/pub/sh/current/styles/shCoreMDUltra.css' rel='stylesheet' type='text/css'/>

<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shLegacy.js' type='text/javascript'/>
<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shCore.js' type='text/javascript'/>
<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushAS3.js' type='text/javascript'/>

<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushBash.js' type='text/javascript'/>
<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushCSharp.js' type='text/javascript'/>
<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushColdFusion.js' type='text/javascript'/>
<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushCpp.js' type='text/javascript'/>
<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushCss.js' type='text/javascript'/>
<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushDiff.js' type='text/javascript'/>
<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushErlang.js' type='text/javascript'/>
<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushGroovy.js' type='text/javascript'/>
<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushJScript.js' type='text/javascript'/>

<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushJava.js' type='text/javascript'/>
<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushJavaFX.js' type='text/javascript'/>
<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushPerl.js' type='text/javascript'/>
<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushPhp.js' type='text/javascript'/>
<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushPlain.js' type='text/javascript'/>
<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushPowerShell.js' type='text/javascript'/>
<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushPython.js' type='text/javascript'/>
<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushRuby.js' type='text/javascript'/>
<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushScala.js' type='text/javascript'/>

<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushSql.js' type='text/javascript'/>
<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushVb.js' type='text/javascript'/>
<script src='http://alexgorbatchev.com/pub/sh/current/scripts/shBrushXml.js' type='text/javascript'/>
<script language='javascript'>
SyntaxHighlighter.config.bloggerMode = true;
SyntaxHighlighter.defaults[&#39;auto-links&#39;] = false;
SyntaxHighlighter.config.clipboardSwf = &#39;http://alexgorbatchev.com/pub/sh/current/scripts/clipboard.swf&#39;;
SyntaxHighlighter.all();

</script>
<!-- SyntaxHighlighter ends -->
</b:if>
The adding process is same as the above

Highlighting the codes in posts

Once you have added the code in your template, now you have to make the your code display in the Syntax highlighter and to do that you have to wrap your display codes into <pre> tag with special attributes into it to define what language you are displaying the code in.

Displaying the code if it's HTML

This is an example of how you have to markup the codes if you are display HTML codes.
<pre class='brush:xml'>
// HTML Code here
</pre>
The HTML code is wrapped into <pre> tag and with class='brush:xml' and it's what tells SyntaxHighlighter that it's an HTML code (HTML and XML both looks similar)

Brushes : There are more languages SyntaxHighlighter supports and here's the list of values you can put in the brush value. Following are the brushes you can apply on your codes
as3, bash, csharp, coldfusion, cpp, css, diff, erlang, groovy, jscript, java, javafx, perl, php, plain, powershell, phython, ruby, scala, sql, vb, xml

Add it to your post

Let's say you want to display a HTML code, the whole code with the wrapping <pre> tag will be this
<pre class="brush:xml">
<ul class='make-tea'>
<li>Tea</li>
<li>Water</li>
<li>Sugar</li>
<li>Milk</li>
</ul>
</pre>

To add it open your Post Editor, switch to the HTML mode and paste the your HTML code between the <pre> tags.

Note : If you paste your display HTML raw, it will interpret itself and then it can't be displayed as HTML, to prevent it you must first convert your raw HTML into escaped characters. Use Quick Escape to convert your HTML to escape characters.
Example -
This is the Raw HTML before conversion
<ul class='maketea'>
<li>Tea</li>
<li>Water</li>
<li>Sugar</li>
<li>Milk</li>
</ul>
This is the converted HTML codes.
&lt;ul class='maketea'&gt;
&lt;li&gt;Tea&lt;/li&gt;
&lt;li&gt;Water&lt;/li&gt;
&lt;li&gt;Sugar&lt;/li&gt;
&lt;li&gt;Milk&lt;/li&gt;
&lt;/ul&gt;
Just put the converted Raw HTML code into the <pre> tag and you are ready to paste it into your post, just switch to HTML mode and paste it at the right place.

Customizing the SH skins

You can use different skins and colors for your SyntaxHighlighter, to make changes to the skins you just have to change the  2nd<link> tag in the SyntaxHighlighter scripts HTML. This is the link tag you have currently
<link href='http://alexgorbatchev.com/pub/sh/current/styles/shCoreMDUltra.css' rel='stylesheet' type='text/css'/>
You can use any of the following styles, just replace the yellow highlighted text with any style below (each style is separated by a comma).
shThemeRDark, shThemeMidnight, shThemeMDUltra, shThemeFadeToGrey, shThemeEmacs, shThemeEclipse, shThemeDjango, shThemeDefault, shCoreRDark, shCoreMidnight, shCoreMDUltra, shCoreFadeToGrey, shCoreEmacs, shCoreEclipse, shCoreDjango, shCoreDefault
For examply if you want to use shCoreEmacs skin then the href value in link tag will be this
<link href='http://alexgorbatchev.com/pub/sh/current/styles/shCoreEmacs.css' rel='stylesheet' type='text/css'/>
Simple as that.. Now choose whatever skin or theme you want and apply it.

Your feedback

I tried my best to keep this tutorial as easy as possible, but if there's something you can't understand or wrong then you can contact me. If you have successfully implemented SH in your blog using this tutorial then you can thank us by dropping your comments.

Subscribe to our blog for more blogger tricks updates. 

Show/Hide effect for Gadgets in Blogger with JQuery

Don't you sometime feel like adding more dynamics to your blog and make it more user friendly, like giving them their own control like toggling show/hide of a gadget. You will learn how to do that in Blogger.
A little instruction to JQuery: It's a powerful and small JavaScript library to add dynamic features and sometimes also used for transferring data.

For a demo of this JQuery effect, click on the Title of About me gadget on right sidebar and see it toggling between hide and show. Ain't it great, you let your users decide whether they want to choose to display the gadget or not.

Adding the JQuery lib.

In classic blogger template, JQuery library isn't added in the document already. So to make the JQuery codes work you first have to implement the JQuery library.
To do that in blogger, Go to Blogger Dashboard -> Template -> Edit HTML -> Use CTRL+F and find </head> and paste this HTML script tag just above </head>

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
This is just the first step, now read further for the real trick.

The JQuery to make the effect 

The main think we have to focus on this is the correct selector so it should work for your blog too. Although there i know the basic selector for classic blogger templates and can be applied on any template unmodified.


This is the magical code doing it all, study it well and read what ever line is about
<script type="text/javascript"> 
$(document).ready(function(){
$('.sidebar .title').one("click",function(){
$(".sidebar .widget-content").slideToggle("slow");
});
});
</script>
Note : The first and last line is just to wrap it into script tag to be placed in the document.
  • Line 2 : It tells the browser to load the Jquery after the document is fully loaded and read for performing JQuery effects
  • Line 3 : The whole line describes that when .title in the .sidebar gets clicked then perform the function (which is in the next line)
  • Line 4 : Continuing from the above line, it plays the function that was declared in the 3rd line, it makes the .widget-content inside .sidebar to hide when it's visible on a click event and when it's already hidden it's comes back in view. 
  • Line 5 and 6 : Ending for the above lines
Where to add this Script ? Go to Blogger Dashboard -> Template -> Edit HTML -> Use CTRL+F and find </head> and paste this HTML script tag just above </head>

You can use this on other areas of your blog just by making some changes in selectors, selectors can be identified easily with chrome developer tools.

Result : So when you are done placing the codes at right place, Save the template and refresh your blog using CTRL+F5 to ensure that all files are loaded freshly. Now try clicking on title of any of your gadget and see the amazing toggle effect. That will just make you blog to a new level.

Your feedback ?

This tutorial is designed to make implementation of JQuery in blogger easy and make you understand jquery, so if you find anything difficult and don't understand it then drop your comments and we may just look to it.

This JQuery will not work on some blogs having different templates, so if you don't have any idea what to do then post your blog links in the comment and we will guide you through the process. 

Website/Blog Being redirect to fileave(dot)com or pagesintxt(dot)com - Fix it

This is a very annoying problem, but this happened to lots of users, when they tried to open their blog, they were redirected to a weird and unexpected site, in some cases it was either a domain which consist a name 'Fileave' or 'Pageintxt'.
This is not a referring spam, but the problem caused by JavaScript tags you added from other sources, in most cases i have seen that people who added custom cursors were effected, it's not because that cursor was corrupted, but people were using JavaScript hosted on fileave (a file sharing service) by some user named 'carnine9', as i can see in the JavaScripts.


Maybe they offered you to add cursors and the files were hosted on fileave for example this is one of the file hosted on Fileave by the user carnine9
http://carnine9.fileave.com/CursorRed.js
At end you can see CursorRed.js, the full url is the link to JavaScript file that was hosted on Fileave, but after it was deleted, there was no CursorRed.js on Fileave and that's why it's redirecting you to Fileave.com.

There are more other JavaScript files which were hosted on Fileave and it got delete somehow. Not only cursor, but if you are hosting JavaScript files on a file sharing service it will end up with like this. JavaScripts file should only be hosted on Paid Hosting services offering CPanel or if they don't find the file on their file sharing site (Fileave) they will just redirect the blog to the site.

Overall you may have understood what's the main problem, i have taken one case as an example to show you how it happens so you better understand what should you do when this happens.

How do i fix it ?

Here i will list the steps to fix it on Blogger, but if you are on other platform such as WodPress etc. you may also have to delete the script tag from your template, the only thing that will be different is the procedure edit your main HTML. 

If you are on Blogger, follow these steps to access your Template HTML, we can't edit the HTML by going to Blogger Dashboard | Template, because it will even redirect you to the unexpected site, because in the new interface, your blog is shown in a small box when you get into Dashboard | Template you can see it and then the site is loaded in the box it redirects you to the site.

So, how will we get into editing the Template ? Because the JavaScript code is in the template and the only way to remove it is editing the Template.

Don't worry, we have the solution. Please follow these steps to get into the Edit Template HTML :
  1. First you need you blogID, which you can get by going to your Blogger Dashboard | Overview tab, you can select any tab other than Template
  2. Once you are in the Overview tab, check the URL in your browser's address bar, for me it's
    http://www.blogger.com/blogger.g?blogID=7325178131968982824#overview
  3. Here you can see the blogID=7325178131968982824, the number is your blogID, which you will need in the next procedure. So the blogID is 7325178131968982824
Now when you got your blog id, follow these steps :
  1. Replace the blogID in this URL with your's and hit enter in the address bar
    http://www.blogger.com/html?blogID=7325178131968982824#template
  2. Now you will see your Template code in Old Blogger Interface
  3. Use CTRL+F or F3 and search for the domain you are redirected as keyword, for instance my blog is being redirect to fileave(dot)com, the i am supposed to enter 'Fileave' in the search.
  4. Once you find the <script> tag containing the domain address where the blog is being redirect, delete it and Save Template. The script tag might look like this
    <script src="http://carnine9.fileave.com/CursorRed.js" type="text/javascript"></script>
Now open your blog and see if it's fixed or not. Doing this correctly will stop the redirection but if it don't seem to be fixed then do comment with your blog address and explain the issue with detail. Also try posting on Blogger Help Forum.

    White Blank box showing up on my Blog page - How to fix it?

    Are you seeing blank white box on your blog or website page, those box looks too weird on the our website or blog, so this tutorial post will show what it is and how to remove it.
    It all started to happen today, if you ask me what it is, my answer will be that it's a bug from facebook plugins code, Facebook is having some problems with their scripts, and thus blog page are showing iFrame on blog pages. The White box is a iframe, which is executed from the Facebook plugins code.


    I came to know about this on Blogger Help Forum, i thought this problem was only of that user, but similar posts were posted by the users, then it was sure that it was problem of the Facebook plugins code after i examined the HTML code of the pages. The iframes are being usually showerd on top of the page. See this screenshot, it's from a blog that was facing the problem.


    The Exact code, that's creating the problem is Facebook's JavaScript SDK, which we need to add to our HTML to show Facebook plugins, not it's gone buggy and creating iframes on Blogger. Removing it may remove the boxes (iframe) from the page, but also disable all Facebook plugin such as Like buttons, comments etc on the Blog. So we will use different method to remove it.

    After seeing more blogs, i saw that the iframe is only showing on which the Facebook like box is being displayed. 


    How to fix it?

    Let's don't waste much time and get to the main point, how to hide it. To remove them permanently from template is little difficult, because it requires you to remove the code from your template which runs Facebook like button and other plugins, so we will hide it with CSS.


    Fortunately, the two iframe have been classed, so we can easily hide it without any difficulties. Follow the Step-by-step instructions.

    1. Log into your Blogger dashboard
    2. Copy this small CSS code
      #fb_xdm_frame_http, #fb_xdm_frame_https {
      display:none !important;
      }


  1. We have to add this CSS, so go to Template tab 




  2. Click on Customize and then select Advanced tab




  3. Scroll down, and click on Add CSS, you will then see a input area, just paste the CSS code there.



  4. We only need the CSS code, the rest of the steps can be seen on my How to add CSS to your blogger tutorial

    If you think, this is not working then please post your Blog address in comments below, we will tryour best to help you.

      How to select all friends at once to invite friends on Facebook

      Facebook friend invites are useful to invite your friends to view your website or to like your new Facebook page etc. you will see friends invite almost everywhere on Facebook.  


      Facebook invites are useful but a sometimes it can be a tough job if you have large number of friends, I had 2525 friends on Facebook and it was very difficult for me to select each and every friend manually to invite them all.

      When I started learning JavaScript, I learn how easy it was to manipulate web pages using codes and then I found a way to automatically check all the check boxes on invite boxes.

      But before we start, make sure you are using Google Chrome or Firefox, they are good as they support almost every new JavaScript functions and are updated, so using them makes sure that it will not create any problems. I will explain it in step by step procedures.

      1. Open Google Chrome 
      2. Now open any event etc. where you can invite your friends and open the friend invite box
      3. Now scroll down until all your friends appears in the box
      4. Press CTRL+SHIFT+J (for Chrome), CTRL+SHIFT+K (for FireFox)
      5. A JavaScript console pane should open at the bottom of the page
      6. Paste the following line of JavaScript code in the console

      Problem using Developer Tools? Check the tutorial on using Developer Tools on different browsers

      javascript:elms=document.getElementsByName("checkableitems[]");for (i=0;i<elms.length;i++){if (elms[i].type="checkbox" )elms[i].click()};
      After pasting click enter, now wait for a minute and when all friends are selected click on send, if you have large number of friends it may take about 1 - 2 minutes for successfully sending the invites . 


      Problem inviting all friends ?

      If you are unable to invite all your friends then you must check this updated post which also has a video tutorial. http://www.stramaxon.com/2012/12/inviting-all-friends-facebook.html

      Related Post: How to Increase your Twitter followers in 10 minutes