How To Get Custom Fields Outside The Loop In WordPress

Custom fields are one of the most useful and powerful feature in WordPress and are used on many WordPress-powered blogs. In this post, I'm going to show you how to get custom fields values outside the loop.

Thanks to Paul Whitehead for this trick. I want to share link to his website, but the website is dead right now.

Simply post following snippet anywhere in your WordPress site. Don’t forget to replace customField on line 4 by the name of the custom field you want to display.

<?php
global $wp_query;
$postid = $wp_query->post->ID;
echo get_post_meta($postid, 'customField', true);
?>

How To Get Value Of A Specific Custom Field In WordPress

WordPress allows us to add custom fields to a our posts, which adds extra information, which is known as meta-data. But we can do a lot more there custom fields. For example, I embedded a video in this post with the use of custom fields.

More of newbies gets confused when it comes to use custom fields. But they're not that complicated, at least the basic use of these fields.

Here's how you can get value of a specific custom field in your WordPress posts:

<?php echo get_post_meta($post->ID, 'mood', true); ?>

"mood" would be ID value of custom field. That was simple.

And here's how to display custom field only if exists:

<?php
    $url = get_post_meta($post->ID, 'snippet-reference-URL', true);

    if ($url) {
        echo "<p><a href='$url'>Reference URL</a></p>";
    }
?>

Using A Different Post Template For Posts Within A Specific Category

On Thursday I posted an article about using different post template for posts formats, but now it's time for doing the same thing with categories, instead of formats. You can use this trick in your WordPress to create different type of posts, such as portfolio items.

We discussed everything previously, so let's get into this trick:

Using A Different Post Template:

In this tutorial, we'll create a different post template for the cat-1 category. We'll use multiple single.php files to make it more easy and customizable.

Create a single.php file for your category. We're going to name it single-cat-1.php. You can also copy your single.php file to this template and make some changes that you want in the video template.

Upload single-cat-1.php to the root of your current theme. Same place where single.php file is located.

Okay, so now we'll tell WordPress to use single-cat-1.php template for the posts within video category. Add following to your theme's functions.php file:

add_action('template_include', 'load_single_template');
  function load_single_template($template) {
    $new_template = '';

    // single post template
    if( is_single() ) {
      global $post;

      // 'cat-1' is category slugs
      if( has_term('cat-1', 'category', $post) ) {
        // use template file single-template-cat-1.php
        $new_template = locate_template(array('single-cat-1.php' ));
      }

    }
    return ('' != $new_template) ? $new_template : $template;
  }

In above code, replace cat-1 is the slug of your category, and single-cat-1.php is your custom post template file. Save the file. That's it.

How To Log Out From New Facebook Messenger Android App

Facebook has released the latest update of its Messenger app for Android. This release covers some major changes in the app interface and features. You can also text your contracts from this app, which makes it replacement of texting.

But Facebook forgot to add something in this new upload. There's no option to Log Out of your account in this new update. Don't worry there's a solution of every problem.

Most of us used to log out of our Facebook accounts from Account settings menu, which will not work in this case. Here's how to log out from this app:

In Gingerbread: Click on Settings > Applications > Manage applications > Find and click on "Messenger" > Click on Clear Data > That's IT!

In ICS & JellyBean: Click on Settings > Apps > Find and click on "Messenger" > Click on Clear Data > That's IT!

Is Your Website Down For Everyone Or It's Just You?

A couple of days ago my website WWEFansNation.com's server went down, and the following message appeared:

503 Service Unavailable: The server is currently unavailable (because it is overloaded or down for maintenance)

But my website was not down at all. It was just my WiFi operator's fault. It was just down on my WiFi connection, but was up to entire universe.

My fellow blogger, Rajat Garg of TrueBloggerTips, passed me link to isup.me to check whether my website is down for everyone or it's just me.

You can also check if your website is down for everyone or it's you by visiting isup.me.

Using A Different Post Template For Posts Formats In WordPress

Post Formats is a theme feature which was introduced with the WordPress 3.1 release. It gave us a new feature to style posts based on its format. If you ever used WordPress' default themes, then you might know about their different post templates based on the post format. So it's time for you to style your posts based on its format. Here's a demo of this trick from my own WordPress site:

This is a simple post.

This is a video post with a different template.

Add Post Format Support To Your WordPress Theme:

Before starting this tutorial, it's important for you to add support for post formats in your current WordPress theme. If this section is available in your post editor then you can skip this step:

If not, then follow this tutorial.

Using A Different Post Template:

In this tutorial, we'll create a different post template for the Video format. Most of developers uses a single post template file for all different format. But we'll use multiple single.php files to make it more easy and customizable.

Create a single.php file for your post format (we're using Video). We're going to name it single-video.php. You can also copy your single.php file to this template and make some changes that you want in the video template.

Upload single-video.php to the root of your current theme. Same place where single.php file is located.

Okay, so now we'll tell WordPress to use single-video.php template for the posts with video format. Add following to your theme's functions.php file:

add_action('template_include', 'load_single_template');
  function load_single_template($template) {
    $new_template = '';

    // single post template
    if( is_single() ) {
      global $post;

      // template for post with video format
      if ( has_post_format( 'video' )) {
        // use template file single-video.php for video format
        $new_template = locate_template(array('single-video.php' ));
      }

    }
    return ('' != $new_template) ? $new_template : $template;
  }

Save the file. That's it.

Now just publish a post with video format & see the magic. You can do the same with every post format. On a related note, I'll also share the same trick with categories, instead of formats.

Add Post Formats To WordPress Theme

It's school holiday for five days in a row, so as a part of the second day of this holiday, I was doing some random stuff around the internet, such as listing to new songs, reading about upcoming Next-Gen gaming consoles, browsing troll memes, blaming Justin Bieber, and more.

So in this busy day I took some time to edit my WordPress website for new feature. I did some thing new (at least for me) with some post formats, and I'm going to share it here on BWidgets. So as a part of that tutorial, here's the basic thing to learn before I post that article, which is adding post format support to your WordPress theme.

Post Formats is a theme feature introduced with the WordPress 3.1 release. It's piece of meta info that can be used by a theme to customize its post structure. If you ever used Tumblr, then you'll love this feature.

As of now, WordPress supports following post formats:

• aside: Typically styled without a title. Similar to a Facebook note update.

• gallery: An image gallery. This type of post will likely contain an image gallery using shortcode and plugins.

• link: A link to an external webpage.

• image: A single image. Yeah, just a single image.

• quote: A quatation. My favorite quote is: Your arms are just too short to box with the God. - CM Punk to Dwayne "The Rock" Johnson

• status: A short status update, similar to a tweet.

• video: A single video or several videos. You can upload or embed a video to the post.

• audio: An audeo file, likely if you run a Podcast.

• chat: A chat transcript.

Add following snippet to your theme's functions.php file to add post format support to your post:

add_theme_support( 'post-formats', array( 'aside', 'chat','gallery','image','link', 'quote', 'status', 'video', 'audio' ) );

You can also add post format support to Page and custom post types:

// add post-formats to post_type 'page'
add_post_type_support( 'page', 'post-formats' );

// add post-formats to post_type 'my_custom_post_type'
add_post_type_support( 'my_custom_post_type', 'post-formats' );

Remove Default Widget Bundle CSS From Blogger

If you're a Blogger template designer, then this article is very very helpful for your future designs. If you're a designer, then you probably know about two default Blogger stylesheets- widget_css_bundle.css and widget_css_2_bundle.css. Becaue they make it more diffecult for you to design your template.

Blogger automatically adds the following code in your Blogger template:

<link type='text/css' rel='stylesheet' href='//www.blogger.com/static/v1/widgets/1937454905-widget_css_bundle.css' />

<link type='text/css' rel='stylesheet' href='//www.blogger.com/static/v1/widgets/4219271310-widget_css_2_bundle.css' />

So it's time for your to remove there stylesheets from your Blogger template. If you don't know above there stylesheets, then don't follow this tutorial. Removing this code maybe can make your template destroyed, if you use official widgets from Blogger.

We are not really removing this code from our template, but this trick will make that code ignored by your browser. This tutorial is just converting that code to HTML comments, thanks to Damzaky for this trick.

• Open Blogger > Template > Edit HTML, proceed, then CTRL+F this code: <b:skin><![CDATA[

• If you have found that code, in below that code you may found your CSS, so just copy all the CSS to a notepad or anywhere because we need this code later in this tutorial.

• Then the remaining code is  <b:skin><![CDATA[    ]]></b:skin>

• Replace above code with following:

&lt;style type=&quot;text/css&quot;&gt;

&lt;!-- /*<b:skin><![CDATA[*/]]></b:skin>

• Then post following code just above the </head> of your template:

<style type='text/css'>

YOUR CSS FROM NOTEPAD

</style>

• In above code, replace the YOUR CSS FROM NOTEPAD from all CSS from your notepad that we copied earlier.

• Save your template.

That's it.

Change WordPress Login Logo Without Plugins

Above is a screen shot of the login page of my WordPress website. As you can see in above image, I'm using my website's logo in the login page instead of WordPress logo. And it looks pretty good.

If you're running a website with public registration or a client website, then you should replace the default logo with your own. There are lots of plugins to change the custom logo in some easy steps. However, we're going to do this without any plugin.

Add this snippet to the functions.php file of your active theme:

<?php
function custom_login_logo() {
    echo '<style type="text/css">
        h1 a { background-image:url('CUSTOM-LOGO-URL.png') !important; }
    </style>';
}
add_action('login_head', 'custom_login_logo');
?>

Replace the CUSTOM-LOGO-URL.png in above code with url of your custom login logo. That's it.

How To Set Minimum Word Count For WordPress Posts

If you're running a WordPress site with some co-authors then it's really important for you to focus on your content's quality. Quality content is the ultimate key to success in blogging. Most of bloggers write like a monkey in the very beginning; I was also in that league when I started this blog.

Since recent Google updates you can no longer post an article with some couple of words and expect the post to rank highly for the keywords in the title. Now you need more content in the entire post with a lot of different keywords.

With WordPress you can create a function to make sure that you have a minimum number of words in your post.

By adding following code to your functions.php file, you can check if the post is under 500 words and if it is you can end the publishing process so the post will not be published:

function minimum_number_words($content)
{
    global $post;
    $content = $post->post_content;
    if (str_word_count($content) < 500 )
    wp_die( __('The current post is below the minimum number of words, it must be over 500 words.') );
}

How To Set Minimum Comment Length In WordPress

Most of us turn on comments in our sites to start a discussion and reach out more people. But some people comment just to get a link back to their own site. Their comments will consist of things like "nice post", "thanks" and all stuff.

If you're running a big website, then moderating these crappy comments will waste a lot of time. So how about setting a minimum character count length on your comments.

Add following snippet to your functions.php file:

add_filter( 'preprocess_comment', 'minimal_comment_length' );

function minimal_comment_length( $commentdata ) {
    $minimalCommentLength = 20;

    if ( strlen( trim( $commentdata['comment_content'] ) ) < $minimalCommentLength )
        {
        wp_die( 'All comments must be at least ' . $minimalCommentLength . ' characters long.' );
        }
    return $commentdata;
}

Save your file. That's it. You can also replace 20 in the above code with your custom value.

Google Adsense Stats Plugin For WordPress

Most of us use Google Adsense as our primary source of earning. Believe me, they're the reason of me running a whole network of websites. So I found a great plugin to display stats of your Adsense in the backend of your WordPress website.

The description of this widget reads, "Earnings Dashboard will display your Google Adsense earnings and related reports inside your WordPress Blog, on your Administration Dashboard."

You can download this plugin from this link.

How To Install And Activate This Plugin:

• Click here and download this plugin. Visit your WordPress' plugin page and install this plugin.

• You can also install this plugin from your WP's plugin directory.

• After installing, activate the plugin through the 'Plugins' admin menu in WordPress.

• Open the plugin configuration page, which is located under Settings > Earnings Dashboard (optionally enter your API Key, Client Secret and Client ID).

• Authorize the application using the 'Authorize Application' button

• Go back to the plugin configuration page, which is located under Settings > Earnings Dashboard to update the final settings.

That's it.

Bulk Remove Featured Images From WordPress Posts

By default, there's no such option in WordPress to remove featured image from all posts at once. You can only remove the featured image by editing each post and removing it manually. It can take a lot of time. For example, it's almost impossible to manually remove featured images from my WWEFansNation.com with more than 4,000 posts. But that's all right cuz we're here to solve this problem.

WPBeginner found a great way to remove (unset) featured images from all posts in bulk. It's worth nothing that this code will only remove the featured image from the posts, and the image will not be deleted from your site.

Copy & paste following code in your theme's functions.php file:

global $wpdb;

$attachments = $wpdb->get_results( "
     SELECT *
     FROM $wpdb->postmeta
     WHERE meta_key = '_thumbnail_id'
" );

foreach ( $attachments as $attachment ) {
    wp_delete_attachment( $attachment->meta_value, true );
}

$wpdb->query( "
    DELETE FROM $wpdb->postmeta
    WHERE meta_key = '_thumbnail_id'
" );

Important: Please remove this code immediately after saving your functions.php file. You only need to run this code once, there's no need to keep this code in your theme.

Automatically Set The Featured Image In WordPress

Almost every WordPress theme developer is using WordPress' featured post image option in their latest themes, and it's a very great option. You can pick any image for your article before publishing

But ofter we forget to pick a featured image for out posts. Also there's no way to pick a featured image in WordPress' smartphone application. So today we're going to automatically set the featured image.

This snippet will automatically set the first image of your post as the featured image of the post. Note, you can always go and set another image as the featured image if you want to.

Add following snippet to your functions.php file:

function wpforce_featured() {
          global $post;
          $already_has_thumb = has_post_thumbnail($post->ID);
              if (!$already_has_thumb)  {
              $attached_image = get_children( "post_parent=$post->ID&post_type=attachment&post_mime_type=image&numberposts=1" );
                          if ($attached_image) {
                                foreach ($attached_image as $attachment_id => $attachment) {
                                set_post_thumbnail($post->ID, $attachment_id);
                                }
                           } else {
                                set_post_thumbnail($post->ID, '414');
                           }
                        }
      }  //end function
add_action('the_post', 'wpforce_featured');
add_action('save_post', 'wpforce_featured');
add_action('draft_to_publish', 'wpforce_featured');
add_action('new_to_publish', 'wpforce_featured');
add_action('pending_to_publish', 'wpforce_featured');
add_action('future_to_publish', 'wpforce_featured');

There is one more cool option in this code. If you don't have an image in the post, the above code will let you set a default featured image as well. You must edit the attachment ID according to your WordPress site. The example above uses the attachment ID "414"

Credits: WPForce

Move WordPress Admin Bar To The Bottom

Ever wanted to move your WordPress blog's Admin Bar to bottom of the page? If yes, then this is the right place for you. It sounds like a telemall commercial, lol. With just a bit CSS you can change it. So instead of editing the core CSS files, we'll add some CSS to your functions.php file.

Put this little snippet to a Plugin or in the functions.php of your theme:

 function fb_move_admin_bar() {
    echo '
    <style type="text/css">
    body {
    margin-top: -28px;
    padding-bottom: 28px;
    }
    body.admin-bar #wphead {
       padding-top: 0;
    }
    body.admin-bar #footer {
       padding-bottom: 28px;
    }
    #wpadminbar {
        top: auto !important;
        bottom: 0;
    }
    #wpadminbar .quicklinks .menupop ul {
        bottom: 28px;
    }
    </style>';
}
// on backend area
add_action( 'admin_head', 'fb_move_admin_bar' );
// on frontend area
add_action( 'wp_head', 'fb_move_admin_bar' );

WordPress Style Admin Bar For Blogger

First of all, this is the most foolish Blogger widget on this entire blog. This widget is very useful but still a dumb idea from me.Still it's an awesome navigation bar for Blogger admins.

This widget is inspired from the WordPress Admin Bar menu and Blogger Admin Control Panel widget. This widget will be only visible to blog admins. It'll provide you some quick actions in the front end of your Blogger blog. Let's get started:

Locate Your Unique Blog ID Number:

To add this widget, it's important to find your unique blog ID number. It's really easy. Just open your Blog's dashboard (overview, posts, and backend other pages) and copy your unique blog ID from address bar.

For example, your ID will look something like this:

http://www,.blogger.com/blogger.g?blogID=1415638240907948#posts

Red part of the above URL is my blog ID. Visit your blog and copy your unique blog ID.

Add Admin Bar To Blogger Template:

To add the control panel to your Blogger template, go to Template > Edit HTML. Search and add following code just above </body>:

<style>
#wpadminbar {
    direction: ltr;
    color: rgb(204, 204, 204);
    font: 400 13px/28px sans-serif;
    height: 28px;
    position: fixed;
    top: 0px;
    left: 0px;
    width: 100%;
    min-width: 600px;
    z-index: 99999;
    background: linear-gradient(to top, rgb(55, 55, 55) 0px, rgb(70, 70, 70) 5px) repeat scroll 0% 0% rgb(70, 70, 70);
}

#wpadminbar .quicklinks {
    border-left: 1px solid transparent;
}

#wpadminbar div {
    outline: 0px none;
}

#wpadminbar * {
    height: auto;
    width: auto;
    margin: 0px;
    padding: 0px;
    position: static;
    text-transform: none;
    letter-spacing: normal;
    font: 400 13px/28px sans-serif;
    color: rgb(204, 204, 204);
    text-shadow: 0px -1px 0px rgb(68, 68, 68);
    -moz-box-sizing: content-box;
    transition: none 0s ease 0s;
}

#wpadminbar {
    direction: ltr;
    color: rgb(204, 204, 204);
    font: 400 13px/28px sans-serif;
}

#wpadminbar .quicklinks ul {
    text-align: left;
}

#wpadminbar .ab-sub-wrapper, #wpadminbar ul, #wpadminbar ul li {
    background: none repeat scroll 0px 0px transparent;
    clear: none;
    list-style: none outside none;
    margin: 0px;
    padding: 0px;
    position: relative;
    text-indent: 0px;
    z-index: 99999;
}

#wpadminbar .quicklinks > ul > li {
    border-right: 1px solid rgb(85, 85, 85);
}

#wpadminbar ul li {
    background: none repeat scroll 0px 0px transparent;
        background-color: transparent;
        background-image: none;
        background-repeat: repeat;
        background-attachment: scroll;
        background-position: 0px 0px;
        background-clip: border-box;
        background-origin: padding-box;
        background-size: auto auto;
    clear: none;
    list-style: none outside none;
    margin: 0px;
    padding: 0px;
    position: relative;
    text-indent: 0px;
    z-index: 99999;
}
#wpadminbar li {
    float: left;
}

#wpadminbar .quicklinks > ul > li > a, #wpadminbar .quicklinks > ul > li > .ab-empty-item {
    border-right: 1px solid rgb(51, 51, 51);
}
#wpadminbar .quicklinks a, #wpadminbar .quicklinks .ab-empty-item, #wpadminbar .shortlink-input {
    height: 28px;
    display: block;
    padding: 0px 12px;
    margin: 0px;
}
#wpadminbar a, #wpadminbar a:hover, #wpadminbar a img, #wpadminbar a img:hover {
    outline: 0px none;
    border: 0px none;
    text-decoration: none;
    background: none repeat scroll 0px 0px transparent;
}

#wpadminbar .ab-top-secondary {
    float: right;
    background: linear-gradient(to top, rgb(55, 55, 55) 0px, rgb(70, 70, 70) 5px) repeat scroll 0% 0% rgb(70, 70, 70);
}

#wpadminbar .quicklinks .ab-top-secondary > li {
    border-left: 1px solid rgb(51, 51, 51);
    border-right: 0px none;
    float: right;
}
#wpadminbar ul li:last-child, #wpadminbar ul li:last-child .ab-item {
    border-right: 0px none;
    box-shadow: none;
}

#wpadminbar #wp-admin-bar-search .ab-item {
    background: none repeat scroll 0% 0% transparent;
}
#wpadminbar #wp-admin-bar-search .ab-item {
    padding: 0px;
}
#wpadminbar .quicklinks .ab-top-secondary > li > a, #wpadminbar .quicklinks .ab-top-secondary > li > .ab-empty-item {
    border-left: 1px solid rgb(85, 85, 85);
    border-right: 0px none;
}
#wpadminbar ul li:last-child, #wpadminbar ul li:last-child .ab-item {
    border-right: 0px none;
    box-shadow: none;
}

#wpadminbar #adminbarsearch {
    height: 28px;
    padding: 0px 2px;
}

#wpadminbar #adminbarsearch .adminbar-input {
    font: 13px/24px sans-serif;
    height: 24px;
    width: 24px;
    border: 0px none;
    padding: 0px 3px 0px 23px;
    margin: 0px;
    color: rgb(204, 204, 204);
    text-shadow: 0px -1px 0px rgb(68, 68, 68);
    background-color: rgba(255, 255, 255, 0);
    background-image: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjj28b9E4prJNAbLzgGAVLnghfUUI68B9WpuPYgIA5eRH17OOV6miL_c29kKSoG7Nfq6j0XkDoYgfwp_JQjPN4KixsnU_fc-5o2UORtJLhrOzBENCn8gFoie_HCBkSvbgmwaRSPmqeOMVM/s1600/admin-bar-sprite.png");
    background-position: 3px 2px;
    background-repeat: no-repeat;
    outline: 0px none;
    cursor: pointer;
    border-radius: 3px 3px 3px 3px;
    box-shadow: none;
    -moz-box-sizing: border-box;
    transition-duration: 400ms;
    transition-property: width, background;
    transition-timing-function: ease;
}

#wpadminbar .ab-icon {
    position: relative;
    float: left;
    width: 16px;
    height: 16px;
    margin-top: 6px;
}

#wp-admin-bar-comments > .ab-item .ab-icon {
    background-image: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjj28b9E4prJNAbLzgGAVLnghfUUI68B9WpuPYgIA5eRH17OOV6miL_c29kKSoG7Nfq6j0XkDoYgfwp_JQjPN4KixsnU_fc-5o2UORtJLhrOzBENCn8gFoie_HCBkSvbgmwaRSPmqeOMVM/s1600/admin-bar-sprite.png");
    background-position: -1px -134px;
    background-repeat: no-repeat;
}

#wpadminbar #wp-admin-bar-new-content > .ab-item .ab-icon {
    background-image: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjj28b9E4prJNAbLzgGAVLnghfUUI68B9WpuPYgIA5eRH17OOV6miL_c29kKSoG7Nfq6j0XkDoYgfwp_JQjPN4KixsnU_fc-5o2UORtJLhrOzBENCn8gFoie_HCBkSvbgmwaRSPmqeOMVM/s1600/admin-bar-sprite.png");
    background-position: -2px -182px;
    background-repeat: no-repeat;
}

#wpadminbar a:focus, #wpadminbar a:active, #wpadminbar input[type="text"], #wpadminbar input[type="password"], #wpadminbar input[type="number"], #wpadminbar input[type="search"], #wpadminbar input[type="email"], #wpadminbar input[type="url"], #wpadminbar select, #wpadminbar textarea, #wpadminbar div {
    outline: 0px none;
}

#wpadminbar #adminbarsearch .adminbar-button {
    display: none;
}

#wpadminbar .ab-top-menu > li:hover > .ab-item, #wpadminbar .ab-top-menu > li.hover > .ab-item, #wpadminbar .ab-top-menu > li > .ab-item:focus, #wpadminbar.nojq .quicklinks .ab-top-menu > li > .ab-item:focus {
    color: rgb(250, 250, 250);
    background: linear-gradient(to top, rgb(58, 58, 58), rgb(34, 34, 34)) repeat scroll 0% 0% rgb(34, 34, 34);
}
#wpadminbar .quicklinks > ul > li > a, #wpadminbar .quicklinks > ul > li > .ab-empty-item {
    border-right: 1px solid rgb(51, 51, 51);
}

#wpadminbar #adminbarsearch .adminbar-input:focus {
    color: rgb(85, 85, 85);
    text-shadow: 0px 1px 0px rgb(255, 255, 255);
    width: 200px;
    background-color: rgba(255, 255, 255, 0.9);
    cursor: text;
}
</style>

<span class='item-control blog-admin'>
<div id="wpadminbar" class="no-grav" role="navigation">   
            <div class="quicklinks" id="wp-toolbar" role="navigation" aria-label="Top navigation toolbar." tabindex="0">
                <ul id="wp-admin-bar-root-default" class="ab-top-menu">
        <li id="wp-admin-bar-site-name" class="menupop"><a class="ab-item" aria-haspopup="true" href="http://draft.blogger.com/blogger.g?blogID=BlogIdNumber#overview">BWidgets.com</a>        </li>
        <li id="wp-admin-bar-comments"><a class="ab-item" href="http://www.blogger.com/blogger.g?blogID=BlogIdNumber#comments" title="Moderate Comments"><span class="ab-icon"></span></a>        </li>
        <li id="wp-admin-bar-new-content" class="menupop"><a class="ab-item" aria-haspopup="true" href="http://www.blogger.com/blogger.g?blogID=BlogIdNumber#editor" title="Add New"><span class="ab-icon"></span><span class="ab-label">New</span></a>        </li>
        <li class="menupop"><a class="ab-item" aria-haspopup="true" href="http://www.blogger.com/logout" title="Logout"><span></span><span class="ab-label">Logout</span></a>        </li>
       
       
        </ul><ul id="wp-admin-bar-top-secondary" class="ab-top-secondary ab-top-menu">
        <li id="wp-admin-bar-search" class="admin-bar-search"><div class="ab-item ab-empty-item" tabindex="-1"><form action="/search" method="get" id="adminbarsearch"><input class="adminbar-input" id="adminbar-search" name="q" value="" maxlength="150" type="text"><input class="adminbar-button" value="Search" type="submit"></form></div>        </li>
       
       
        </ul>            </div>
</div>
</span>

Replace all instances of BlogIdNumber with your unique BlogID. Save your template & that's it!

How To Add An Admin Control Panel To Blogger

Most of Blogger user hide the Blogger navigation bar in their blog. It's not a bad thing but takes a lot of quick links away from you. Those quick links are  “New post”, “Customize” and “Log Out.”

In this article, you'll know how to add an Admin Control Panel widget to your blog, which will be only visible to the blog admin. Thanks to BloggingTips for this awesome trick.

I added some extra options to the admin panel but you can add or remove them if you want to.

Locate Your Unique Blog ID Number:

To add this widget, it's important to find your unique blog ID number. It's really easy. Just open your Blog's dashboard (overview, posts, and backend other pages) and copy your unique blog ID from address bar.

For example, your ID will look something like this:

http://www,.blogger.com/blogger.g?blogID=1415638240907948#posts

Red part of the above URL is my blog ID. Visit your blog and copy your unique blog ID.

Add Admin Control Panel To Blogger Template:

To add the control panel to your Blogger template, go to Template > Edit HTML. Then search for the following line of code (or similar):

<b:section class='sidebar' id='sidebar' preferred='yes'>

Immediately before this line, paste the following section of code:

<span class='item-control blog-admin'>
<h2>Admin Control Panel</h2>
<a href='http://www.blogger.com/blogger.g?blogID=BlogIdNumber#editor'>New Post</a>
|
<a href='http://www.blogger.com/blogger.g?blogID=BlogIdNumber#posts'>Posts</a>
|
<a href='http://www.blogger.com/blogger.g?blogID=BlogIdNumber#stats'>Stats</a>
|
<a href='http://www.blogger.com/blogger.g?blogID=BlogIdNumber#settings'>Settings</a>
|
<a href='http://www.blogger.com/blogger.g?blogID=BlogIdNumber#pageelements'>Change Layout</a>
|
<a href='http://www.blogger.com/blogger.g?blogID=BlogIdNumber#template'>Edit HTML</a>
|
<a href='http://www.blogger.com/blogger.g?blogID=BlogIdNumber#comments'>Moderate Comments</a>
|
<a href='http://www.blogger.com/logout.g'>Sign Out</a>
</span>

Replace all instances of BlogIdNumber with your unique BlogID. Save your template & that's it!

Stop WordPress From Compressing JPEG Images

According to some blogs, WordPress automatically compress your JPEG images to 90% quality, but this information is false.

This only happens on the resized images WordPress creates. The original uploaded image is saved unaltered, as the "full" size.

Anyways, you can stop compressing of JPEG images by putting following code into your functions.php file:

add_filter('jpeg_quality', function($arg){return 100;});
add_filter( 'wp_editor_set_quality', function($arg){return 100;} );

Google: How Fast Is Our Hummingbird

15 years have past since Google Search first appeared on the stage. Back in 1998 the searching process was far from perfection:  the huge machine called computer is on, the user type in keywords into the search system and the system manages to find several websites with the required information. Now it sounds funny, but at that time it was a miracle!

The whole process and the devices have changed since 1998. It is so easy to find billions of websites with one click on a tiny device in your pocket. Search systems are powerful, quick and very convenient. You can even ask the question in a loud voice and your inquiry will be satisfied. What else can be done here? Are there possible improvements? Google proves that there is always space for making changes and striving for better result.

New search algorithm from Google has got a beautiful name of a small but smart bird – the Hummingbird. It was presented on the press-conference dedicated to the 15th anniversary of Google.   The name for the new offspring was chosen in order to emphasize the accuracy and high speed of its work. The company said that changes in the search engine had been made a month ago and covered 90% of search queries, but the notification on the transition to the new search algorithm Hummingbird was decided to give on the 15th anniversary of Google. The press conference took place in the garage, where 15 years ago Sergey Brin and Larry Page had started a glorious history of  the search giant.

Amit Singhal, the head of Google's core ranking team, says that the current updated search algorithm is perhaps the most radical since 2001, the year he began to work in the company. Last major update search engine Caffeine was aimed primarily at increasing the speed of information indexing rather than the processing of the collected information. Hummingbird handles requests not only for keywords, but also according to their meaning. Thanks to this function, the inquiries made by users can be longer and more complex.

As the nature of inquiries has changed recently, the need to improve search algorithm appears. Earlier search inquiries were made in the form of short phrases with a large number of keywords. Today a user can make up search inquiries with the help of colloquial phrases, sometimes quite long and complex. The second reason, which made ​​it necessary to use a new search algorithm is the development of voice search. The time offers new standards, gadgets and approaches for search systems, that is why now is the right time for changes.

Tamar Yehoshua, vice president of the research department, demonstrated the abilities of new search algorithm to understand the associated inquiries. She offers Google to open photos of the Eiffel Tower, and immediately afterwards, without specifying what exactly she is talking about, asks questions: "What is its height?", "When was it built?", "Show me the photos of the building process". Next she presented the way voice search Google works offering to find information about the Impressionist painters.

Unfortunately, there is no way to compare the results of search system efficiency "before" and "after" the introduction of the new search algorithm. However, Google gives a few examples. For instance, request «acid reflux prescription» (acid reflux recipe) used to offer a list of medications that may be useless for users who sought for general information on the treatment and general information about the necessity to take medicine. The new algorithm offers the article containing this exact information.

Is it possible that the new search algorithm from Google made the search system worse? Hummingbird creators are sure that is unlikely, saying that they can’t approve that search system is better now, still, there are no evidences of dissatisfaction on the part of users. As everybody knows, people complain when they notice errors but they rarely see improvements.

Time will show how fast and smart Hummingbird is. A month after its start new algorithm justifies our hopes.

Author - Melisa Marzett is an experienced writer, she mainly works on such topics as internet innovations, web press and social media. Her articles are also available on best college paper writing service. It is easy to contact with Melisa on Google+
Join Us On: Google+

Remove Author Prefix From Slug In WordPress

Earlier this month I shared an article about changing WordPress Author URL Slug. That code will change the default yoursite.com/author/name to yoursite.com/profile/name.

Now this trick will remove the author prefix from the author slug. To clarify, this snippet will help you turn: yoursite.com/author/name/ into: yoursite.com/name/.

Just add following snippet to your functions.php file:

// The first part //
add_filter('author_rewrite_rules', 'no_author_base_rewrite_rules');
function no_author_base_rewrite_rules($author_rewrite) {
    global $wpdb;
    $author_rewrite = array();
    $authors = $wpdb->get_results("SELECT user_nicename AS nicename from $wpdb->users");   
    foreach($authors as $author) {
        $author_rewrite["({$author->nicename})/page/?([0-9]+)/?$"] = 'index.php?author_name=$matches[1]&paged=$matches[2]';
        $author_rewrite["({$author->nicename})/?$"] = 'index.php?author_name=$matches[1]';
    }  
    return $author_rewrite;
}

// The second part //
add_filter('author_link', 'no_author_base', 1000, 2);
function no_author_base($link, $author_id) {
    $link_base = trailingslashit(get_option('home'));
    $link = preg_replace("|^{$link_base}author/|", '', $link);
    return $link_base . $link;
}

Props to WP-Snippet for this amazing tricks.

Detect And Redirect Android Users With .htaccess

Last night I shared a trick to redirect Android users to your Android/mobile website with a simple PHP snippet. It's time to do the same with .htaccess file. Android is the most used smart phone platform right now, and is a hot topic for developers.

Add this following code to your .htaccess file to redirect users with Android User Agent to a specific address:

RewriteCond %{HTTP_USER_AGENT} ^.*Android.*$
RewriteRule ^(.*)$ http://android.yourwebsite.com [R=301]

Detect And Redirect Android Users With PHP

Here is a simple trick to redirect Android users with some simple PHP script. It's a useful snippet if you have an Android version of your website.

Add following PHP to your document to search and redirect Android user agents:

$ua = strtolower($_SERVER['HTTP_USER_AGENT']);
if(stripos($ua,'android') !== false) { // && stripos($ua,'mobile') !== false) {
    header('Location: http://android.yourwebsite.com');
    exit();
}

More tricks like this are on their way...

Allow Contributors To Upload Images In WordPress

Are you running a WordPress website with bunch of contributors who are willing to post on your website? If yes then this article contains a great tip for you.

As I mention on previous articles, every post on your blog must contain at least one image related to the article. It's really great for SEO and other things.

This code will help us to allow users with contributor role to upload images on your WordPress site.

Add this code to your functions.php file:

if ( current_user_can('contributor') && !current_user_can('upload_files') )
     add_action('admin_init', 'allow_contributor_uploads');
    
     function allow_contributor_uploads() {
          $contributor = get_role('contributor');
          $contributor->add_cap('upload_files');
     }

How To Disable Smart/Curly Quotes In WordPress

There are lot of word processor programs which itself converts all yours simple quotes to curly quotes (aka s mart quotes). It looks like small figures six and nine raised above the baseline (like 6...9 and 66...99).

It's a huge problem if you're writing codes in your posts as WordPress automatically converts all quote symbols to smart quotes. So if anyone is copying a snippet from your blog post would have problems with running to code in their own text file.

You can easily disable this feature with a small snippet. Just add following snippet to your functions.php file:

<?php
remove_filter('the_content', 'wptexturize');
remove_filter('comment_text', 'wptexturize');
remove_filter('the_excerpt', 'wptexturize');
?>

That's it!

Send Email Notifications When User Submit A Post In WordPress

Are you running a multi-author WordPress blog or a blog with guest posters with contributor role to submit the post directly from the WordPress dashboard? Then you must be looking for a way to get email notification when someone submit a post or when you publish or reject their post.

We previously shares some great scripts to get email notifications for a couple of events, but this time it's a plugin.

WP Status Notifier is all you're looking for!

The plugin sends an email to the admin (or selected user) when ever some one submit a post for review and when you publish or reject their post, author will get instant emails. After installing the plugin, you can access it’s setting under Settings > Post Status Change Notifications.

WP Status Notifier's interface is not much complicated, as you can check it below:

It's a great plugin, but if you want some advance options, then you can also use Post Status Notifier Lite.

Personal Note: First of all, Eid-Mubharakh to all my Muslim readers. I'm going out on a small seven day trip tomorrow, so don't expect me to post any articles here on BWidgets. Thanks for all your support!

Prevent Directory Browsing With .htaccess

I recently shared several articles about .htaccess file, and as you may know by now, it's a great file if you're working on the security of your site. Today we'll disable the directory browsing in our website with some editing in .htaccess file.

You know how you can change a few characters in a URL and continue browsing the website. Sometimes, it could be very dangerous for our website, so it's time to prevent directory browsing.

Add following snippet to your .htaccess file:

# directory browsing
Options All -Indexes

Save the file, and that's it!

How To Remove Footer Credits From Jetpack Mobile Theme In WordPress

Jetpack is a great plugin for WordPress to connect your blog to WordPress.com. It also gives us dozens of crappy great plugins for our blog, such as mobile module, social share, wp.me short links, and more.

Jetpack's Mobile module is great plugin to create a mobile version of your website for mobile users, but it comes with a footer credit: Proudly powered by WordPress.

Giving WordPress their credit for their hard work is not bad, but if you're interested then you can easily remove the Jetpack.

In your file manager, edit footer.php file which can be found inside public_html/wp-content/plugins/jetpack/modules/minileven/theme/pub/minileven

Just remove this code from line #27:

<a href="<?php echo esc_url( __( 'http://wordpress.org/', 'jetpack' ) ); ?>" title="<?php esc_attr_e( 'Semantic Personal Publishing Platform', 'minileven' , 'jetpack'); ?>" rel="generator"><?php printf( __( 'Proudly powered by %s', 'minileven' , 'jetpack'), 'WordPress' ); ?></a>

That's it.

Protect Your wp-config.php File With .htaccess

As a webmaster, it's our duty to take care of our website. And security is our #1 priority when it comes to take care of a blog. As we know, there are millions of security issues with WordPress, which can be solved with some simple things, such as security plugins, configuring our .htaccess file, etc.

Today we'll secure our wp-config.php file with some basic .htaccess editing. Add following code to your .htaccess file:

<files wp-config.php>
order allow,deny
deny from all
</files>

This code should be placed in an .htaccess file located in the directory that contains your wp-config.php file.

Optimize And Repair WordPress Database

In WordPress 2.9, WordPress gave us a new automatic database repair feature. This feature enables you to repair and optimize your database. You should use this feature time to time to take care of your website's home.

You can use this feature even when you're not logged in to your website. This is because its main intent is to repair a corrupted database, Users can often not login to their WordPress when the database is corrupt.

Just add following snippet to your wp-config.php file to activate this feature:

define( 'WP_ALLOW_REPAIR', true );

Once activated, you can see the settings on this page: http://www.yoursite.com/wp-admin/maint/repair.php

Once you are done repairing and optimizing your database, make sure to remove this from your wp-config.php.

Send Email Notifications When User Role Changes In WordPress

Yesterday I shared a code which sends an email to the user when the user updates their profile. Today I have something similar, but a bit different. This code sends an email the user when the user's role has changed.

It's a great way to let a member know about the role changes that you'll make. It's also a great trick if you're running a WordPress site with bbPress forum or multiple wirters & contributors.

Just add following to your functions.php:

function user_role_update( $user_id, $new_role ) {
        $site_url = get_bloginfo('wpurl');
        $user_info = get_userdata( $user_id );
        $to = $user_info->user_email;
        $subject = "Role changed: ".$site_url."";
        $message = "Hello " .$user_info->display_name . " your role has changed on ".$site_url.", congratulations you are now an " . $new_role;
        wp_mail($to, $subject, $message);
}
add_action( 'set_user_role', 'user_role_update', 10, 2);

That's it.

Increase Maximum Upload File Size Limit In WordPress

Sometimes, you need to upload a large file to your site. If you run a WordPress site with audio podcasts, videos, and .zip files, then you may need to increase WordPress' default 32mb limit.

There are lot of ways around the internet to increase your WordPress max upload file size, but most of them are not much hardy. But a little snippet by Word Impressed can solve your problem. You can easily increase or decrease your maximum upload file size limit.

Create a php.ini file (using notepad document) and upload it into your /wp-admin/ folder and add following snippet into the file:

memory_limit = 32M
upload_max_filesize = 32M
post_max_size = 32M
file_uploads = On

You can change 32m in the above code to whatever max file size you want.

Send Email Notifications When User Profile Updates In WordPress

Adding this snippet to your functions.php file will send an email to the user when the user updates their profile. It's really great way to provide more security to your users. It's also a great trick if you're running a WordPress site with BuddyPress or bbPress. It makes your website look more advance, and keeps your user secure from hackers.

Just add following to your functions.php:

function user_profile_update( $user_id ) {
        $site_url = get_bloginfo('wpurl');
        $user_info = get_userdata( $user_id );
        $to = $user_info->user_email;
        $subject = "Profile Updated: ".$site_url."";
        $message = "Hello " .$user_info->display_name . "\nYour profile has been updated!\n\nThank you for visiting\n ".$site_url."";
        wp_mail( $to, $subject, $message);
}
add_action( 'profile_update', 'user_profile_update', 10, 2);

Restrict Access To WordPress Media Uploads

Ever wanted to restrict access WordPress media upload mime/format? Yes, that's why you guys are reading this post. You can perform this trick with directories such as /uploads/, /upgrade/, and /backups/. All you need a .htaccess file for the directory.

Create an .htaccess file for your /uploads/ directory (or use existing file if present). Add following code to the .htaccess file:

# restrict access to uploads directory
<Files ~ ".*\..*">
    Order Allow,Deny
    Deny from all
</Files>
<FilesMatch "\.(jpg|jpeg|jpe|gif|png|tif|tiff)$">
    Order Deny,Allow
    Allow from all
</FilesMatch>

The above code denies access to all files but only to the specified types of mime in the 6th line. You can also add more file types to the code such as .zip, .mp3, .mov, or anything.

You can also use same technique in other directories such as /upgrade/, /backup/, and more. Just create an .htaccess file in the directory and add the above code.

Add QR Code For Posts And Pages In WordPress

QR Code (Quick Response Code) is a great way to promote your content, and is very easy for users to use them. They can visit a webpage without even typing the entire web address. Just scan the QR Code and that's it.

The QR code system was invented in 1994 by Toyota's subsidiary, Denso Wave. Its purpose was to track vehicles during manufacture; it was designed to allow high-speed component scanning.[

Would you like to add a QR Code to your posts and pages in WordPress? It's easy just add the following snippet to your single.php file of your WordPress theme in the location you wish to display the QR.

<img src="http://api.qrserver.com/v1/create-qr-code/?size=100x100&data=<?php the_permalink(); ?>" alt="QR:  <?php the_title(); ?>"/>

To adjust the size of the QR Code just change the following within the src size=100×100.

How To Hide Post View And Post Preview Buttons From WordPress Post Editor

Ever wanted to remove "preview post" & "view post" option from the WordPress' post editor? Here is the solution how to do this. Just add following snippet to your theme's functions.php file and don't forget to update the post type array in the following code:

function posttype_admin_css() {
    global $post_type;
    $post_types = array(
                        /* set post types */
                        'post_type_name',
                        'post',
                        'page',
                  );
    if(in_array($post_type, $post_types))
    echo '<style type="text/css">#post-preview, #view-post-btn{display: none;}</style>';
}
add_action( 'admin_head-post-new.php', 'posttype_admin_css' );
add_action( 'admin_head-post.php', 'posttype_admin_css' );

How To Remove URL Field From WordPress Comment Form

For some WordPress sites, such as themes, review, and all, you may want to remove Website URL field from the WordPress' comment form. Removing the field could be used for product reviews or if they created a support tickets theme that does not require a url field.

It's not much hard to remove/unset the website url from the comment form. Just add following snippet to your functions.php file and it's done:

add_filter('comment_form_default_fields', 'unset_url_field');
function unset_url_field($fields){
    if(isset($fields['url']))
       unset($fields['url']);
       return $fields;
}

Change Post Color By Status In WordPress Admin Panel

It's a great trick if you manage a WordPress site with multiple writers/contributors.It's a great trick if you manage a WordPress site with multiple writers/contributors.

Adding this snippet to your theme's functions.php file will change the background colors of the post / page within the admin based on the current status. Draft, Pending, Published, Future, Private.

add_action('admin_footer','posts_status_color');
function posts_status_color(){
?>
<style>
.status-draft{background: #FCE3F2 !important;}
.status-pending{background: #87C5D6 !important;}
.status-publish{/* no background keep wp alternating colors */}
.status-future{background: #C6EBF5 !important;}
.status-private{background:#F2D46F;}
</style>
<?php
}

How To Login To WordPress Using Your Username Or Email Address

By default, WordPress only allows us to login to WordPress powered sites only with our username. But most of us prefer to enter our email address to login because remembering your email is more simple than usernames.

C. Bavota from bavotasan.com found a great way to allow your users to use either their username or email address to log into WordPress without any plugin. Just add following code to your functions.php file:

function login_with_email_address($username) {
    $user = get_user_by_email($username);
    if(!empty($user->user_login))
        $username = $user->user_login;
    return $username;
}
add_action('wp_authenticate','login_with_email_address');

Kevin Chard improved this trick by adding a snippet to it, which will change the text on the login page from “username” to “username / email.” Add following snippet to your functions.php just below the first code:

function change_username_wps_text($text){
       if(in_array($GLOBALS['pagenow'], array('wp-login.php'))){
         if ($text == 'Username'){$text = 'Username / Email';}
            }
                return $text;
         }
add_filter( 'gettext', 'change_username_wps_text' );

How To Change WordPress Author URL Slug

In WordPress, an author's profile is by default accessible by using the yoursite.com/author/name. But it's really easy to change the default author url slug/base. All be just need is a simple snippet.

Kevin Chard found a great code to change the default yoursite.com/author/name to yoursite.com/profile/name. Just add following snippet to your functions.php file:

add_action('init', 'cng_author_base');
function cng_author_base() {
    global $wp_rewrite;
    $author_slug = 'profile'; // change slug name
    $wp_rewrite->author_base = $author_slug;
}

Replace profile on line 4 by any slug you want.

Add Short URL Below Posts In WordPress Without Plugins

Previously I shared a post on this blog about adding a Short Link Widget Below Posts In Blogger, which is a great tutorial for Blogger admins. But I never shared anything like that for WordPress blogs. There are a lot of plugins to add this short link widget below your posts, but we're going to do this without any crappy plugin.

Plus, instead of going with one short link service, you can choose between two short links services. Both services are well known, and easy to use. These two short links services are tr.im and TinyURL.

Add Short URL Below Posts In WordPress:

Add one of the following two codes to your functions.php file:

For tr.im:

function getTrimUrl($url) { $tinyurl = file_get_contents("http://api.tr.im/api/trim_simple?url=".$url); return $tinyurl; }

For TinyURL:

function getTinyUrl($url) { $tinyurl = file_get_contents("http://tinyurl.com/api-create.php?url=".$url); return $tinyurl; }

After adding one of the above codes to your functions.php file, add following code in your single.php file, within the loop:

<?php $turl = getTinyUrl(get_permalink($post->ID)); echo 'Tiny Url for this post: <a href="'.$turl.'">'.$turl.'</a>' ?>

Above code is for a hyperlink style short link. You can also add a text box style widget with the following code:

<?php $turl = getTinyUrl(get_permalink($post->ID)); echo 'Tiny Url for this post: <input readonly="true" type="text" value="'.$turl.'"/>' ?>

Save your files, and That's IT!