Original post published Automatically copy images (png, jpeg, gif) from remote server (http) to your local server using PHP">here

So, have you ever found the necessity to copy remote images to your local server using http URLs? This is pretty easy using PHP and PHP GD. If you have both of them installed (in most of the servers they come installed) then you can do that in no time. But then comes the security issue. Copying anything from remote server to your local server can expose your server to many vulnerabilities. Just like, recently our site got hacked due to TimThumb vulnerability. So, we decided to put together a working code which you can use on your projects to copy any valid images from remote to local server. The copying process is pretty much automatic given our code. We have wrapped them in a function and it is available for you to download as well. We shall now discuss the working of the method. But before that:

#1: Understanding the concept:

While creating such automated script, we should think of a few things. Or in other words, while creating the function, we should think of the parameters first.

• $img_url: The URL of the image. We should accept URLs starting with http:// or https:// and ending with .png, .jpg, .jpeg or .gif. Others should be rejected.
• $store_dir: The directory where we should store the images.
• $store_dir_type: Should specify whether the directory path is relative to the script or is absolute.
• $overwrite: In case of duplicate file name, should it overwrite?
• $pref: Internally used for dynamic renaming of duplicate files using tail recursion  (a function, directly returns the same function call with some different arguments).
• $debug: A little bit of debug information is always fun, and well, informative.

So, keeping these things, we write in the skeleton of our function.

/**
 * Fetch JPEG or PNG or GIF Image
 *
 * A custom function in PHP which lets you fetch jpeg or png images from remote server to your local server
 * Can also prevent duplicate by appending an increasing _xxxx to the filename. You can also overwrite it.
 *
 * Also gives a debug mode to check where the problem is, if this is not working for you.
 *
 * @author Swashata <swashata ~[at]~ intechgrity ~[dot]~ com>
 * @copyright Do what ever you wish - I like GPL   (& love tux  )
 * @link http://www.intechgrity.com/?p=808
 *
 * @param string $img_url The URL of the image. Should start with http or https followed by :// and end with .png or .jpeg or .jpg or .gif. Else it will not pass the validation
 * @param string $store_dir The directory where you would like to store the images.
 * @param string $store_dir_type The path type of the directory. 'relative' for the location in relation with the executing script location or 'absolute'
 * @param bool $overwrite Set to true to overwrite, false to create a new image with different name
 * @param bool|int $pref internally used to prefix the extension in case of duplicate file name. Used by the trailing recursion call
 * @param bool $debug Set to true for enable debugging and print some useful messages.
 * @return string the location of the image (either relative with the current script or abosule depending on $store_dir_type)
 */
function itg_fetch_image($img_url, $store_dir = 'image', $store_dir_type = 'relative', $overwrite = false, $pref = false, $debug = false) {
    //code
}

#2: Verifying the image URL:

This should be done before anything else. What we do is:

• Check if the URL begins with http:// or https://. Reject otherwise.
• Check if the URL ends with a valid extension (.gif, .jpeg, .jpg, .png). Reject otherwise.

We shall use PHP’s built in preg_match to search using our regular expression. The code snippet for validating the image URL is this:

    if(preg_match('/https?:\/\/.*\.png$/i', $img_url)) {
        $img_type = 'png';
    }
    else if(preg_match('/https?:\/\/.*\.(jpg|jpeg)$/i', $img_url)) {
        $img_type = 'jpg';
    }
    else if(preg_match('/https?:\/\/.*\.gif$/i', $img_url)) {
        $img_type = 'gif';
    }
    else {
        if(true == $debug)
            echo 'Invalid image URL';
        return ''; //possible error on the image URL
    }

#3: Handling duplicate files:

As mentioned before, we should handle duplicate files properly. The strategy is:

• Somehow use smart renaming by appending _xxx (xxx is a counter) after the image name and before the extension. We shall increase the counter unless a valid non-existing filename is found.
• Or, delete the old file altogether if overwriting is set to true.

And here is the code snippet which does the trick:

    //first get the base name of the image
    $i_name = explode('.', basename($img_url));
    $i_name = $i_name[0];

    $dir_name = (($store_dir_type == 'relative')? './' : '') . rtrim($store_dir, '/') . '/';

    //create the directory if not present
    if(!file_exists($dir_name))
        mkdir($dir_name, 0777, true);

    //calculate the destination image path
    $i_dest = $dir_name . $i_name . (($pref === false)? '' : '_' . $pref) . '.' . $img_type;

    //lets see if the path exists already
    if(file_exists($i_dest)) {
        $pref = (int) $pref;

        //modify the file name, do not overwrite
        if(false == $overwrite)
            return itg_fetch_image($img_url, $store_dir, $store_dir_type, $overwrite, ++$pref, $debug);
        //delete & overwrite
        else
            unlink ($i_dest);
    }

Note that it intelligently uses tail recursion for smart renaming. It simply returns the same function by incrementing the value of $pref variable by 1.

#4: Fetching the image from the server:

Now comes the real thing. We will now see how we can fetch the image from the remove server using some built in PHP GD functions. Note that for all these to work, you will need fopen wrapper enabled, which is enabled in most of the servers. If not, then you can edit your php.ini file and set it to true. Check here for more information. So, here is the code snippet which does the magic:

    //first check if the image is fetchable
    $img_info = @getimagesize($img_url);

    //is it a valid image?
    if(false == $img_info || !isset($img_info[2]) || !($img_info[2] == IMAGETYPE_JPEG || $img_info[2] == IMAGETYPE_PNG || $img_info[2] == IMAGETYPE_JPEG2000 || $img_info[2] == IMAGETYPE_GIF)) {
        if(true == $debug)
            echo 'The image doesn\'t seem to exist in the remote server';
        return ''; //return empty string
    }

    //now try to create the image
    if($img_type == 'jpg') {
        $m_img = @imagecreatefromjpeg($img_url);
    } else if($img_type == 'png') {
        $m_img = @imagecreatefrompng($img_url);
        @imagealphablending($m_img, false);
        @imagesavealpha($m_img, true);
    } else if($img_type == 'gif') {
        $m_img = @imagecreatefromgif($img_url);
    } else {
        $m_img = FALSE;
    }

    //was the attempt successful?
    if(FALSE === $m_img) {
        if(true == $debug)
            echo 'Can not create image from the URL';
        return '';
    }

#5: Saving the image locally on disk:

Now finally we would save the image locally on our disk. The snippet is:

    //now attempt to save the file on local server
    if($img_type == 'jpg') {
        if(imagejpeg($m_img, $i_dest, 100))
            return $i_dest;
        else
            return '';
    } else if($img_type == 'png') {
        if(imagepng($m_img, $i_dest, 0))
            return $i_dest;
        else
            return '';
    } else if($img_type == 'gif') {
        if(imagegif($m_img, $i_dest))
            return $i_dest;
        else
            return '';
    }

Note that you can edit the third variable of imagejpeg and imagepng to set the quality. More information can be found here or here.

#6: The complete code:

So putting together everything, here is the complete code:

/**
 * Fetch JPEG or PNG or GIF Image
 *
 * A custom function in PHP which lets you fetch jpeg or png images from remote server to your local server
 * Can also prevent duplicate by appending an increasing _xxxx to the filename. You can also overwrite it.
 *
 * Also gives a debug mode to check where the problem is, if this is not working for you.
 *
 * @author Swashata <swashata ~[at]~ intechgrity ~[dot]~ com>
 * @copyright Do what ever you wish - I like GPL   (& love tux  )
 * @link http://www.intechgrity.com/?p=808
 *
 * @param string $img_url The URL of the image. Should start with http or https followed by :// and end with .png or .jpeg or .jpg or .gif. Else it will not pass the validation
 * @param string $store_dir The directory where you would like to store the images.
 * @param string $store_dir_type The path type of the directory. 'relative' for the location in relation with the executing script location or 'absolute'
 * @param bool $overwrite Set to true to overwrite, false to create a new image with different name
 * @param bool|int $pref internally used to prefix the extension in case of duplicate file name. Used by the trailing recursion call
 * @param bool $debug Set to true for enable debugging and print some useful messages.
 * @return string the location of the image (either relative with the current script or abosule depending on $store_dir_type)
 */
function itg_fetch_image($img_url, $store_dir = 'image', $store_dir_type = 'relative', $overwrite = false, $pref = false, $debug = false) {
    //first get the base name of the image
    $i_name = explode('.', basename($img_url));
    $i_name = $i_name[0];

    //now try to guess the image type from the given url
    //it should end with a valid extension...
    //good for security too
    if(preg_match('/https?:\/\/.*\.png$/i', $img_url)) {
        $img_type = 'png';
    }
    else if(preg_match('/https?:\/\/.*\.(jpg|jpeg)$/i', $img_url)) {
        $img_type = 'jpg';
    }
    else if(preg_match('/https?:\/\/.*\.gif$/i', $img_url)) {
        $img_type = 'gif';
    }
    else {
        if(true == $debug)
            echo 'Invalid image URL';
        return ''; //possible error on the image URL
    }

    $dir_name = (($store_dir_type == 'relative')? './' : '') . rtrim($store_dir, '/') . '/';

    //create the directory if not present
    if(!file_exists($dir_name))
        mkdir($dir_name, 0777, true);

    //calculate the destination image path
    $i_dest = $dir_name . $i_name . (($pref === false)? '' : '_' . $pref) . '.' . $img_type;

    //lets see if the path exists already
    if(file_exists($i_dest)) {
        $pref = (int) $pref;

        //modify the file name, do not overwrite
        if(false == $overwrite)
            return itg_fetch_image($img_url, $store_dir, $store_dir_type, $overwrite, ++$pref, $debug);
        //delete & overwrite
        else
            unlink ($i_dest);
    }

    //first check if the image is fetchable
    $img_info = @getimagesize($img_url);

    //is it a valid image?
    if(false == $img_info || !isset($img_info[2]) || !($img_info[2] == IMAGETYPE_JPEG || $img_info[2] == IMAGETYPE_PNG || $img_info[2] == IMAGETYPE_JPEG2000 || $img_info[2] == IMAGETYPE_GIF)) {
        if(true == $debug)
            echo 'The image doesn\'t seem to exist in the remote server';
        return ''; //return empty string
    }

    //now try to create the image
    if($img_type == 'jpg') {
        $m_img = @imagecreatefromjpeg($img_url);
    } else if($img_type == 'png') {
        $m_img = @imagecreatefrompng($img_url);
        @imagealphablending($m_img, false);
        @imagesavealpha($m_img, true);
    } else if($img_type == 'gif') {
        $m_img = @imagecreatefromgif($img_url);
    } else {
        $m_img = FALSE;
    }

    //was the attempt successful?
    if(FALSE === $m_img) {
        if(true == $debug)
            echo 'Can not create image from the URL';
        return '';
    }

    //now attempt to save the file on local server
    if($img_type == 'jpg') {
        if(imagejpeg($m_img, $i_dest, 100))
            return $i_dest;
        else
            return '';
    } else if($img_type == 'png') {
        if(imagepng($m_img, $i_dest, 0))
            return $i_dest;
        else
            return '';
    } else if($img_type == 'gif') {
        if(imagegif($m_img, $i_dest))
            return $i_dest;
        else
            return '';
    }

    return '';
}

//a quick test? just uncomment the line below
//echo itg_fetch_image('http://tuxpaint.org/stamps/stamps/animals/birds/cartoon/tux.png');

You can call it as mentioned there in the comments. Play with the parameters and see what you can do. You can integrate it with PHP POST and GET operations on your live project. Do check our tutorial on PHP POST and GET for a better understanding. Also, the function returns the path of the stored image. You can change this behaviour if you like by simply altering the return statement. The usage is completely upto you.

So, that was all. If you have any question or need any help with it, then do drop in a comment. I will try my best to give you the support you want.

No related posts.

- By InTechgrity - Amalgamating Life & Technology

Original post published Add home & other items directly in WP Nav Menu using wp_nav_menu_items filters">here

So, this is going to be the last of the WordPress Nav Menu series. Previously, we have talked about the basics of WordPress custom navigation menu and dealing the empty nav menus with custom fallbacks. In this post, we shall see how we can directly add some links to the nav menu using filters. This would become useful, if you want to customize the user’s own navigation menus. We shall see, how we can add the home button and also the dynamic login/logout button through user defined custom navigation menus using WordPress Filters.

#1: Understanding the concept:

The filter we will be using is wp_nav_menu_items. It lets the function get two arguments. One is $items, which is the HTML of all the items in the navigation. Other is the $args, which holds the information of the nav itself. We shall use the $args variable to identify our target navigation menu and then will add our links.

#2: Adding the Navigation menu:

First we hook our two navigation menus, primary & footer as follows:

/**
 * Register our nav menus
 * @see http://codex.wordpress.org/Function_Reference/register_nav_menus
 */
function my_theme_nav_bars() {
    register_nav_menus(array(
        'primary' => 'Primary Menu',
        'footer' => 'Footer Menu',
    ));
}
add_action('init', 'my_theme_nav_bars');

#3: Add filters to customize:

Now, we customize the navigation menus using filters like this:

/**
 * Filter the navigation menus and add customized links
 *
 * We are usign wp_nav_menu_items filter to do this.
 * Also, $args is used to identify the location of the nav menu
 * and change it accordingly.
 *
 * @param string $items The HTML of the generated items
 * @param array $args The information of the navigation
 * @return string
 */
function filter_my_theme_nav_bars($items, $args) {
    if($args->theme_location == 'primary') {
        $homelink = '<li class="home' . ((is_home() || is_front_page())? ' current_page_item' : '') . '"><a href="' . get_bloginfo('url') . '">' . __('Home') . '</a></li>';
        $items = $homelink . $items;
    }

    if($args->theme_location == 'footer') {
        $dlink = '<li class="login">' . wp_loginout('', false) . '</li>' . wp_register('<li class="admin">', '</li>', false);
        $items .= $dlink;
    }

    return $items;
}
add_filter('wp_nav_menu_items', 'filter_my_theme_nav_bars', 10, 2);

The code is quite self explanatory. It adds a nice Home button to the primary nav and nice login/logout button to the footer navigation. We use the wp_nav_menu_items to hook to the filter. The argument 10 represents the priority, which is the default and 2 represent the number of arguments which should be two ($items & $args).

Now, for the sake of completeness, let us see how we can do even more.

#3.1: Add a search bar to the navigation:

function add_search_through_filter($items, $args) {
    if($args->theme_location == 'primary') {
        $searchlink = '<li class="search">' . get_search_form(false) . '</li>';
        $items .= $searchlink;
    }
    return $items;
}
add_filter('wp_nav_menu_items', 'add_search_through_filter', 10, 2);

#3.2: Add feed link to the navigation:

function add_rss_link_through_filter($items, $args) {
    if($args->theme_location == 'primary') {
        $rsslink = '<li class="rss"><a href="' . get_bloginfo('rss2_url') . '">RSS</a></li>';
        $items .= $rsslink;
    }
    return $items;
}
add_filter('wp_nav_menu_items', 'add_rss_link_through_filter', 10, 2);

#3.3: Show some text:

function add_custom_text_through_filter($items, $args) {
    if($args->theme_location == 'footer') {
        $clink = '<li class="copyright">&copy; Copyright ' . get_bloginfo('name') . ' ~ 2010-' . date('Y') . '</li>';
        $items .= $clink;
    }
    return $items;
}
add_filter('wp_nav_menu_items', 'add_custom_text_through_filter', 10, 2);

So, that was all. I hope you found this interesting. If you have any doubt then feel free to ask.

Related posts:

1. Programmer’s guide for WordPress Nav menu
2. The right way of dealing wp_nav_menu fallback function – List custom categories & pages
3. jQuery Vertical Sidebar Navigation menu for your Blog or Website – Free package by iTg
4. Download Web Videos directly from your Firefox using Video DownloadHelper
5. Add dynamic Login Logout n Site Admin button to WordPress using WP API

- By InTechgrity - Amalgamating Life & Technology

Original post published The right way of dealing wp_nav_menu fallback function – List custom categories & pages">here

So, this post succeeds our explanation on WordPress custom Nav menus. We’ve seen previously how we can use wp_nav_menu function to show user defined menus in the theme. But what if the user doesn’t provide any menu to the theme location? WordPress will then use the fallback function to write a default menu. wp_page_menu is used by default which just prints all the pages of your blog. In many situations, especially while developing themes, you might not want this to happen. You might want to give the user more refined way to control the output of the default navigation menu. You might want to display specific pages along with specific categories. You might also want to include the Home button and our famous dynamic login/logout button to the navigation. In such cases, you will need to write your own fallback function from scratch. Today we shall see, the right way of writing the fallback with various customization option. We shall also add Home button to it, give it proper class, list the pages we want (hierarchically) along with hierarchical categories.

#1: Registering the Nav menu:

As usual, we register our primary nav menu like this:

/**
 * The function which registers the primary nav menu
 * @uses register_nav_menus
 * @see http://codex.wordpress.org/Function_Reference/register_nav_menus
 */
function reg_primary_nav() {
    register_nav_menus(array(
        'primary' => 'Primary Menu',
    ));
}
//hook it to init
add_action('init', 'reg_primary_nav');

#2: Calling the API with custom fallback:

In order to do that, we need to discuss the arguments of wp_nav_menu. The one we will be using is fallback_cb which corresponds to the name of the fallback function. Keeping other arguments default we call it like this:

/**
 * Call the wp_nav_menu API to print the navigation menu
 * We will use a custom fallback function primary_menu_fallback
 * passed in as an argument
 *
 * @see http://codex.wordpress.org/Function_Reference/wp_nav_menu
 */
wp_nav_menu(array(
    'theme_location' => 'primary', //corresponds to the location as on register_nav_menus
    'container_class' => 'primary-nav', //custom class for styling purposes
    'fallback_cb' => 'primary_menu_fallback',
));

What next? Yes, you have guessed it right. We will be writing our primary_menu_fallback function which we have passed to the wp_nav_menu as an argument.

#3: Writing the fallback function:

We write in our fallback function keeping in mind 4 things:

1. Add Home button with custom class (current on home page) for styling.
2. Add the pages we want in specific number of tiers.
3. Add the categories we want in specific number of tiers.
4. Add our dynamic login/logout button.

<?php
/**
 * The fallback function for the primary nav menu
 *
 * It is capable of doing 4 custom navigation
 * 1. Home button
 * 2. List the pages you want
 * 3. List the categories you want
 * 4. Add dynamic login/logout & site admin button
 *
 * Check the inline comments for understanding how it works
 */
function primary_menu_fallback() {
    ?>
<div id="primary" class="primary-nav">
    <ul class="menu">
        <?php /* add home button */ ?>
        <li class="home <?php if(is_home() || is_front_page()) echo 'current_page_item'; ?>"><a href="<?php bloginfo('url'); ?>">Home</a></li>
        <?php
        /**
         * Show the pages we want
         * We shall be using wp_list_pages
         * For a list of arguments
         * @see http://codex.wordpress.org/Function_Reference/wp_list_pages
         */
        wp_list_pages(array(
            'depth' => 2, //number of tiers, 0 for unlimited
            'exclude' => '', //comma seperated IDs of pages you want to exclude
            'title_li' => '', //must override it to empty string so that it does not break our nav
            'sort_column' => 'post_title', //see documentation for other possibilites
            'sort_order' => 'ASC', //ASCending or DESCending
        ));
        ?>
        <?php
        /**
         * Show the categories we want
         * We shall be using wp_list_categories
         * For a list of arguments
         * @see http://codex.wordpress.org/Template_Tags/wp_list_categories
         */
        wp_list_categories(array(
            'orderby' => 'name', //see documentation for more sorting possibilites
            'order' => 'ASC', //ASCending or DESCending
            'exclude' => '', //comma seperated IDs of categories you want to exclude
            'title_li' => '', //must override it to empty string so that it does not break our nav
            'depth' => 2, //number of tiers, 0 for unlimited
            'hide_empty' => 1, //hides empty categories if 1, pass 0 to show
        ));
        ?>
        <?php
        /**
         * Add our dynamic login/logout & Site Admin buttons
         * @see http://www.intechgrity.com/add-dynamic-login-logout-n-site-admin-button-to-wordpress-using-wp-api/
         */
        ?>
        <li class="login"><?php wp_loginout(); ?></li>
        <?php wp_register('<li class="admin">'); ?>
    </ul>
</div>
    <?php
}

So now the wp_nav_menu will first try to output user’s own menu if provided, else will fallback to your own function. This is the most sophisticated way of handling the fallback. In our next chapter, we shall see how we can directly hook into wp_nav_menu to even customize the user’s own menu dynamically. Till then, have fun with the fallback. Be creative and show us what fallback are you falling for?

No related posts.

- By InTechgrity - Amalgamating Life & Technology

Original post published Programmer’s guide for WordPress Nav menu">here

This post is basically a prelim to our upcoming post on programmatically customizing the behaviour and output of WordPress 3 Nav menus. Of course, before we actually customize it, we need to know what it is and how the Nav Menu API works. Consider it as a quick start guide on WordPress Nav menu. So, enough of introduction, let’s get to the business.

#1: WP Nav menu from front end:

From frontend, WordPress Nav menu is a beautiful system for creating custom hierarchical horizontal and/or vertical nav menus.  Now a days, all the themes have WP Nav menu enabled by default. So, simply go to the Appearance > Menus and start creating your menus from there. It is a nice work of UI designing I must say. You simply add in items, drag and position them, move one item under another and bingo. After that, all you need to do is set the menu for some predefined nav area and you are done. If your theme supports it, it should style up automatically giving you the finest control of your navigation bar.

#2: WP Nav API from the backend:

Now comes the real part. We have been saying, “if your theme supports…this….”, “if your theme supports….that….”, let us see how do we support this from the backend (the code of the theme).

#2.1: Understanding the API:

The API for registering nav menu is, indeed, register_nav_menus, and the format is:

register_nav_menus(array(
    'nav_menu_key' => 'Nav Menu Nice Name',
    'nav_menu_key2' => 'Nav Menu Nice Name 2',
));

Of course, you can add as many instances of nav menu you wish through the array. Basically each of the items will provide a unique entry under the Theme Location of Appearance > Menu.

The call of the function must be made during the init. So, in practice, we shall hook the call using the add_action API to the init.

function my_theme_register_menu() {
    register_nav_menus(array(
        'nav_menu_key' => 'Nav Menu Nice Name',
        'nav_menu_key2' => 'Nav Menu Nice Name 2',
    ));
}
add_action('init', 'my_theme_register_menu');

So, the following code will add the following three sections to the admin area.

function my_theme_three_navs() {
    register_nav_menus(array(
        'primary' => 'Primary Menu',
        'top' => 'Top Nav Menu',
        'bottom' => 'Footer Nav Menu',
    ));
}
add_action('init', 'my_theme_three_navs');

#2.2: Printing the Nav menu in the theme:

So, you’ve added the navigation menu to the admin frontend, your theme user has made some nice navigation menu and added it to the theme section as you have provided. Now, it is time to get that nav menu and show it in the theme frontend. For that we will be using wp_nav_menu API. You can read more about it here or in our upcoming post on WP Nav Menu customization. Till then, we will just focus on printing the default nav_menu with default fallback. The parameter theme_location must be the key of your Nav menu you have set using register_nav_menus.

wp_nav_menu(array(
    'theme_location' => 'nav_menu_key',
    'container_class' => 'my-nav'
));

Calling it in files like header.php would produce HTML similar to this:

<div id="nav_menu_key" class="my-nav">
    <ul class="menu">
        <li class="home current_page_item"><a href="http://localhost/wp">Home</a></li>
        <li class="page_item page-item-2"><a href="http://localhost/wp/sample-page/">Sample Page</a></li>
    </ul>
</div>

So, style up using your favorite CSS editor (I prefer NetBeans of course) and make a good nav menu for this HTML markup. You can check our vertical dropdown menu and use it as a startup. So, that is all for today. Tomorrow, we shall see how we can extend the features of the WordPress Nav menu.

Related posts:

1. Add home & other items directly in WP Nav Menu using wp_nav_menu_items filters
2. Parse ID list from CSV, using new WordPress 3.0 API – The right way of doing
3. The right way of dealing wp_nav_menu fallback function – List custom categories & pages
4. Setting Post Thumbnail on WordPress with custom size and Cropping – A simpler approach
5. How to add your own stylesheet to your WordPress plugin settings page or All Admin page

- By InTechgrity - Amalgamating Life & Technology

Original post published Catch the first image on WordPress post and use as thumbnail">here

So this the last (perhaps) continuation of the posts getting the source URL of the featured image and using TimThumb with WordPress MultiSite. As the title says, today we are going to discuss how to automatically fetch the URL of the first image for any WordPress posts or pages and then we shall also see how to pass it to timthumb etc for creating thumbnails. This becomes useful, when your theme/plugin users are not using the featured image thingy of WordPress. In that scenario, what we can do is, search the post content for the any instance of image and return the first found image SRC. In case no images were found, we can also return some default image if necessary. So, let us see what we can do.

#1: Understanding the concept:

The concept remains the same as our previous post on getting the image SRC of featured image.

• We search the post content using preg_match.
• If any instance is found we return the src.
• Else we return false or optionally return the default image URL

#2: The code behind:

/**
 * Auto Generate Thumbnail URL from the post content
 *
 * First checks if the featured image is present on the post/page or not
 * If yes, then it returns the featured image URL (Source URL)
 * else, it manually searches the content and returns the URL of the first image found
 *
 * If no image is found then it returns the $default variable which is set to false by default
 *
 * @uses itg_get_the_post_thumbnail_url
 * @param int $id Use null if within the loop or give some ID
 * @param string $size The size of the thumbnail, 'post-thumbnail' by default
 * @param bool|string $default The default URL of not-found image or boolean false which will be returned
 * @param string $type The type of the entry. Can be 'post' or 'page'
 * @return mixed bool|string The URL of the featured image or first found image on success, false or default image (as passed by the $default parameter) URL on failure
 */
function itg_auto_gen_thumbnail($id = null, $size = 'post-thumbnail', $default = false, $type = 'post') {
    /**
     * try to get the featured image URL
     * @see http://www.intechgrity.com/how-to-get-the-souce-url-of-the-featured-image-in-wordpress/
     */
    $image_src = itg_get_the_post_thumbnail_url($id, $size);
    if($image_src != '') {
        //on success return the featured image
        return $image_src;
    } else {
        //try to get the first image
        if($id == null) {
            //called within the loop
            $content = get_the_content();
        } else {
            //get the post content
            $p_data = ($type == 'post')? get_post($id) : get_page($id);
            $content = $p_data->post_content;
            unset($p_data);
        }
        //the match pattern
        $src_pattern = '/<img.+src=[\'"]([^\'"]+)[\'"].*>/i';
        //store $default to $src for returning
        $src = $default;
        $matches = array();

        //match it
        if(preg_match($src_pattern, $content, $matches)) {
            //found, so replace the $src value
            $src = trim($matches[1]);
        }

        return $src;
    }
}

So it is pretty much straight forward. It tries to get the featured image first. If not found then, it searches the content for an image. You call it like this:

//within loop
echo itg_auto_gen_thumbnail();

//within loop for different size
$my_image = itg_auto_gen_thumbnail(null, 'full');

//outside loop for a page
$my_image = itg_auto_gen_thumbnail(10, 'full', false, 'page');

//set default image SRC to return
$my_image = itg_auto_gen_thumbnail(null, 'full', 'http://locati.on/to/image.png');

As you can see, it uses the itg_get_the_post_thumbnail_url function internally. Have a look at here for more information. You can even pass the return image to TimThumb using our TimThumb compatibility function for dynamic resizing.

That will be all. Hope it helps you out for your code. If you have any question, then do ask.

Related posts:

1. How to get the souce URL of the featured image in WordPress
2. Setting Post Thumbnail on WordPress with custom size and Cropping – A simpler approach
3. Getting Post thumbnail on WordPress 3 w/ w/o specific Post ID
4. WordPress Multisite compatibility for timthumb
5. Get post count of a category including sub-categories in WordPress

- By InTechgrity - Amalgamating Life & Technology

Original post published WordPress Multisite compatibility for timthumb">here

Ever found the necessity to use TimThumb for your WordPress theme and/or plugin? Then you should’ve faced the problem where you can not tell TimThumb about the correct location of image files in WordPress Multi-Site setup and in return TimThumb gave you internal image not found error. The tutorial over binarymoon is a bit backdated as it uses custom fields to get and set the image with TimThumb. The obvious question which arises is, how to use the WordPress’ own featured image with TimThumb to give it maximum resizing capability. Previously, we have discussed about how to get the image src from the featured image HTML and use it for other purposes like CSS etc. Now, we shall see, how to use the original image source and modify it so that it works with TimThumb (for WP MS ofcourse).

#1: Understanding the concept:

What WordPress does is, it gives some nicer URL to the static files in case of MultiSite setup. In general setup (without networking), the file URL is like this

http://yoursite.com/wp-content/uploads/2012/05/image.jpg

Which is just the absolute URL of the file.

But, for WordPress it becomes like this

http://sub.yoursite.com/files/2012/05/image.jpg

Which is obviously not the absolute static URL of the file. WordPress internally modifies the path via some htaccess rewrite to push the original content at this URL.

The main reason why TimThumb doesn’t work is, because, there is no real directory files anywhere on the root of your site. So, we have to either rewrite the URL before passing it to TimThumb or we have to somehow tell TimThumb about this issue. The second solution is not feasible as it involves editing the core of the script, which means, you have to do it again after any update. So, we shall use the first technique within our themes or plugins to make it WP MS compatible. Also, we shall explicitly check the image URL for the presence of /files/ (uploaded media) and /wp-content/ (theme or plugin files) and will treat them properly.

#2: The code behind the compatibility:

/**
 * TimThumb Image
 *
 * **Properly** appends the source image URL to timthumb for WP MS compatibility
 * Explicitly check the presence of /files/ and /wp-content/ in the URI and treats accordingly.
 * Has compatibility for both uploaded media as well as theme/plugin media files.
 *
 * You can also set height and width using the parameters
 *
 * @author Swashata
 * @param String $src The URL of the original image 'http://path/to/image.jpg
 * @param Int $h The height of the image
 * @param Int $w The width of the image
 * @return String The modified timthumb URL of the image
 */
function itg_timthumb_image($src, $h = 50, $w = 50) {
    //set your timthumb url
    $timthumb_url = get_bloginfo('wpurl') . '/path/to/timthumb.php';
    //check for multisite
    if(is_multisite()) {
        //get rid of the www part from the HTTP_HOST
        $host = preg_replace('/^www\./i', '', $_SERVER['HTTP_HOST']);
        if(preg_match('/https?:\/\/(?:www\.)?' . $host . '/i', $src)) { //check if internal
            //is it a request for directory wp-content?
            if(preg_match('/\/wp-content\//', $src)) {
                $src_parts = explode('/wp-content/', $src);
                $src = '/wp-content/' . $src_parts[1];
            }
            //is it a request for /files/ virtual directory
            else if(preg_match('/\/files\//', $src)) {
                $src_parts = explode('/files/', $src);
                $src = '/blogs.dir/' . get_current_blog_id() . '/files/' . $src_parts[1];
            }
        }
    }
    return $timthumb_url . '?src=' . urlencode($src) . '&h=' . $h . '&w=' . $w . '&zc=1';
}

And finally you call the function to do what you want. Note that you do need to pass the raw image URL as the $src variable. If you wish to TimThumb your featured images, then use the function used here and call the above function like this:

//get 200 X 200 thumbnail for the current post featured image
itg_timthumb_image(itg_get_the_post_thumbnail_url(), 200, 200);

So that was the most complete and simple solution I could think of while making my WordPress things compatible with MultiSite and TimThumb. If you know any better technique or have any problem using this, then do let us know.

No related posts.

- By InTechgrity - Amalgamating Life & Technology

Original post published How to get the souce URL of the featured image in WordPress">here

Previously we have talked about setting and getting featured images in WordPress using built in APIs. But, one of the drawback of this method is, it returns or prints the image with proper HTML. In other words, it does not give you the URL of the image. It becomes necessary if you want to

• Pass the URL to scripts like say TimThumb for dynamic resizing.
• Use the URL for inline css styling
• and others…

So, in this tutorial we will learn how to do that by passing the fetched image HTML to our custom function.

#1: Understanding the concept:

#1.1: The output HTML of the API:

When we use get_the_post_thumbnail, then it returns a nice HTML code which looks like this…

    <img width="50" height="50" title="3d_pie_chart_icon_psd_by_psdblast-d4jqqn4" alt="3d_pie_chart_icon_psd_by_psdblast-d4jqqn4" src="http://localhost/wp/wp-content/uploads/2012/05/img.jpg" />

#1.2: What we need to do:

So, somehow we need to extract the src attribute from the HTML img tag. Now, there are a number of ways for doing this. I will discuss the fastest and simplest preg_match method, where you have to pass the output string and will get the src attribute.

#2: Using preg_match to get the source URL

From the output HTML we see that

1. The image tag starts with <img.
2. There can be almost anything or nothing before the src keyword.
3. Inside the src the URL of the image is written in between two double quote. It can contain anything except double quotes.
4. After src there can be again anything or nothing.

So, keeping in these strategies in mind, we make our regular expression to work with preg_match.

$src_pattern = '/<img.+src=[\'"]([^\'"]+)[\'"].*>/i';

Now we use the preg_match like this:

$src = '';
$matches = array();
if(preg_match($src_pattern, $text, $matches)) {
    $src = $matches[1];
}

Where the $text variable should hold the HTML returned by the get_the_post_thumbnail function. So, we put together all the code and come up with something like this

/**
 * Get the post thumbnail URL
 *
 * Automatically gets and returns the source URL of the full-sized featured image
 * of the current post in the loop.
 *
 * You can also change the parameters below for more flexibility
 *
 * @param int $id The id of the post. If null, then it will fetch the current post thumbnail.
 * @param String $size The registered image size name. Default is full, which gives the full-size image url. You set it to post-thumbnail or anything else.
 * @return String The URL of the featured image of the queried size.
 */
function itg_get_the_post_thumbnail_url($id = null, $size = 'full') {
    //if no post thumbnail is set, return empty string
    if(!has_post_thumbnail($id))
        return '';

    //get the post thumbnail
    $text = get_the_post_thumbnail($id, $size);

    //initialize the variables
    $src = '';
    $matches = array();

    //set the match string
    $src_pattern = '/<img.+src=[\'"]([^\'"]+)[\'"].*>/i';

    //match it
    if(preg_match($src_pattern, $text, $matches)) {
        $src = $matches[1];
    }

    return trim($src);
}

What the function does is it automatically gets the featured image of the current post in the loop and returns its full sized image URL. But it has some flexibility as well. As the comments say, the available parameters are:

• $id – Integer – The id of the post. If null, then it will fetch the current post thumbnail.
• $size – String - The registered image size name. Default is full, which gives the full-size image url. You set it to post-thumbnail or anything else.
• return - String – The URL of the featured image of the queried size.

So when ever you need to get the image url, you call it like this:

//get full sized, current post
$img_src = itg_get_the_post_thumbnail_url();

//get thumbnail sized, custom post
//replace with your post ID
$img_src = itg_get_the_post_thumbnail_url(10, 'post-thumbnail');

//get thumbnail sized, current post
$img_src = itg_get_the_post_thumbnail_url(null, 'post-thumbnail');

//get full sized, custom post
$img_src = itg_get_the_post_thumbnail_url(10);

You are free to use this code anywhere you like. It should do what you want. If there is anything else you want to know, then just comment.

No related posts.

- By InTechgrity - Amalgamating Life & Technology

Original post published 10 free minimalist grey scale icon sets for your web design">here

Previously, we had discussed about websites providing FREE icons and background patterns. Today we are going to give you some modern minimalist icon sets made on grey scale. The awesome thing about grey scale icons are, they blend with almost any design. So, we searched over the Internet and finally ended up with 10 most beautiful icon packs. Most of them are free for both commercial as well as personal, and only requires an attribution. But do check the licenses yourself before using it on any commercial projects. So, here we go with the list:

Big Sized Icons with Included PSD

#1: Retina Display Icon Set

Sizes: 64×64, 48×48, 24×24 (PSD included) Total Icons: 147 Download: Click here

#2: WPZOOM Developer Icon Set

Sizes: 48×48 (PSD included) Total Icons: 154 Download: Click here

#3: Mnml Icon Set

Sizes: 128×128 Total Icons: 32 Download: Click here

#4: Free Vector Icons

Sizes: Vectors (PSD included) Total Icons: 30 Download: Click here

#5: Iconic Icon Set

Sizes: Vectors (PSD, SVG included) Total Icons: 171 Download: Click here

Small Sized UI type icon:

#6: Minicons Icon Set

Sizes: Vectors (PSD included) Total Icons: 100+ Download: Click here

#7: Wireframe Toolbar Icons

Sizes: 16×16, 24×24, 32×32, 48×48 Total Icons: 147 Download: Click here

#8: Dusseldorf Icon Set

Sizes: 16×16, 32×32, 48×48 Total Icons: 100+ Download: Click here

#9: Glyphish Icon Set

Sizes: 28×28 (PSD included) Total Icons: 100+ Download: Click here

#10: Glyphicons Icon Set

Sizes: 24×24 Total Icons: 400 Download: Click here

So that was all. If you are aware of something better, or wish to see your own icon sets in this list, do drop a comment.

Related posts:

1. 15+ Free Web-Icons & Background Patterns/Texture download sites to boost your Blog & Website designing
2. Huge collection of CSS, JS & jQuery Dropdown Navigation menus for FREE | Use on your Web site or Blog
3. Create Ajax style Loading Animated Gif images easily with 3 Free Online Generators

- By InTechgrity - Amalgamating Life & Technology

Original post published Howto: Choose the right web hosting company for your business">here

We have discussed a lot about web hosting and domains previously. One of the most important thing to consider while buying any web host is, undoubtedly, the value for money. Everyone wants to choose the right web hosting company for his/her business. Now, this is easy to say than to actually compare. With so many parameters of a reliable web host, so many features of a good web server, it just becomes difficult to choose among the “best”s. Luckily, there are services in the Internet which makes our job a lot easier. By looking into comparison tables, reading expert reviews and statistical analysis, going through highlighted features, we can get a better idea before putting money behind a web host. But still, you should have the basic (and well a little advanced won’t hurt) idea of today’s server technologies and cost for a profitable long term investment. So, we are going to discuss, what you need to consider before buying any web host. We shall also see some of the reviewing websites from where we can get aggregated information.

Things to consider before buying:

Out of my own experiences, I think, one should consider the following constrains while buying any web host:

#1: Offer Price & Renewal Price:

The first thing that should come into mind is, indeed the money. After all you are investing something for your company, so you want to be sure that you get the maximum out of it! Most web hosting services out there offers very less price while buying, and then the renewal price becomes higher. Mostly people overlook this thing. We buy using some promo code and then after a year or two, when the renewal time comes, we have to spend rather a lot to continue the service.

#2: Specifications & Features:

The most concerned features and specs are, perhaps, diskspace, bandwidth and number of addon domains. The more number of addon domains you have, more number of sites you can host. So, you know that you not just put money behind a single website hosting, rather a multi website hosting. Now a days, most good web hosts give unlimited addon domains.

• Technical Limitations: Apart from the unlimited stuffs, you should look into the technical limitations. Some host might give you unlimited bandwidth at the cost of limited domains and vice versa. Just keep in mind, what do you really need from your host.
• Domains, Addon Domains, Parked Domains & Sub domains: The main domain is the domain which is registered primarily with your web host. The addon domains are other domains which you can add and host using the same web host. The parked domains are “parked” on some directory of your existing sites. If someone enters the URL of the parked domain, then it will show that directory (and the index file if present). Now sub domains are the children of your main domain. Say, you have mydomain.com as your main domain or addon domain. Then, mysubdomain.mydomain.com would be a sub domain. Now a days, no limits are imposed on all these, which means, with a good web host, you can host unlimited domains with unlimited sub-domains.
• Domain portability: Another thing you look into is, domain portability. Some hosts out there force you to register your domain with them. Personally, I don’t prefer to do business with such web hosting companies. What if I want to move my sites to another host? Web hosts which gives the flexibility to add your already registered domain via the name servers, are always my first preferences.
• Bandwidth: The bigger the value, more visitors your webhost can support. With unlimited bandwidth, this is not an issue in shared hosting. But if you are going for VPS or VPN or Cloud, then you should look into the bandwidth and consider it seriously with respect to the number of visitors in your site. An average site, with around 1500-2000 page visits per day, might consume upto 100GB per month, depending on the data provided by the site. (This figure is mainly for image heavy sites, a text heavy site will actually consume much less bandwidth). You can use tools like Firebug to check out the size of your pages and estimate average bandwidth by multiplying it with your daily average page visits.
• Disk Usage: Larger value indicates bigger possibilities for storing audio, video and image files. But also keep in mind that a nice disk usage limitation is useless without a nicer Bandwidth cap. So choose wisely. You won’t want to have a web host with 100 GB diskspace yet only 10 GB bandwidth per month.
• Server Technology: The technology depends explicitly on your requirement. If you want to publish a .net or aspx site, then you would prefer Windows Hosting. Where as, if you are familiar with Open source technologies like PHP, MySQL etc, then Linux Hosting should be your first choice. Some of you might want to have several other technologies like Ruby on Rails, Perl, CGI etc.
• Website builder and Auto Installer script: Now, not everyone of us buy a webhost to create their sites from scratch or install CMS at their own. There are services like softaculous, fantastico etc which makes our job even easier. They provide a one click installer for popular CMS like WordPress, Joomla etc. All of the good web hosts should provide atleast one of these auto-installer scripts.
• Emails & Accounts: If you want to access your email directly within your host, this should be your concern. Personally, I prefer using google apps to setup my email accounts for the domain. But this feature should not be overlooked.
• SSH Access: If you know what this feature is, then you probably want your web host to support your feature. For those, who doesn’t know, here are some articles I found from the google explaining the importance and advantages of this feature. Note that for average usage, you won’t need this.

#3: Server Performance & Uptime:

You don’t want your website to be down. There are already services which does the job for us. But in most of the times the information provided is bloated with just too many details. The thing which one should look while choosing a good web host, is, the average uptime for the target region. Which means, if your target visitors are from US, then obviously you should not come into any conclusion from the UK’s uptime.

#4: Technical Support:

The next most important thing, is perhaps, how much support and technical help your web host can give. Mostly, now a days, big web hosting companies like Hostgator, Fatcow, BlueHost etc, have their dedicated support forum for their customers. Also, they give 24X7 toll free numbers where you can call and easily get help, regardless of your location. So, you should consider this aspect as well. If your site goes down, then there should be someone to recover.

#5: Compliance:

When you are using any external web host to host your site, then you should be aware of a few things. Because after all, it is your web host who is finally showing your site to the world. I would recommend to go through it at least once, before buying any web host. It is generally found at their Policy.

Doing your own researches:

Recently I was looking into fatcow and bluehost reviews in the internet. As an experienced blogger and developer, I am already aware of these two web hosting services and I used to think bluehost is any day better than its competitors because, it has spend more time in the business. But, surprisingly, my concepts changed as soon as I looked into those reviews. Here are the few of the points I noticed:

• Fatcow will give a 24 months plan at only $3.67/month (at the time of the review). Now that’s quite a lot of saving. Whereas, for BlueHost it is $19.95/month (although it is for reseller plan, but I prefer to stick to normal plans).
• For bluehost, it is $19.94/month for reseller plan. I could not found any offer on normal plans. They have 100GB diskspace, 15Mbps bandwidth, unlimited accounts, but they did not provide any easy to get information on bandwidth cap.
• Fatcow gives free domain & setup along with 75$ marketing credits. Also, just like bluehost it has unlimited addon domains along with unlimited diskspace and bandwidth.
• User recommendation of Fatcows beats BlueHost by 35%. For big web hosting companies like this, 35% is really something to consider.

So, from all these points, I could figure out that, had I wanted a reseller web host, I would have chosen BlueHost, but, as my needs are limited, so FatCow gives the best solution for me at a very reasonable, rather cheap price.

I hope you have found this review useful, and it will help you find the best web hosting for you. If you have any doubt, feel free to comment. I will be more than happy to help you.

Related posts:

1. Use PickaWeb Domain Hosting to buy Domains and Web Host at reasonable price
2. Choose the Best Web Host for you using WebHostingGeeks.com
3. Choose your Best Webhost using AlreadyHosting.com ~ One of the best webhosting review provider
4. The best and affordable alternatives of Google Page Hosting
5. Host your Website using one of UK’s top WebHosting sites-JustHost [review]

- By InTechgrity - Amalgamating Life & Technology

Original post published Login, Logout and Administrate using PHP SESSION, COOKIE & MySQL – Version 2 with remember me option">here

So, our last post on creating login admin and logout seems to be pretty backdated. We decided to come up with a new post under the same topic. So, to start with, let us see what you will be able to do after following this tutorial:

• Create a MySQL database for managing admin users. Use SHA1 encryption method to store the password in database. Also insert data into it.
• Create your own login/logout system in PHP using Cookie and Session along with remember me option. We shall md5 the SHA1 password in cookie for better protection.
• Understand the PHP code behind the scene. How we have stored the encrypted password in the cookie.
• Implementing the whole thing in OOP (Object Oriented Programming).

In this tutorial we will do only the basic stuffs, there will be no CSS/HTML styling. In our next release, we will provide you a package with HTML5 admin, from where you can download and use it directly in your projects. This tutorial is intended to explain the basic mechanism used in Login Systems and how cookies and sessions work to provide the administrator security. We will discuss the file and directory structure, the database structure, we will see how we’ve used MySQL in PHP to connect to database and how we actually authenticate the user for a single session or for multiple session (in case the remember me option is selected). Check out below to get the codes straight away if you know how to do this already and just want to get the code.

As for the so called licensing stuffs, this whole thing is just FREE. You download, fork, modify, redistribute, use in your project, or do whatever you want. Although a credit will be appreciated, but in this open world of internet, it is completely upto you.

So, let us start with the directory structure and understand which file does what.

#0: File and directory structure:

• directory – admin: The root directory of all your admin files. It contains all the classes, login/logout files etc that we need to get the system running.
  • admin-class.php – The main library class of the admin. It contains the several library functions that we need for user authentication, password checking etc.
  • index.php – The main admin file which should be restricted to the logged in administrator only. If not logged in, then this should redirect to the login page.
  • login-action.php – The action file which processes the user submitted username and password and authenticates on success. On failure, it redirects to the login page.
  • login.php – The login form where users are asked to enter their username, password etc along with the a nice remember me option.
  • logout.php – The logout script which should clear the authentication data and send back the user to the login page.
• directory – db: The root directory for the database connection files. We have used ezSQLto code our application. It gives several query abstractions for faster access.
  • db.php - It includes the library files ez_sql_core.php & ez_sql_mysql.php and initializes a global variable $db for all the database connections. We shall look more about this later.
  • ez_sql_core.php – The core ez_sql file as downloaded from the link above.
  • ez_sql_mysql.php - The MySQL extension for the ezSQL.

#1.1: Creating the database:

We shall start by creating a new database for our application. If you are on linux and have MySQL installed, just open up terminal and hit mysql (you need to access with super user privilege if you have not changed the mysql root, su mysql or sudo mysql) and enter the following sql queries.

CREATE DATABASE login_test;
USE login_test;

CREATE TABLE `user` (
`id` INT NOT NULL auto_increment,
`username` VARCHAR(50) NOT NULL default '',
`nicename` VARCHAR(255) NOT NULL default '',
`email` VARCHAR(255) NOT NULL default '',
`password` VARCHAR(255) NOT NULL default '',
UNIQUE KEY `user_n` (`username`),
UNIQUE KEY `user_e` (`email`),
    PRIMARY KEY (`id`)
);

INSERT INTO `user` (`username`, `nicename`, `email`, `password`)
VALUES (
'swashata', 'Swashata Ghosh', 'abc@domain.com', SHA1('pass')
);

Let us see what it does:

1. Creates a database named login_test.
2. Use that database.
3. Create a table user with id, username, nicename, email and password as fields. Set usename and email as unique keys and id as primary key.
4.  Insert a user named swashata with nicename Swashata Ghosh, email as above and password as pass.
5. Note that we have encrypted the password ‘pass‘ using the SHA1 encryption method provided my MySQL. In this way our password is stored in encrypted form. But that also means, you will never be able to see it in original form again. So, how do you reset it? Simple, by querying the database directly. Just

Now, if you run a SELECT * query, then you will see something like this.

All done, now let us code the PHP backend.

#1.2: Connecting the database with PHP: – db.php

Now, we need to connect this database to our script. To do this, we will be using ezSQL as mentioned before. So, inside our db.php file, we place the following code:

<?php
/**
* The db.php file which initiates a connection to the database
* and gives a global $db variable for access
* @author Swashata <swashata@intechgrity.com>
* @uses ezSQL MySQL
*/
/** edit your configuration */
$dbuser = 'db_user';
$dbname = 'db_name';
$dbpassword = 'db_password';
$dbhost = 'localhost';

/** Stop editing from here, else you know what you are doing   */

/** defined the root for the db */
if(!defined('ADMIN_DB_DIR'))
define('ADMIN_DB_DIR', dirname(__FILE__));

require_once ADMIN_DB_DIR . '/ez_sql_core.php';
require_once ADMIN_DB_DIR . '/ez_sql_mysql.php';
global $db;
$db = new ezSQL_mysql($dbuser, $dbpassword, $dbname, $dbhost);

As you can see, it creates a global $db object which connects to the database from the credential above. To use it, we just need to include this file and declare $db as global.

#2: Creating the Login form: – login.php

So, we have used a plain and simple login form with valid xhtml markup. You can add your own css to it to make it look better. The things to notice are

• The name and id of the fields should not change.
• The form method should be post and action should be login-action.php.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <title>Login to admin</title>
    </head>
    <body>
        <form action="login-action.php" method="post">
            <fieldset>
                <legend>Enter Credential</legend>
                    <p>
                        <label for="username">Username: </label>
                        <input type="text" name="username" id="username" value="" />
                    </p>
                    <p>
                        <label for="password">Password: </label>
                        <input type="password" name="password" id="password" value="" />
                    </p>
                    <p>
                        <label for="remember">
                            <input type="checkbox" name="remember" id="remember" value="1" /> Remember me
                        </label>
                    </p>
            </fieldset>
            <p>
                <input type="submit" value="Submit" /> <input type="reset" value="Reset" />
            </p>
        </form>
    </body>
</html>

Simple and effective.

#3: Creating the library classes – admin-class.php

We first need to analyze what features we need for our library. The basic features are (and also the code behind it):

#3.0: Initialize the session for login system:

Login systems work mainly either on session or on cookie. As we are using remember me option, so it is better to use both. Here is how we initialize the session and do some other stuffs.

    /**
     * The constructor function of admin class
     * We do just the session start
     * It is necessary to start the session before actually storing any value
     * to the super global $_SESSION variable
     */
    public function __construct() {
        session_start();

        //store the absolute script directory
        //note that this is not the admin directory
        self::$abs_path = dirname(dirname(__FILE__));

        //initialize the post variable
        if($_SERVER['REQUEST_METHOD'] == 'POST') {
            $this->post = $_POST;
            if(get_magic_quotes_gpc ()) {
                //get rid of magic quotes and slashes if present
                array_walk_recursive($this->post, array($this, 'stripslash_gpc'));
            }
        }

        //initialize the get variable
        $this->get = $_GET;
        //decode the url
        array_walk_recursive($this->get, array($this, 'urldecode'));
    }

#3.1: Checking the database for valid username and password combination:

    /**
     * Check the database for login user
     * Get the password for the user
     * compare md5 hash over sha1
     * @param string $username Raw username
     * @param string $password expected to be md5 over sha1
     * @return bool TRUE on success FALSE otherwise
     */
    private function _check_db($username, $password) {
        global $db;
        $user_row = $db->get_row("SELECT * FROM `user` WHERE `username`='" . $db->escape($username) . "'");

        //general return
        if(is_object($user_row) && md5($user_row->password) == $password)
            return true;
        else
            return false;
    }

So, what we do is, we compare the md5 and sha1 encrypted password with the one stored in database. As the database has only sha1 encrypted password, so we calculate the md5 hash by passing it through the function md5. If it matches, then we return true else, false. You might think, from where we get the username and password. Just keep on reading.

#3.2: Add action for the login-action.php file:

    /**
     * Check for login in the action file
     */
    public function _login_action() {

        //insufficient data provided
        if(!isset($this->post['username']) || $this->post['username'] == '' || !isset($this->post['password']) || $this->post['password'] == '') {
            header ("location: login.php");
        }

        //get the username and password
        $username = $this->post['username'];
        $password = md5(sha1($this->post['password']));

        //check the database for username
        if($this->_check_db($username, $password)) {
            //ready to login
            $_SESSION['admin_login'] = $username;

            //check to see if remember, ie if cookie
            if(isset($this->post['remember'])) {
                //set the cookies for 1 day, ie, 1*24*60*60 secs
                //change it to something like 30*24*60*60 to remember user for 30 days
                setcookie('username', $username, time() + 1*24*60*60);
                setcookie('password', $password, time() + 1*24*60*60);
            } else {
                //destroy any previously set cookie
                setcookie('username', '', time() - 1*24*60*60);
                setcookie('password', '', time() - 1*24*60*60);
            }

            header("location: index.php");
        }
        else {
            header ("location: login.php");
        }

        die();
    }

What it does is, calls the _check_db function with the username and encrypted password as parameters. If true is returned, then it sets the session for the admin with the username as $_SESSION['admin_login'] variable. Then it further checks for remember me option, and if yes, then it sets cookie as well. We shall discuss more about cookie in some other post. For now, you can just check the comments. As it says, it stores the username and password in the corresponding variables for 1 day. To fetch the cookie we shall use $_COOKIE super global.

#3.3: Creating the authentication method:

    /**
     * Checks whether the user is authenticated
     * to access the admin page or not.
     *
     * Redirects to the login.php page, if not authenticates
     * otherwise continues to the page
     *
     * @access public
     * @return void
     */
    public function _authenticate() {
        //first check whether session is set or not
        if(!isset($_SESSION['admin_login'])) {
            //check the cookie
            if(isset($_COOKIE['username']) && isset($_COOKIE['password'])) {
                //cookie found, is it really someone from the
                if($this->_check_db($_COOKIE['username'], $_COOKIE['password'])) {
                    $_SESSION['admin_login'] = $_COOKIE['username'];
                    header("location: index.php");
                    die();
                }
                else {
                    header("location: login.php");
                    die();
                }
            }
            else {
                header("location: login.php");
                die();
            }
        }
    }

When ever we need to authenticate in a file access, we just have to call this function. We shall see it in the index.php file. It automatically fetches the data from cookie, revalidates it and also redirects to the login.php in case of failure. This is just pretty much what you need.

#3.4: Putting together the class file – admin-class.php

<?php
/** Include the database file */
include_once '../db/db.php';
/**
 * The main class of login
 * All the necesary system functions are prefixed with _
 * examples, _login_action - to be used in the login-action.php file
 * _authenticate - to be used in every file where admin restriction is to be inherited etc...
 * @author Swashata <swashata@intechgrity.com>
 */
class itg_admin {

    /**
     * Holds the script directory absolute path
     * @staticvar
     */
    static $abs_path;

    /**
     * Store the sanitized and slash escaped value of post variables
     * @var array
     */
    var $post = array();

    /**
     * Stores the sanitized and decoded value of get variables
     * @var array
     */
    var $get = array();

    /**
     * The constructor function of admin class
     * We do just the session start
     * It is necessary to start the session before actually storing any value
     * to the super global $_SESSION variable
     */
    public function __construct() {
        session_start();

        //store the absolute script directory
        //note that this is not the admin directory
        self::$abs_path = dirname(dirname(__FILE__));

        //initialize the post variable
        if($_SERVER['REQUEST_METHOD'] == 'POST') {
            $this->post = $_POST;
            if(get_magic_quotes_gpc ()) {
                //get rid of magic quotes and slashes if present
                array_walk_recursive($this->post, array($this, 'stripslash_gpc'));
            }
        }

        //initialize the get variable
        $this->get = $_GET;
        //decode the url
        array_walk_recursive($this->get, array($this, 'urldecode'));
    }

    /**
     * Sample function to return the nicename of currently logged in admin
     * @global ezSQL_mysql $db
     * @return string The nice name of the user
     */
    public function get_nicename() {
        $username = $_SESSION['admin_login'];
        global $db;
        $info = $db->get_row("SELECT `nicename` FROM `user` WHERE `username` = '" . $db->escape($username) . "'");
        if(is_object($info))
            return $info->nicename;
        else
            return '';
    }

    /**
     * Sample function to return the email of currently logged in admin user
     * @global ezSQL_mysql $db
     * @return string The email of the user
     */
    public function get_email() {
        $username = $_SESSION['admin_login'];
        global $db;
        $info = $db->get_row("SELECT `email` FROM `user` WHERE `username` = '" . $db->escape($username) . "'");
        if(is_object($info))
            return $info->email;
        else
            return '';
    }

    /**
     * Checks whether the user is authenticated
     * to access the admin page or not.
     *
     * Redirects to the login.php page, if not authenticates
     * otherwise continues to the page
     *
     * @access public
     * @return void
     */
    public function _authenticate() {
        //first check whether session is set or not
        if(!isset($_SESSION['admin_login'])) {
            //check the cookie
            if(isset($_COOKIE['username']) && isset($_COOKIE['password'])) {
                //cookie found, is it really someone from the
                if($this->_check_db($_COOKIE['username'], $_COOKIE['password'])) {
                    $_SESSION['admin_login'] = $_COOKIE['username'];
                    header("location: index.php");
                    die();
                }
                else {
                    header("location: login.php");
                    die();
                }
            }
            else {
                header("location: login.php");
                die();
            }
        }
    }

    /**
     * Check for login in the action file
     */
    public function _login_action() {

        //insufficient data provided
        if(!isset($this->post['username']) || $this->post['username'] == '' || !isset($this->post['password']) || $this->post['password'] == '') {
            header ("location: login.php");
        }

        //get the username and password
        $username = $this->post['username'];
        $password = md5(sha1($this->post['password']));

        //check the database for username
        if($this->_check_db($username, $password)) {
            //ready to login
            $_SESSION['admin_login'] = $username;

            //check to see if remember, ie if cookie
            if(isset($this->post['remember'])) {
                //set the cookies for 1 day, ie, 1*24*60*60 secs
                //change it to something like 30*24*60*60 to remember user for 30 days
                setcookie('username', $username, time() + 1*24*60*60);
                setcookie('password', $password, time() + 1*24*60*60);
            } else {
                //destroy any previously set cookie
                setcookie('username', '', time() - 1*24*60*60);
                setcookie('password', '', time() - 1*24*60*60);
            }

            header("location: index.php");
        }
        else {
            header ("location: login.php");
        }

        die();
    }

    /**
     * Check the database for login user
     * Get the password for the user
     * compare md5 hash over sha1
     * @param string $username Raw username
     * @param string $password expected to be md5 over sha1
     * @return bool TRUE on success FALSE otherwise
     */
    private function _check_db($username, $password) {
        global $db;
        $user_row = $db->get_row("SELECT * FROM `user` WHERE `username`='" . $db->escape($username) . "'");

        //general return
        if(is_object($user_row) && md5($user_row->password) == $password)
            return true;
        else
            return false;
    }

    /**
     * stripslash gpc
     * Strip the slashes from a string added by the magic quote gpc thingy
     * @access protected
     * @param string $value
     */
    private function stripslash_gpc(&$value) {
        $value = stripslashes($value);
    }

    /**
     * htmlspecialcarfy
     * Encodes string's special html characters
     * @access protected
     * @param string $value
     */
    private function htmlspecialcarfy(&$value) {
        $value = htmlspecialchars($value);
    }

    /**
     * URL Decode
     * Decodes a URL Encoded string
     * @access protected
     * @param string $value
     */
    protected function urldecode(&$value) {
        $value = urldecode($value);
    }
}

#4: Creating the login-action.php file:

As we have everything in our class, so creating the login-action.php file will be a breeze. All what we do is

• Include the admin-class.php file.
• Initiate a new instance of the itg_admin class.
• Call the _login_action function.

<?php
include_once 'admin-class.php';
$admin = new itg_admin();
$admin->_login_action();

and we are done.

#5: Creating the index.php file – restricted access:

So, it is time to put all the codes to work. In index.php file we simply do what we have done in login-action.php file, except of calling the _login_action, we call _authenticate function. It will automatically check whether user is authenticated to access the further script or not and will redirect to login form if necessary.

<?php
include_once 'admin-class.php';
$admin = new itg_admin();
$admin->_authenticate();
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <title>Administrator page</title>
    </head>
    <body>
        <fieldset>
            <legend>Welcome <?php echo $admin->get_nicename(); ?></legend>
                <p>
                    Here are some of the basic informations
                </p>
                <p>
                    Username: <?php echo $_SESSION['admin_login']; ?>
                </p>
                <p>
                    Email: <?php echo $admin->get_email(); ?>
                </p>
        </fieldset>
        <p>
            <input type="button" onclick="javascript:window.location.href='logout.php'" value="logout" />
        </p>
    </body>
</html>

and finally…

#6: The logout.php file:

Everything seems to be incomplete without it! What we do is

• Destroy the session.
• Expire the cookie.
• Redirect to login form.

<?php
/**
* The logout file
* destroys the session
* expires the cookie
* redirects to login.php
*/
session_start();
session_destroy();
setcookie('username', '', time() - 1*24*60*60);
setcookie('password', '', time() - 1*24*60*60);
header("location: login.php");
?>

and we are done. It looks like this

So that was all. Feel free to ask any questions you have. I will try best to answer them.

Related posts:

1. Create Login Admin & Logout Page in PHP w/ SESSION n MySQL
2. Get Parent directory of Current URL using PHP dirname function
3. How to Connect to XAMPP/MySQL using Windows CMD [Command Prompt]
4. jQuery Recent Post Widget for BlogSpot/Blogger with Filter by Tag Option
5. Understanding the basic of HTML form and PHP GET and POST method

- By InTechgrity - Amalgamating Life & Technology