I Am Back!

It's been more than 6 month since I have posted [anything worth reading] on my blog. So I am making a comeback.

Going to give this blog and makeover and will be posting new and interesting stuffs soon, everything from codes to coffee  ;)

Stay tuned! New adventures are coming soon.. 

Is Your Facebook Down ? You're not alone!

Facebook, the second largest website on the internet has suddenly stopped working everywhere!

Update: It is up now
Millions of (almost everyone who uses FB on a daily basis) people encountered error while trying to access the Facebook website. None of the pages is accessible.

It shows the following page (Facebook's current status) :

Sorry, something went wrong
We're working on getting this fixed as soon as we can

This  is all Facebook has for the users now, no technical details about the errors are out yet. Plus there has been no updates on when it will be fixed and Facebook will be accessible again.

Don't worry, no one is able to access Facebook for now, so use an alternative to connect to your friends and family.

What you can do:

1. Go out.. meet your friends in real, chat with them and click some photos and share it using bluetooth.
2. Use Twitter or Google+ to show your condolences for the sudden demise (temporary) of Facebook (#kidding huh!)
3. Remember the old days? We used Text Messaging!

What you can't:

1. Update your status about Facebook's error.

Some Twitter updates on #facebook

Facebook Took Action to Block Developer Tools - Know Why

If you recently tried accessing the developer tools in your browser on Facebook you might have noticed a large notification in the console highlighted in red. Well, that's for a reason, if you haven seen that scam/spam yet let's tell you more about it.

Developer Tools are great for debugging websites and running scripts manually on a web page, it could be done on any website including Facebook. By writing a script, the author can make anything do with the site on Facebook they can use it for sending friend requests, making comments etc. anything that is possible. Because all that functions are controlled by JavaScript onsite.



Taking advantage of these awesome feature of a browser, some notorious spammers have wrote a script which auto-tags people and like pages associated with them on their statuses where they post instruction to use their code they wrote by claiming that the user will get a new theme for their Facebook, which would seem to work but what it does in the background will terrify you.

The code would send unwanted likes to the pages the spammers wants, it will auto-tag your friends in 100s of status automated by the script and much more as they might even get access to your account. The spam have got amazingly viral as people do really think it's going to work and try it without giving it a thought.

How does it actually look ?

This is an example of well planned viral spam by some script kiddies originating probably from Indonesia.

The link they tell you to open contains the code which they ask you to run in the browser's console which then do what it is supposed to - screw you.

If you see any such things in the future don't let it make you look like a fool! Just block that person and you are good and safe.

Facebook Took An Action to Control it

By disabling developer tools temporarily. Developer Tools is a great tool for developers so they didn't disabled it permanently on their site, but it let's you choose what you want to do. And will also show you what could be the consequences of running scripts from Unknown sources.

Not all scripts are dangerous, for example see my "How to Select All Friends at Once on FB" script, it just automatically selects your friends for inviting them in events etc. But you can clearly understand from this that code can do things that you don't expect to be automated.

Beware before you run scripts from third-party sources especially from these so-called lucrative offers. And even though the script seems fine to you make sure to see what others say about it, what's their opinion to get an idea about it.

It's all, be safe online :) 

Making Images Fit in Post Body on Blogger

If you are working on a responsive design for your Blogger blog, or you are just tired of resizing your images in post editor to fit in the post container then this tutorial will show you an easy way to make images fit with it's surrounding.

This problem occurs often when you try to post images of the dimension larger than your content area or you are just using a responsive layout and when it down-sizes, the images overflows the content area.

Before you continue with the tutorial, check the demo:
Demo: Without the CSS Demo: With the CSS

In the first demo, the image in the container overflows because the width of the image is larger than that of the image, but in the second demo, if the image width is greater than the container's, it will fit itself to the container.

The Code!

All this can be achieved with a small block of CSS code. Before I start giving you lectures on how this works, here's the code for you to use (can be used in most Blogger Templates, but you might need to change the selectors if you are using a custom designed template):

.post-body img {
    max-width:100%;
    max-height:auto;
}

Now you just need to apply this code to your blog, check this tutorial to learn how add CSS in Blogger.

How does it work?

If you are not a web designer or coder, then this might all seem like a magical charm to you, but it's just code, code that's made to make your life easier. Well, so if you are ready to get bored then I am starting my chapter on CSS.

What actually does the magic is the max-width CSS property which gives any element a maximum width limit. So if you specify an element the the maximum width of 200px, it wouldn't exceed it. The 100% value tells the browser that the element(s) must not exceed the full content width of the container.

The max-height property helps in keeping the original proportion of the image intact. To know more about what would happen if you specify a value in percentage then try and check the results ;)

Add A New Year Background Image to your Blog

New year is just hours away and everyone is getting prepared wish new year to their friends and family. If you run a blog it would be a good idea to celebrate new year with your readers by changing its look a bit.

This new year eve, add a bit of code in your blog to wish your blog readers a happy new year. We just add a view lines of code to set a new background image with a happy new year message on your blog.

It's almost 2014, so without much blah blahs, following are the wallpaper's preview and the code you need to add :

1. Dark Brown Wallpaper

html, body {
background: url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjxgiWtDpSnVIlnbxRj5tBGwR3x_GBk4t2HmYmX3bSPVyEwlnFHZCxPmt1NRd4r25zWnh12QrDfLSd6WhSsYLITT3k1PvH1egfCBYorYmU0j5ZUy4n3n0j1kW0w63laGXd0O0GpdKZzRcSL/s1600/1059-happy-new-year-1280x800-holiday-wallpaper.jpg') no-repeat center center fixed; 
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
}

2. Background with Fireworks

html, body {
background: url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgyyMxzi8Xig951jpgAjTxOxZY2_PN3MIPDABScAxBq1GJo3RhyYmhS04Pb_l6C7kO8lSjoVhsrktXO6PKBnKXmkaQztzZ2Y6gKw3YkeothvoJYQOiGSIuOiBZMCvquVlVk7wwOzEJOkT6I/s1600/1961-happy-new-year-1280x800-holiday-wallpaper.jpg') no-repeat center center fixed; 
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
}

3. Purple Background

html, body {
background: url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEja2oMNbpkMNm5vbUbthfuEumadpvhj4I7ujuN_v7vppSaanIZNs5RmSvRignryq0o2dN4ALjb84oMes-s_TolIgnYUChgN0sU5tbMmlJfqapQyelMOyXrrt8g8BP4N3ZU8f5q_bg9kEcWU/s1600/2084-happy-new-year-1280x800-holiday-wallpaper.jpg') no-repeat center center fixed; 
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
}

4. Classic Gold Shine

html, body {
background: url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi0Ozjx2Bo55_eaKkr5dz_95i8rZFqpcUPfquVDLTHNrOPbDnHcijHTkrB7Xe6cuL88IorcfFsvUZf8wN6BmuM9dhtHZI39BLxIsL8mzioLulGMzoSXeGcBUj0TMT0fcSmTTj9rJz3Z5dT3/s1600/2085-happy-new-year-1280x800-holiday-wallpaper.jpg') no-repeat center center fixed !important; 
-webkit-background-size: cover !important;
-moz-background-size: cover !important;
-o-background-size: cover !important;
background-size: cover !important;
}

Add the code

Once you've chosen a background image that suits with your blog you are ready to apply its code on your blog. To do it, copy the code.

Now go to your Blogger Dashboard -> Template -> Customize -> Advanced -> Add CSS -> Now paste the CSS code in the text area in the "Add CSS" tab and save it by clicking the "Apply to Blog" button.

That's it! And a very very big happy new year! :D

Easiest Way to Earn Money for Freelance Web Designers

If you have just entered the world of web designing it will be difficult for you to find work to earn some bucks but don't get disappointed, we have found a great way for you to earn money with your web design skills.

Internet is a great place use your web design skills and earn money from it, but finding clients is not easy as it seems. You can find a job in some local IT company etc. or start working as a freelance. Both have their own pros and cons. But if you are a person who wants to earn money fast by doing the work you like then Freelancing is the option for you.



It might be difficult for you find clients and projects on your own but if you are ready to work as a freelance then Freelance.com is a great start-point for your web design career. Unlike other outsourcing programs it doesn't require you to have years of experience in the area you want to work in.

If you are willing to work then you can start earning 100s of dollars in less than a week. Freelancer.com is a platform for both small business and entrepreneurs. The site has more than 9 Million users which makes it a great Freelancing platform.

It will take not more than 10 minutes to setup your profile and after that you will be able to bid on projects and take part in contests.

Not just web designing, from Data Entry to T-Shirt designing, it's got a large number of areas of work. 

Changes to Files not Immediately Applied on WordPress Blog

A few days ago I got a project to setup a WordPress blog on the client's website. Most of my work included editing and adding codes to re-design the look of the blog, so editing, saving and viewing is a normal process. But I found a issue of changes not updating on site immediately after I updated the files.

I have worked on WordPress many times, but this project required me to work in a different environment, by different environment I mean editing theme and other PHP files only through the WordPress interface and the Web Host was Yahoo which still provides a quite older version of WordPress for their customers.

As the primary job was designing the blog I had to edit and reload the blog page to see the changes on the live blog. Many times the changes didn't appear immediately on the blog, especially the header.php and other page template files.

While I was working on it, I didn't had much problem because of this issue but when the client tried checking the changes I made they complained about the blog not updating. I thought it was a problem with the web host but the actually cause of the problem turned out to be something else.

WP-Cache is what causing the problem

I didn't even think about it. I knew there were cache plugins for WordPress but my mind never focused on it. After exchanging messages with the client he sent me a link to a forum where the cause of the problem was mentioned and it was WP-Cache plugin.

Fixing it is easier than you may expect, just login to your WordPress Dashboard -> Settings -> WP-Cache

When you are in the settings page for WP-Cache plugin, click the "Disable it" button to disable the plugin.

Once you disable the plugin, any changes you make to your WordPress files will be immediately applied to the live site. That's a good idea when you are working on a re-design and you need to preview your changes again and again.

If it's not WP-cache..

If you don't have WP-cache plugin for your site then something else or other cache plugin is causing the problem. Look for other cache plugin for your WordPress blog, you will find all your plugins in the Plugins tab. If you find one then just disable it to solve the problem.

If it's not even a plugin then you might need more help with your blog's technical details, so it's a good idea to try WordPress Support Forum.