Monday 30 September 2013

How To Create A Custom Dashboard Widgets In WordPress


Earlier this hour I was surfing thru WordPress' official codex website and I found something very interesting to write about. Okay! I know you guys are so exited about this great trick.

The Dashboard Widgets API (added in WP 2.7) makes it very simple to add new widgets to the administration dashboard. It only takes a few minutes to create a simple dashboard widget for your blogger. It can be a great way to make your plugin and themes even more useful.

How To Create A Custom Dashboard Widgets:

 This code would go in one of your plugin's files, or in your theme's functions.php:

/**
 * Add a widget to the dashboard.
 *
 * This function is hooked into the 'wp_dashboard_setup' action below.
 */
function example_add_dashboard_widgets() {

    wp_add_dashboard_widget(
                 'example_dashboard_widget',         // Widget slug.
                 'Name of your widget',          // Title.
                 'example_dashboard_widget_function' // Display function.
        );   
}
add_action( 'wp_dashboard_setup', 'example_add_dashboard_widgets' );

/**
 * Create the function to output the contents of our Dashboard Widget.
 */
function example_dashboard_widget_function() {

    // Display whatever it is you want to show.
    echo "<p>Welcome to BWidgets! Need help? Contact the developer <a href="mailto:yourusername@gmail.com">here</a>.</p>";

That's it! Red part in the above code is the title and content area of our widget. Don't forget to leave a comment if you need any help with this tutorial.

Friday 27 September 2013

How To Add Extra Fields To WordPress User Profile Page


Yesterday I post an article about removing some extra fields (AIM, Yahoo IM, and Jabber) from WordPress' user profile page area. It's time to dig even more deeper into this trick. It's time for us to learn about adding some extra fields to user profile page.

The code below will show you how to add additional Twitter and Facebook fields, but you can use it to add any other field that you like. Add following php code to your theme's functions.php file (from theme editor):

function my_new_contactmethods( $contactmethods ) {
// Add Twitter
$contactmethods['twitter'] = 'Twitter username (withour @';
//add Facebook
$contactmethods['facebook'] = 'Facebook';
return $contactmethods;
}
add_filter('user_contactmethods','my_new_contactmethods',10,1);


That's it.

Thursday 26 September 2013

How To Stop Users With AdBlock In Blogger/WordPress


Don't you hate it when a crappy extension is blocking you from getting the payoff of your hard work that you put on your blog? Not sure about you, but I really really hate that. More than AJ Styles-Dixie Carter's TNA Promo that I'm watching right now, it's good. Okay, it was a creative way to end the show.

Back to topic. Antiblock.org found a great script to stop users with AdBlock from viewing your website. Don't forget to check and support their awesome project. There is no bad in stopping users with AdBlock from viewing your site because we blogger needs to earn as much as we can for our hard work. It's not easy to run and manage a full time blog without revenues from ads. Here is how to do it:

Stop Users With AdBlock In Blogger/WordPress/HTML:

First of all, you can also use this script on any other blogging/site platform. It works everywhere, even on a HTML page.

For Blogger:

  • Visit Blogger > Template > Edit HTML.
  • Press Ctrl + F and search for ]]></b:skin> and paste below code above it:

#g207{position:fixed!important;position:absolute;top:0;top:expression((t=document.documentElement.scrollTop?document.documentElement.scrollTop:document.body.scrollTop)+"px");left:0;width:100%;height:100%;background-color:#fff;opacity:0.9;filter:alpha(opacity=90);display:block}#g207 p{opacity:1;filter:none;font:bold 16px Verdana,Arial,sans-serif;text-align:center;margin:20% 0}#g207 p a,#g207 p i{font-size:12px}#g207 ~ *{display:none}

  • Now press Save Template.
  • Now navigate to Blogger > Layout > Add Gadget, Click on HTML/JavaScript Gadget.
  • Paste the below code into it and press Save.

<script>(function(w,u){var d=w.document,z=typeof u;function g207(){function c(c,i){var e=d.createElement('i'),b=d.body,s=b.style,l=b.childNodes.length;if(typeof i!=z){e.setAttribute('id',i);s.margin=s.padding=0;s.height='100%';l=Math.floor(Math.random()*l)+1}e.innerHTML=c;b.insertBefore(e,b.childNodes[l-1])}function g(i,t){return !t?d.getElementById(i):d.getElementsByTagName(t)};function f(v){if(!g('g207')){c('<p>Please disable your ad blocker!<br/>This site is supported by the advertisement <br/> Please disable your ad blocker to support us!!! </p>','g207')}};(function(){var a=['Adrectangle','PageLeaderAd','ad-column','advertising2','divAdBox','mochila-column-right-ad-300x250-1','searchAdSenseBox','ad','ads','adsense'],l=a.length,i,s='',e;for(i=0;i<l;i++){if(!g(a[i])){s+='<a id="'+a[i]+'"></a>'}}c(s);l=a.length;for(i=0;i<l;i++){e=g(a[i]);if(e.offsetParent==null||(w.getComputedStyle?d.defaultView.getComputedStyle(e,null).getPropertyValue('display'):e.currentStyle.display)=='none'){return f('#'+a[i])}}}());(function(){var t=g(0,'img'),a=['/adaffiliate_','/adops/ad','/adsales/ad','/adsby.','/adtest.','/ajax/ads/ad','/controller/ads/ad','/pageads/ad','/weather/ads/ad','-728x90-'],i;if(typeof t[0]!=z&&typeof t[0].src!=z){i=new Image();i.onload=function(){this.onload=z;this.onerror=function(){f(this.src)};this.src=t[0].src+'#'+a.join('')};i.src=t[0].src}}());(function(){var o={'http://pagead2.googlesyndication.com/pagead/show_ads.js':'google_ad_client','http://js.adscale.de/getads.js':'adscale_slot_id','http://get.mirando.de/mirando.js':'adPlaceId'},S=g(0,'script'),l=S.length-1,n,r,i,v,s;d.write=null;for(i=l;i>=0;--i){s=S[i];if(typeof o[s.src]!=z){n=d.createElement('script');n.type='text/javascript';n.src=s.src;v=o[s.src];w[v]=u;r=S[0];n.onload=n.onreadystatechange=function(){if(typeof w[v]==z&&(!this.readyState||this.readyState==="loaded"||this.readyState==="complete")){n.onload=n.onreadystatechange=null;r.parentNode.removeChild(n);w[v]=null}};r.parentNode.insertBefore(n,r);setTimeout(function(){if(w[v]!==null){f(n.src)}},2000);break}}}())}if(d.addEventListener){w.addEventListener('load',g207,false)}else{w.attachEvent('onload',g207)}})(window);</script>

That's it!

For WordPress:

It's all same for WordPress. Just add following CSS & JavaScript code to your WordPress template:

CSS:

#g207{position:fixed!important;position:absolute;top:0;top:expression((t=document.documentElement.scrollTop?document.documentElement.scrollTop:document.body.scrollTop)+"px");left:0;width:100%;height:100%;background-color:#fff;opacity:0.9;filter:alpha(opacity=90);display:block}#g207 p{opacity:1;filter:none;font:bold 16px Verdana,Arial,sans-serif;text-align:center;margin:20% 0}#g207 p a,#g207 p i{font-size:12px}#g207 ~ *{display:none}

JavaScript:

<script>(function(w,u){var d=w.document,z=typeof u;function g207(){function c(c,i){var e=d.createElement('i'),b=d.body,s=b.style,l=b.childNodes.length;if(typeof i!=z){e.setAttribute('id',i);s.margin=s.padding=0;s.height='100%';l=Math.floor(Math.random()*l)+1}e.innerHTML=c;b.insertBefore(e,b.childNodes[l-1])}function g(i,t){return !t?d.getElementById(i):d.getElementsByTagName(t)};function f(v){if(!g('g207')){c('<p>Please disable your ad blocker!<br/>This site is supported by the advertisement <br/> Please disable your ad blocker to support us!!! </p>','g207')}};(function(){var a=['Adrectangle','PageLeaderAd','ad-column','advertising2','divAdBox','mochila-column-right-ad-300x250-1','searchAdSenseBox','ad','ads','adsense'],l=a.length,i,s='',e;for(i=0;i<l;i++){if(!g(a[i])){s+='<a id="'+a[i]+'"></a>'}}c(s);l=a.length;for(i=0;i<l;i++){e=g(a[i]);if(e.offsetParent==null||(w.getComputedStyle?d.defaultView.getComputedStyle(e,null).getPropertyValue('display'):e.currentStyle.display)=='none'){return f('#'+a[i])}}}());(function(){var t=g(0,'img'),a=['/adaffiliate_','/adops/ad','/adsales/ad','/adsby.','/adtest.','/ajax/ads/ad','/controller/ads/ad','/pageads/ad','/weather/ads/ad','-728x90-'],i;if(typeof t[0]!=z&&typeof t[0].src!=z){i=new Image();i.onload=function(){this.onload=z;this.onerror=function(){f(this.src)};this.src=t[0].src+'#'+a.join('')};i.src=t[0].src}}());(function(){var o={'http://pagead2.googlesyndication.com/pagead/show_ads.js':'google_ad_client','http://js.adscale.de/getads.js':'adscale_slot_id','http://get.mirando.de/mirando.js':'adPlaceId'},S=g(0,'script'),l=S.length-1,n,r,i,v,s;d.write=null;for(i=l;i>=0;--i){s=S[i];if(typeof o[s.src]!=z){n=d.createElement('script');n.type='text/javascript';n.src=s.src;v=o[s.src];w[v]=u;r=S[0];n.onload=n.onreadystatechange=function(){if(typeof w[v]==z&&(!this.readyState||this.readyState==="loaded"||this.readyState==="complete")){n.onload=n.onreadystatechange=null;r.parentNode.removeChild(n);w[v]=null}};r.parentNode.insertBefore(n,r);setTimeout(function(){if(w[v]!==null){f(n.src)}},2000);break}}}())}if(d.addEventListener){w.addEventListener('load',g207,false)}else{w.attachEvent('onload',g207)}})(window);</script>

That's it. You can also use this plugin to stop users with AdBlock with some extra options.

After adding above listed code your blog will look something like this:

Image courtesy of HackingUniversity.in

How To Remove User Contact Info From WordPress Profile Page


After writing bunch of articles about WordPress' wp-config.php file, it's time for me to write some articles about the powerful functions.php file. And I'll start from the start. In this post, I'm sharing a very simple and useful trick for WordPressers (WordPressers :p).

Most of us never ever used three fields on the WordPress profile page and so we want to remove those fields. They are the fields for AIM, Yahoo IM, and Jabber. It's time to get rid of these fields:

Add following php code to your theme's functions.php file (from theme editor):

add_filter('user_contactmethods','hide_profile_fields',10,1);
function hide_profile_fields( $contactmethods ) {
unset($contactmethods['aim']);
unset($contactmethods['jabber']);
unset($contactmethods['yim']);
return $contactmethods;
}


That's it..!!

Wednesday 25 September 2013

How To Change The Default WordPress Media Uploads Folder


I'm really loving all the wp-config.php tricks. We can do so much amazing stuff with just some little codes.

Before WordPress 3.5 you used to be able to change the upload directory path from the Settings menu in the dashboard. However, now you can't do anything like that from the settings option, but it’s still possible.

How to Change The Default WordPress Media Uploads Folder:

Open wp-config.php (located in root of WordPress installation) and add following code before the line that says require_once(ABSPATH.’wp-settings.php’);.

define( 'UPLOADS', 'wp-content/custom-path' );

Change wp-content/custom-path with your custom upload path. For example, you can can change it to wp-content/files. Don't forget to add the code before require_once(ABSPATH.’wp-settings.php’);.

Thursday 19 September 2013

3 Ways To Disable WordPress AutoSave


This is my second post of the day here on BWidgets, and it's also about Daniel Bryan wp-config.php file and WordPress AutoPost. This time I'll show you one three ways to disable WordPress AutoSave feature.

When editing a post, the changes you make are automatically saved every 2 minutes. You can also use our last trick to Modify AutoSave Interval.

By Editing wp-config.php File:

This is the easiest way to disable WordPress AutoSave feature. To modify autosave interval simply open wp-config.php (located in root of WordPress installation) and add following code to the end of file:

define('AUTOSAVE_INTERVAL', 86400);

We've set WordPress AutoSave interval to 86400 seconds which is an entire day. So this effectively disables the autosave functionality. Thanks to Jacob Nicholson for the idea.

By Editing post.php File:

This is the smartest way to disable AutoSave feature without any heavy codes. Thanks to Shane G. for sharing this trick on a WordPress forum.

  • Open your wp-admin/post.php file and wp-admin/post-new.php files.
  • You will find this line of code there:

wp_enqueue_script('autosave');

  • Add // to the beginning of this code. It'll look something like this:

// wp_enqueue_script('autosave');

The AutoSave option will be disabled for your existing and new posts.

By Editing functions.php File:

Last but not the least. This is the most preferred way to disable this feature, as we don't have to re-edit our post.php and post-new.php file after every WordPress update, nor we have to adjust AutoSave interval. This trick will simple disable AutoSave feature. Thanks to Egill R. Erlendsson for sharing this trick on a WordPress forum.

Simple throw this in your functions.php file:

add_action( 'admin_init', 'disable_autosave' );
function disable_autosave() {
        wp_deregister_script( 'autosave' );
}

That's it folks. Thanks for all amazing guys that I mentioned on the article for sharing these amazing tricks around the internet. Don't forget to give us a backlink if you're sharing this article on your blog.

Modify WordPress AutoSave Interval


Here we're again! Another post about my favorite Pokemon WordPress core file. YES! YES! YES, this post is also about Daniel Bryan wp-config.php file.

When editing a post, the changes you make are automatically saved every 2 minutes. It seems bit weird, but you can actually change the setting for longer delays in between auto-saves, or decrease the setting to make sure you never lose changes.

And we don't need a crappy plugin for this simple hack. Technically, it's not even a hack, but a simple option described in original WordPress codex.

Modify WordPress AutoSave Interval:

To modify autosave interval simply open wp-config.php (located in root of WordPress installation) and add following code to the end of file:

define('AUTOSAVE_INTERVAL', 160 );  // seconds

Replace 160 with your custom autosave interval (in seconds).

Save your config.php file & that's it!

Friday 13 September 2013

How To Disable Or Limit WordPress Post Revisions

Post Revisions are a feature introduced in WordPress 2.6. A revision is automatically stored in your database, whenever you save or draft a post or a page. Earlier this year, I posted an article about Deleting Old WordPress Post Revisions at this link.

Today we're going to learn a very simple tweak to disable or limit WordPress post revisions without installing any crappy plugin, which saves a lot of space. We just have to add a little snippet to your our config.php file.

Limit WordPress Post Revisions:

To limit Post revisions simply open wp-config.php (located in root of WordPress installation) and add following code to the end of file:

define('WP_POST_REVISIONS', 3);

Replace 3 with maximum number of Post revisions per post/page.

Disable WordPress Post Revisions:

To disable Post revisions simply open wp-config.php (located in root of WordPress installation) and add following code to the end of file:

define('WP_POST_REVISIONS', false );

 Save your config.php file & that's it!

Monday 9 September 2013

Editing WordPress wp-config.php File


Editing WordPress core files is a very risky and hard job, especially for WordPress beginners like me. Yea, I'm using WordPress only from last four months, but I have learned a lot from it.

The wp-config.php file is one of the most important files in WordPress. It contains the login information for WordPress to connect to your database as well as table prefix, secret keys, e.t.c. Editing wp-config.php file is very easy, but this file looks a bit scary so beginners usually keeps themselves away from it.

If you installed WordPress using your hosting provider's install wizard, then wp-config.php file will be in your root directory. If you installed WordPress using FTP, then you can find wp-config.php (named as wp-config-sample.php) file in your WordPress download. Don't forget to rename wp-config-sample.php to wp-config.php.

Adding Database Info:

To change the wp-config.php file for your installation, you will need this information:

Database Name
Database Name used by WordPress
Database Username
Username used to access Database
Database Password
Password used by Username to access Database
Database Host
The hostname of your Database Server. A port number, Unix socket file path or pipe may be needed as well. 

Find following lines in your wp-config.php file:

define( 'DB_NAME',     'database_name_here' );
define( 'DB_USER',     'username_here' );
define( 'DB_PASSWORD', 'password_here' );
define( 'DB_HOST',     'localhost' );

It's not that hard. We just have to replace above text with our database's info.

Set Database Name:

Replace 'database_name_here', with the name of your database, e.g. MyDatabaseName.

define( 'DB_NAME', 'MyDatabaseName' );

Set Database User:

Replace 'username_here', with the name of your username e.g. MyUserName.

define( 'DB_USER', 'MyUserName' );

Set Database Password:

Replace 'password_here', with the your password, e.g. MyPassWord.

define( 'DB_PASSWORD', 'MyPassWord' );

Set Database Host:

Replace 'localhost', with the name of your database host, e.g. MyDatabaseHost.
define( 'DB_HOST', 'MyDatabaseHost' );

That's it for this part. Now we have to follow one simple step to complete our wp-config.php file.

Adding Secret Keys:

Now we just have to add some unique keys to our wp-config.php file. Find following in your wp-config.php file:

define( 'AUTH_KEY',         'put your unique phrase here' );
define( 'SECURE_AUTH_KEY',  'put your unique phrase here' );
define( 'LOGGED_IN_KEY',    'put your unique phrase here' );
define( 'NONCE_KEY',        'put your unique phrase here' );
define( 'AUTH_SALT',        'put your unique phrase here' );
define( 'SECURE_AUTH_SALT', 'put your unique phrase here' );
define( 'LOGGED_IN_SALT',   'put your unique phrase here' );
define( 'NONCE_SALT',       'put your unique phrase here' );

Put your unique keys in above spaces. You don't have to remember the keys, just make them long, random and complicated. You can change these keys at any time. You can also use WordPress' online generator to automatically generate these keys for you.

These secret key protects your site from getting hacked. A password like "password" or "facebook" is simple and easily broken. A random password such as "w<$4c$aPHmd%/*]`Oom>(hpdXW|0M=X={we6;Mphvtg+V.o<$|#_}qG(GaVDEsn,~*4i')" takes years to come up with the right combination.

That's it for this time. Now after adding/editing above details, your wp-config.php file is ready for some action. You can now save/update the file to your file manager's root directory to see it in action.

Saturday 7 September 2013

How To Embed Facebook Posts To Your Blog



Update (7/9/13):

Facebook recently announced their official plugin to embed public statuses, photos and more. It has more feature than the outdated article version. You can easily get your embed code by visiting this page.

Getting The Embed Code From A Post:

You can also get the embed code directly from the post itself.  Only public posts from Facebook Pages and profiles can be embedded. Choose 'Embed Post' from the drop down menu that appears. You will get the embed code for the post.



Original Article (9/13/13):

There are bunch of Facebook widgets to embed like buttons, like boxes, subscribe buttons, and more. But there is no way to embed a status, photo, link or video directly from Facebook to your blog. Twitter tweets always have an option to easily embed any Tweet to your blog, website, or any html document.

By embedding a status, you can easily display a status on your website, without editing any bit of it. It's really helpful in displaying images on your blog, without uploading them into your blog. It was helpful for me in this post.

How To Embed A Facebook Status:

Tired of taking screen grabs of Facebook posts? SocialDitto makes it easy to embed a Facebook status update into any article or blog. You can easily grab your embed code in less than a minute by visiting SocialDitto. It's free, safe, easy, and quick. Don't forget to leave a comment.

You can check our live demo below:
Hardeep Asrani
Eminem & The Undertaker... -_-

Popular Posts

 
Powered by Blogger.