Wednesday 29 May 2013

Adding Google Adsense Ads Into MobilePress


In past, I wrote an article about creating a mobile version of your WordPress site with MobilePress plugin. You can also earn some money with your MobilePress site by using Google Adsense or other mobile advertisement platforms, but lots of users get confused about how to add their advert code into their MobilePress template.

To be honest, it's pretty simple, but still not for first time. I'm also using Adsense on my site's mobile version at this link. Adsense mobile ads are only visible from mobile phones, not on your computer. Let's get started...

Create Adsense Mobile Ads Unit:

Your default Adsense ads are not perfect for your MobilePress powered site. You must create a mobile ads unit on your Adsense account. It's pretty simple...

  • 1. Login to your Adsense account > Click on My Ads tab
  • 2. Now in My Ads tab, click on Mobile content tab
  • 3. Now clck on New ad unit button


  • 4. Fill the following form with your ad preference and click on Save and get code:


  • 5. Copy your mobile ad code, and paste it into a blank notepad document


  • 6. Paste generated ad code into a notepad document and name it adsense.php
  • 7. Select All Files as file type
  • 8. Click on Save button to save adsense.php

The same thing goes for inmobi, buzzcity, admob and others, just copy the code to a notepad and save. Now we'll add this adsense.php file into your MobilePress theme.

Adding Ads Into MobilePress Theme:

Now you need to visit your ftp client or file manager. I'm using GoDaddy, and here is a preview of my file manager:


  • Upload this to public_html or webroot (based on your file manager)
  • Go to /public_html/wp-content/plugins/mobilepress/system/themes/default or /public_html/wp-content/mobilepress/themes/themename for custom theme.
  • Now if you want to place an advert at the top, you’ll have to edit header.php and insert the ad where you want it to display with following php:

<div class="aduity"><?php include('adsense.php'); ?></div>

  • If you need to show the ad unit at the footer, edit footer.php and paste that same code on the very first line or your preferred position..

That's it guys. Same work goes for all other mobile advert platforms. Don't ad more than three Adsense ads in your site. If you need any help, then don't forget to leave a comment.

Monday 27 May 2013

Easiest Way To Change WordPress Username


Update

There's one more way, which is way more easier and without a plugin, you can check it by clicking here.

Original Post:

Earlier this hour, I was reading an article on WPBeginner about changing your WordPress username using phpmyAdmin. It's a very great article, but it's not really a easy way. I like to take easy-way-out when it comes to change something on my site.

Come On, we're using WordPress, he got thousands of plugins to use them. So I'm here to discuss a really easy and one-minute way to change any WordPress username of your site. You must be site admin to use this way. You can check a screen shot of how to change username, in image above.

Ghost1227 created Username Changer, which is a really great plugin to change any username of your site. Username Changer is a simple plugin which allows administrators to change usernames of users on their sites. Admins can also change their own username.

How To Install Username Changer:

  • 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, just click on active.
  • Now visit this plugin's settings page (in user menu) and easily choose your desire username.

That's so damn easy! For any help or issues, please post your query in the comment section below...

Sunday 26 May 2013

Three Stylish Customized Blogger Contact Forms


Yesterday, I posted a couple of articles about Blogger's new contact form widgets. First, I showed you how to add this widget to your Blog's sidebar, then I showed you how to add this form to a specific page of your blog.

It's time for me to share three stylish customized designs for Blogger's new contact form widget. All three designs are coded with some really simple CSS, and they look really great on your blog's sidebar and pages.

First, I'll showcase three stylish designs with their CSS, then I'll show how to add them on your blog.

Design #1:


/*---- Custom Blogger Contact Form Style By BWidgets.com -----*/

#ContactForm1_contact-form-name, #ContactForm1_contact-form-email, #ContactForm1_contact-form-email-message {
padding: 9px;
border: solid 1px #E5E5E5;
outline: 0;
font: normal 13px/100% Verdana, Tahoma, sans-serif;
background: #FFFFFF;
background: -webkit-gradient(linear, left top, left 25, from(#FFFFFF), color-stop(4%, #EEEEEE), to(#FFFFFF));
background: -moz-linear-gradient(top, #FFFFFF, #EEEEEE 1px, #FFFFFF 25px);
box-shadow: rgba(0,0,0, 0.1) 0px 0px 8px;
-moz-box-shadow: rgba(0,0,0, 0.1) 0px 0px 8px;
-webkit-box-shadow: rgba(0,0,0, 0.1) 0px 0px 8px;
}

#ContactForm1_contact-form-email-message {
width: 245px;
height: 150px;
line-height: 150%;
}

#ContactForm1_contact-form-submit:hover, textarea:hover,
#ContactForm1_contact-form-submit:focus, textarea:focus {
border-color: #C9C9C9;
-webkit-box-shadow: rgba(0, 0, 0, 0.15) 0px 0px 8px;
-moz-box-shadow: rgba(0, 0, 0, 0.15) 0px 0px 8px;
}

#ContactForm1_contact-form-submit{
width: auto;
padding: 9px 15px;
background: #617798;
border: 0;
font-size: 14px;
color: #FFFFFF;
height:40px;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
}

Design #2:


/*---- Custom Blogger Contact Form Style By BWidgets.com -----*/

#ContactForm1_contact-form-name {
background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg1HpAaUCELV4K1-7UCQ99iut8yGa4FWQqg0o0rvFy1V8oigUlb1M1hmQfHy6NucIioVp1bKrkkeCASvBPso0OaFtCZwb3ZYpQmDb2n7496SULzX1SRMyC-WNQOMoMhplo882X6MnPdtAI/s1600/form_name.gif") no-repeat scroll 5px 50% rgb(255, 255, 255);
}

#ContactForm1_contact-form-email {
background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi8stcNavSUoBqa4LbJ4IehqTQeMHV0OCGKDdwydT6mcXss8MDOtFHJP_tLmYS23kM7NxA7Ujx2BOY6PRSRi9YkKqxWij13sDB_bWL9H-niqt0ya00VYsq_tqSq4ov6qVdq2HTbhxTM3F0/s1600/form_email.gif") no-repeat scroll 5px 50% rgb(255, 255, 255);
}

#ContactForm1_contact-form-email-message {
background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjHVDUB3LPRdSw2-jYwvT1cBiIEjmYq9N71BQFMMk2lj0UoPUHOR_6ZLqWgUBcNVWtSTUK7EDd3iOgI-3nj8ylkt9hRgRw3uE_RSa11F5SJRba-k0jkkFBgwcEZTE1SHIcBcdbw6D-SK_A/s1600/form_note.gif") no-repeat scroll 5px 6px rgb(255, 255, 255);
}

#ContactForm1_contact-form-name,#ContactForm1_contact-form-email, #ContactForm1_contact-form-email-message {
margin: 0px;
width: 250px;
border: 1px solid rgb(221, 221, 221);
padding: 3px 5px 3px 25px;
}

#ContactForm1_contact-form-submit {
margin-top: 5px;
padding: 5px;
width: 100px;
background-color: rgb(225, 77, 77);
background-image:none;
border: 1px solid rgb(57, 21, 21);
border-radius: 5px 5px 5px 5px;
color: rgb(255, 255, 255);
text-align: center;
font-weight: bold;
line-height: 48px;
text-transform: uppercase;
text-shadow: 0px 1px 0px rgb(0, 0, 0);
}

Design #3:


/*---- Custom Blogger Contact Form Style By BWidgets.com -----*/

#ContactForm1_contact-form-name,#ContactForm1_contact-form-email {
border-color: rgb(0, 0, 0);
border: 1px solid rgb(186, 186, 186);
padding: 4px 6px 6px 5px;
background-color: rgb(255, 255, 255);
outline: 0px none;
margin-right: 32px;
min-height: 32px;
position: relative;
-moz-box-sizing: border-box;
line-height: normal;
font-size: 100%;
margin: 0px;
vertical-align: baseline;
font-family: sans-serif;
}

#ContactForm1_contact-form-email-message {
border-color: rgb(0, 0, 0);
padding-right: 5px;
min-height: 100px;
width:265px;
border: 1px solid rgb(186, 186, 186);
padding: 4px 6px 6px 5px;
background-color: rgb(255, 255, 255);
outline: 0px none;
margin-right: 32px;
min-height: 32px;
position: relative;
-moz-box-sizing: border-box;
overflow: auto;
vertical-align: top;
font-size: 100%;
margin: 0px;
vertical-align: baseline;
font-family: sans-serif;
}

#ContactForm1_contact-form-submit {
background-image:none;
background-color: rgb(0, 130, 135);
color: rgb(255, 255, 255);
font-family: 'Segoe UI','Open Sans',Verdana,Arial,Helvetica,sans-serif;
font-weight: 400;
font-size: 14px;
line-height: 20px;
vertical-align: middle !important;
min-width: 90px;
min-height: 32px;
height: 32px;
border: 1px solid transparent;
color: white;
margin-right: 10px;
margin-top: 10px;
display: inline-block;
text-align: center;
cursor: pointer;
padding: 4px 10px;
position: relative;
outline: medium none;
border-radius: 0px 0px 0px 0px;
}

How To Add Custom Style To Contact Form:

Adding these custom CSS codes into your blog is pretty simple. Some of you are just going to leave this part, since they know how easy it really is. For those who don't know, here you go:

  • Go To Blogger > Template > Edit HTML
  • Search for ]]></b:skin>:
  • Add your favorite form's CSS above ]]></b:skin>
  • Save your template...That's IT!

That was pretty easy! If you're using one of these styles, then please let me know you favorite for future styles. You guys are free to share these styles with your friends and fans, just don't forget to give us credits for our hard work. You can also share your custom styles in the comment section below...

Saturday 25 May 2013

Solution Of bbPress Error: You do not have sufficient permissions to access this page


Earlier today, I tried to delete a forum from my bbPress, and before I could do so, it showed me following error with a white screen (maybe some grey too):

You do not have sufficient permissions to access this page

I was bit confused over this issues, so I tried to login again to my account. I'm not sure why this error is appearing. However, looks like a developer mode plugin is causing this error, atleast on my WP. I finally found a great and easy solution for this crazy error.

First of all, you can't blame Justin Bieber for this error, since he has nothing to do with your WordPress.

Solution:

First make sure that you are the current admin of your WP (not developer or anything). If it's still not working then try following:

Visit your WP plugin install page and install User Role Editor or you can download it by clicking here. Install and activate this plugin into your WordPress.

Now visit this plugin's settings page (in user menu) and click on reset button to reset all user's capabilities to default. Don't worry, you will not lose any user data. Now visit bbPress and get started with your forum.

Let me know if it worked for you, as this worked for me and lot of other users.

Adding Blogger Contact Form Into Static Page


Earlier today, I posted an article about Blogger's official Contact Form gadget at this link. This contact form is amazingly customizable. You can also add this form into your blog's static page or post with some simple steps. It's a great way to get rid of some extra forms in your drive. You can check this Contact Form in action by clicking here.

I'm going to finish this tutorial really quick, since I'm posting it second time. First post was not save due to an error. It was a huge post, so I'm not going to write it again :'(

Add Contact Form To Your Blog:

You can add this contact form into your blog's sidebar by reading this tutorial. Note: You must have this gadget on your sidebar to add this to your static page.

Hiding Contact Form From Your Sidebar:

Now you must hide this gadget from your site, so it'll only be available on your site's contact page. Here we go:

  • Go To Blogger > Template > Edit HTML
  • Search and paste this code just about ]]></b:skin>:

#ContactForm1{
display: none ! important;
}

Save your template. Now time for final step:

Adding Contact Form To A Static Page:

I'm going to finish this real quick, here we go:

  • Go To Blogger > Posts
  • Click on New Page and select Blank Page
  • Now in your blank page, click on HTML option to switch to html editor mode
  • Now paste following code and publish or update your page:

<form name='contact-form'>
<p></p>
Name<br />
<input class='contact-form-name' id='ContactForm1_contact-form-name' name='name' size='30' value='' type='text' />
<p></p>
Email
<span style='font-weight: bolder;'>*</span><br />
<input class='contact-form-email' id='ContactForm1_contact-form-email' name='email' size='30' value='' type='text' />
<p></p>
Message<span style='font-weight: bolder;'>*</span><br />
<textarea class='contact-form-email-message' cols='25' id='ContactForm1_contact-form-email-message' name='email-message' rows='5'></textarea>
<p></p>
<input class='contact-form-button contact-form-button-submit' id='ContactForm1_contact-form-submit' value='Send' type='button' />
<p></p>
<div style='text-align: center; max-width: 222px; width: 100%'>
<p class='contact-form-error-message' id='ContactForm1_contact-form-error-message'></p>
<p class='contact-form-success-message' id='ContactForm1_contact-form-success-message'></p>
</div>
</form>

That's it! Don't forget to comment. You all are free to share this post on your blog, but don't forget to give us credits for out work.

Adding Contact Form Widget To Blogger

Blogger has launched a new amazing contact form widget for all of us. I'm using Google Drive contact form to receive all messages, but I'll use this widget soon on my blog. It's a great and must use widget for all blogs.

This widget was first discovered in Blogger's stylesheet by our friend at Stylify Your Blog. This new gadget release comes with the recent updates announced Google I/O 2013 and it looks like Blogger is still a integral part of the Google's Product line.

Features Of Blogger Contact Form:

  • Stylish AJAX form with Google UI.
  • Sending simple text messages.
  • Custom CSS supported. 
  • Message will be delivered right into your inbox.
  • No need of any third-party service.
  • Plain text messages without any attachments.

Adding Contact Form To Blogger:

  • Go To Blogger > Layout > Add A Gadget > More Gadgets


  • Choose Contact Form gadget
Give it a suitable name, and click on save to add this gadget. That's IT!!!

This widget is awesome. However, Google Docs form has more features - like, drop down list, additional fields, select field, more.

In future, I'll tell you how to use this widget on your pages, and also how to customize this widget with some magical CSS.

Tuesday 21 May 2013

Delete Old Post Revision In WordPress

Post Revisions are a feature introduced in WordPress 2.6. Whenever you or WordPress saves or drafts a post or a page, a revision of that version is automatically stored in your database. Each revision will slowly increase the size of your database. WordPress.com will store the last 25 revisions for each post.

For example, if you have 1 post and it has 10 revisions you could be storing up to 10 copies of older or unused data in your database, which will increase the size of your database for sure. You can learn more about Post Revisions by clicking here.

Now we know that these useless post revisions are just wasting our space. You can't delete these revisions manually, but the oldest revision is automatically deleted if there are more than 25 revisions.

Delete Post Revisions:

Delete Post Revisions is a great plugin to delete all useless post revisions off your database. It is compatible with the latest version of WordPress (3.x). It's coded by me, so don't forget to rate this plugin.

Here is the original description of Delete Post Revisions:

We created a tool which helps you to remove useless post revisions from your database.

Installing Delete Post Revisions:

  • 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, just click on active.

After installing, a new option will appear under the Settings tab. Not here is how to delete old post revisions:

  • Visit Settings > Delete Post Revisions
  • In the bottom, click on "Start" button and it's all done.

WordPress’ database queries don't retrieve revisions, so the number of revisions has no effect on the queries, but it's a great way of keeping your database clean. The only time the revisions are retrieved is on the edit page of the individual post.

Wednesday 15 May 2013

AJAXify Your WordPress Comments

In previous posts, I shared several AJAX tutorial, which were awesome. In this tutorial, I'll show how to AJAXify your default WP comment  system. It's a great must use tutorial.

AJAX comment enables you and your readers to post and reply to comment instantly without refreshing the page. It saves a lot of time and users are more likely to comment. You can check a live demo by clicking here.

I prefer to use Disqus comment box on my sites, but unfortunately Disqus doesn't works with BuddyPress. I'm not the only person who is facing this problem. I was so disappointment when I had to choose default WP comment box, since it reloads on every activity. So, I found a great plugin to AJAXify my default WP comment box.

To AJAXify your WordPress comments, there is a great plugin call wp-comment-master. Below is official description of this plugin:

an elegant and must-have comment plugin to better satisfy your visitors, it has two main features: AJAX comment posting and comment paginitaion.


Installing wp-comment-master:

  • 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, just click on active and it's done...

Don't forget to leave a comment...

Sunday 12 May 2013

Easiest Way To Remove WordPress Logo From Admin Bar


Today, I'm going to share the easiest way to remove this annoying WordPress logo/links from your admin bar without using any plugin.

Last month, I tried to remove this whole WP logo menu from my site by editing those hard php files, and I was successful in it. But it was a temporary success, because soon I saw an error message on my dashboard.

Now, let me share two simple ways to remove that annoying thing from your admin bar.

Easiest Way: By Using CSS:

It's funny, but you can also remove that logo menu by adding display:none; CSS property. I know some of you guys are screwed up over this fact. Let me show you how. I'm using this CSS hack on this WP site.

  • Visit your File Manager or FTP from your hosting provides. Mine is from GoDaddy, which looks something like this:


  • Now in your file manger, visit webroot/wp-includes/css/admin-bar.min.css
  • In admin-bar.min.css, add following css code:

li#wp-admin-bar-wp-logo.menupop{display:none;}

  • Save/Update your admin-bar.min.css file and that's it.

Important: You may have to clear your browser's cache to see this change or you can use private window to see this simple css hack.

By Using php:

If you're not satisfied with our css hack, then you can also use php snippet to hide this menu list. Credits for this snippet goes to WP-Snippets.

  • Add this code to your functions.php file to remove the WordPress logo on admin bar:

<?php
function annointed_admin_bar_remove() {
        global $wp_admin_bar;

        /* Remove their stuff */
        $wp_admin_bar->remove_menu('wp-logo');
}

add_action('wp_before_admin_bar_render', 'annointed_admin_bar_remove', 0);
?>

That's it...Don't forget to leave a comment.

Saturday 11 May 2013

Bulk Delete WordPress Users Based On Their Role


Owning a blog with public registration is a huge mess, especially with all those nasty spammers. It's really hard to get rid of all those nasty spammers. In future, I'll share a very effective way to get rid of all future spam users, but first it's important to delete existing spam users. For that we have to delete all public registered accounts.

You can also use this tutorials for any other thing, since it's always not about spammers. Instead of deleting users of a specific role one-by-one, you can bulk delete them. As always, "Bulk Is Better" - Hardeep Asrani (Me)

As I know, there are five different roles in WordPress, which are admins, developers, authors, editors, contributors and subscribers. You can easily delete users of any of these roles easily by running a very simple code.

How To Bulk Delete All Users Based On Their Role:

  • Go to your WP Dashboard > Appearance > Editor
  • Open the functions.php file from the right sidebar.
  • Add the following lines of code (based on user role) to your functions.php file and publish.

Codes For User Roles:

For Admin:

function remove_administrators() {
    global $wpdb;
    $args = array( 'role' => 'Administrator' );
    $administrators = get_users( $args );
    if( !empty($administrators) ) {
        require_once( ABSPATH.'wp-admin/includes/user.php' );
        $i = 0;
        foreach( $administrators as $administrator ) {
            if( wp_delete_user( $administrator->ID ) ) {
                $i++;
            }
        }
        echo $i.' Administrators deleted';
    } else {
        echo 'No Administrators deleted';
    }
}
remove_administrators();

For Developers:

function remove_developers() {
    global $wpdb;
    $args = array( 'role' => 'Developer' );
    $developers = get_users( $args );
    if( !empty($developers) ) {
        require_once( ABSPATH.'wp-admin/includes/user.php' );
        $i = 0;
        foreach( $developers as $developer ) {
            if( wp_delete_user( $developer->ID ) ) {
                $i++;
            }
        }
        echo $i.' Developers deleted';
    } else {
        echo 'No Developers deleted';
    }
}
remove_developers();

For Authors:

function remove_authors() {
    global $wpdb;
    $args = array( 'role' => 'Author' );
    $authors = get_users( $args );
    if( !empty($authors) ) {
        require_once( ABSPATH.'wp-admin/includes/user.php' );
        $i = 0;
        foreach( $authors as $author ) {
            if( wp_delete_user( $author->ID ) ) {
                $i++;
            }
        }
        echo $i.' Authors deleted';
    } else {
        echo 'No Authors deleted';
    }
}
remove_authors();

For Editors:

function remove_editors() {
    global $wpdb;
    $args = array( 'role' => 'Editor' );
    $editors = get_users( $args );
    if( !empty($editors) ) {
        require_once( ABSPATH.'wp-admin/includes/user.php' );
        $i = 0;
        foreach( $editors as $editor ) {
            if( wp_delete_user( $editor->ID ) ) {
                $i++;
            }
        }
        echo $i.' Editors deleted';
    } else {
        echo 'No Editors deleted';
    }
}
remove_editors();

For Contributors:

function remove_contributors() {
    global $wpdb;
    $args = array( 'role' => 'Contributor' );
    $contributors = get_users( $args );
    if( !empty($contributors) ) {
        require_once( ABSPATH.'wp-admin/includes/user.php' );
        $i = 0;
        foreach( $contributors as $contributor ) {
            if( wp_delete_user( $contributor->ID ) ) {
                $i++;
            }
        }
        echo $i.' Contributors deleted';
    } else {
        echo 'No Contributors deleted';
    }
}
remove_contributors();

For Subscribers:

function remove_subscribers() {
    global $wpdb;
    $args = array( 'role' => 'Subscriber' );
    $subscribers = get_users( $args );
    if( !empty($subscribers) ) {
        require_once( ABSPATH.'wp-admin/includes/user.php' );
        $i = 0;
        foreach( $subscribers as $subscriber ) {
            if( wp_delete_user( $subscriber->ID ) ) {
                $i++;
            }
        }
        echo $i.' Subscribers deleted';
    } else {
        echo 'No Subscribers deleted';
    }
}
remove_subscribers();

For None:

There is also a role in WordPress called "none." Here is the code to bulk delete users with "none" rule. I'm not 100% about this code, so please leave a comment if it's working:

function remove_noroleusers() {
    global $wpdb;
    $args = array( 'meta_key' => 'wp_capabilities','meta_value' => 'a:0:{}','meta_compare' => '=') ;
    $noroleusers = get_users( $args );
    if( !empty($noroleusers) ) {
        require_once( ABSPATH.'wp-admin/includes/user.php' );
        $i = 0;
        foreach( $noroleusers as $noroleuser ) {
            if( wp_delete_user( $noroleuser->ID ) ) {
                $i++;
            }
        }
        echo $i.' Users deleted';
    } else {
        echo 'No Users deleted';
    }
}
remove_noroleusers();

Final Step:

Once you have went to your site go back to your functions file and remove the code. Don't forget to leave a comment.

Popular Posts

 
Powered by Blogger.