How to prevent Directory Listing using .htaccess

In webhosting, you generally find that files in the directory are listed by default. Sometime it is useful but it can also rise the security issue. You can easily disable or enable this feature using one line in .htaccess file.

Options +Indexes

This enables Directory listing.

Options –Indexes

This disables directory listing for your web site.
The .htaccess file gives more then simply enabling and disabling of a directory listing. With .htaccess file you can control which files to be ignored when creating a directory list.
For example:

IndexIgnore *.doc *.gif *.zip *.txt

Will make the apache server to skip all doc, gif, zip and txt files from the directory list.

IndexIgnore *

Will just create an empty directory list.
Blank index file can also be used for disabling the directory listing, but it is much tedious cause we need to put it in each and every folder. So using .htaccess is much handy for the purpose.


How to add Favicon in your WordPress site

Update: Favicon feature is available in WordPress core from version 4.3. Site Icon

What is a Favicon ?
A favicon is a small … 16px by 16px … image. Your favicon usually appears right before your web site name in the browser location bar, in browser tabs, in browser favorites, in RSS readers, and the like.

A favicon (short for favorites icon), also known as a website icon, shortcut icon, url icon, or bookmark icon is a 16×16,32×32 or 64×64 pixel square icon associated with a particular website or webpage.

Why do I want one?
Favicons can help identify your web site or blog across the Internet. These images become increasingly useful the more people use RSS readers and tabbed browsing. It offers the reader a visual reference allowing them to quickly identify your web site.
Step 1: Create Favicon
Your favicon image can be a .ico or .png. This can pose a little bit of a problem as some desktop image programs do not allow for the saving of images in the .ico format. If this is the case with your program, you can can save your image as a .GIF, .JPG, or .PNG and then use an online conversion program. You can create a 100 x 100 image, for example, and the conversion program will also shrink your image. I generally use Dynamic Drive conversion tool. ( Favicon Generator ) You can also find many different programs that allow you to create a favicon online.
Step 2: Upload you Favicon
Using your favorite FTP program or CPanel, upload your favicon to your WordPress theme’s main folder. For example, if your theme is ‘mytheme’ then …/wp-content/themes/mytheme/
Step 3: Link your Favicon
Now in your theme folder open header.php in your favorite editor and add following line in between <head>and </head>

<link rel="shortcut icon" href="<?php echo get_stylesheet_directory_uri(); ?>/favicon.ico" />
<link rel="shortcut icon" href="<?php echo get_stylesheet_directory_uri(); ?>/favicon.ico" />

How To Fade Out And Remove A Div After Certain Time in jQuery

Here’s a handy bit of code that I use often. Sometime you need to notify user about something and after some time it is needed to be removed. At such time, jQuery’s this snippet is sure shot work. Time after you have to remove is passed in milliseconds. For 1 second, you have to pass 1000. After that time, first fading out occurs followed by removing that from DOM.

 setTimeout(function() {
 }, 5000); 

In this example, the div with id div-to-remove, will be faded out and removed in 5 seconds.


7 things I wish I had known about jQuery

This article is mostly aimed at people who are just starting to learn jQuery. I assume you know the following:

  • Base knowledge of JavaScript
  • What jQuery is
  • How to include jQuery in a web page
  • Basic knowledge of how to use the $ function (for example: $(‘#test .testing’))
  • Basic understanding of the chainable events
  • Know what $(document).ready(function () { }); does (sometimes seen as $(function () {} ); or $().ready(function() {});)
  • Know intermediate HTML and CSS (lists, padding, colors, borders and margin)

If you don’t know anything about how to use jQuery you should read this. This is not meant to be an introduction to jQuery. This is meant for people who have tried jQuery and may have been frustrated because they weren’t sure how to do something correctly.

  1. Some background info
    • Objects and Methods

      Objects work so well because they act just like real life objects- objects have properties and methods. So if we were talking about a lamp, a property of it may be its height or width, say 12cm. A method of it may be to
      shine (an action). And when it’s shining, its brightness property would be of a greater value than when it wasn’t.

      – by Tim Scarfe

    • ChainabilityJavaScript is ‘chainable’. ‘Chainable’ means you can have multiple methods joined together.
  2. jQuery can Behave Somewhat like an Array: In JavaScript you access the first item in an array like this: ‘arrayVariable[0]‘. You find how many items are in an array using ‘arrayVariable.length’. You can do the same with jQuery. Each object that matches the specified selectors is an item in the array.
  3. jQuery in a Variable: You can store the results from a jQuery selection in a variable, and still access all the same methods. It is good practice to prepend the variable with ‘$’ to remember that you are, indeed, working with a jQuery object.
  4. Keep Animations from Building Up
  5. What the fuck does this ‘callback’ Mean: A callback is a function, or the name of a function that is run on the completion of the function you called. This is very, very useful on actions that take time to complete.
  6. Doing Something when any AJAX Starts and Ends: jQuery provides us with some built-in methods that allow us to run functions when any AJAX request starts and when any request completes. This makes life much easier overall
  7. Doing Something Once the Images are Loaded: Usually you don’t need to wait until the images are loaded to run you jQuery, but if you are manipulating images, then you need to wait until the images load, otherwise jQuery will (correctly) think that the width and height of the image is 0px by 0px. This is useful when you want to have jQuery automatically limit the size of image to fit the content.

Learn more about jQuery