You probably guessed that these would be WordPress plugins if you don’t need to know how to code. While you do not want to run an over abundance of plugins on your WordPress site, a handful of plugins won’t slow down your site.

1. Drop Caps

Sites covering certain topics might need to have a fancier look to them. For example, a site about web design would likely have a more well designed and detailed look than a site about animal chew toys. In this case adding what is known as a Drop Cap will make the writing a little classier looking.

A Drop Cap adds a large first letter in the first word if the first paragraph on the page. I am sure you have seen something like this in your travels around the web. The Drop Caps plugin lets you choose where you want the Drop Cap to show up (i.e. only on single blog posts, archive pages, feed, etc.)

2. Simple Pull Quote

Personally, I like when sites accentuate important parts of an article I’m reading. I can scan the article and see if I want to take the time to read it thoroughly. Using a Pull Quote can add a nice addition to headers and bullet points.

Adding a Pull Quote is super easy. When the plugin is installed and activated, you can highlight the text you want to show up in the quote and click the new button in your WordPress text editor. Alternatively, you can add [pullquote] highlighted text here  [/pullquote] around the text to get the same effect.

3. Readability

One of the things that separates one site from another is how easy it is to read. Text, distracting ads and other elements of your site can take away from the readability of the content. What the Readability plugin does is lets the reader click a link to see the article in a lightbox-like popup window.

There aren’t a lot of adjustments to the Readability plugin. You can adjust what displays as the name of the link on your page and the minimum word count on the single page for the link to appear.

4. WP Google Fonts

Adding a font to WordPress isn’t the easiest thing to do. And let’s face it, the choices are kinda lame in most themes. Using the WP Google Fonts plugin, you can add fonts from the Google directory to your WordPress site and there are a lot of them in there.

You can change the fonts for the body text independently from the H1 headlines and blockquotes. Keep in mind though, in some cases the CSS for the theme may override the plugin.

Conclusion

Even if you aren’t a master of WordPress, you can still look like you know a little something. These plugins make it super easy to add little details to your site to set it apart from the millions and millions of sites on the web.

What are your code free tips to make your site stand out to your readers?

Image credit: intro image

Related Posts:

• How to Turn Your WordPress Site Into A Forum With SimplePress
• 5 Useful Ways To Protect Your WordPress Login
• How to Add Dynamic Widgets To Your WordPress Blog Without Meddling With The Code
• How to Add The Facebook Send Button to Your WordPress Site

Notice that the video doesn’t take up full width of the content container?

Notice that the video doesn’t scale when you resize the browser and it went out of the content container and break the theme?

To fix this, we need to make use of a script – FitVids – that will turn your embedded video into a full-width responsive object and automatically scale as you resize the browser.

Personally, I have integrated the FitVids script directly into the theme to reduce the server overhead, but for those who are not experienced in coding, there is a plugin that can do it for you: FitVids for WordPress.

1. Install and activate the FitVids for WordPress plugin.

2. Go to “Appearance -> FitVids”.

3. If you are absolutely sure that the jQuery script (of version 1.6 and above) is already included in your theme, leave the “Add jQuery” field blank. If not, check the box beside “Add jQuery”.

4. The “jQuery selector” field is a bit tricky because it can be different for each site. For most instance, you can just enter the word “body” (without the quote) in the input field and it should work. However, if you want to micro-target a specific container with video, you can place the id/class of the container in this field, for example: “#video-container“, “#content“, “.entry-content” etc.

Note: The “#” and “.” in front of the text represent the “id” and the “class” in CSS respectively.

5. Now, check out the post with an embedded video. You should see something like this:

The video now take up full width of the content container

It auto-scale as you resize the browser.

Conclusion

FitVids is an easy to use script to convert your embedded video into a responsive object. Try it out and let us know if this is useful to you.

Related Posts:

• 3 Easy Ways To Embed A Tweet And Why You Should
• 5 Excellent Ways Make Free Video Calls On Android
• Present.me Lets You Offer Information with Engagement
• How To Create Password Protected Video Files [Windows]

1. Download, extract and place the simple-press folder in the “wp-content -> Plugins” folder. In the dashboard, go to the Plugins section and activate the simple-press plugin.

2. Once you have activated the plugin, go to the Forum section and click “Perform Installation”.

The installation will create a “sp-resources” folder under the “wp-content” directory. This is the forum-specific folder and all the configurations files, custom plugins and themes will be placed in this folder. It will also create the necessary database table to hold the forum data. Lastly, it will create a “Forum” page where you can view all the forum activities. Once it is installed, you can go to http://yousite.com/forum and view the forum in action. This is how it looks like with the twentyeleven theme:

3. On the Forum section, there are tons of things you can configure, from Groups, SEO settings, Moderators, Users, Users permission, Maintenance to install custom plugins and themes. If you have experience in administering a forum, you will not have problems handling these options. For those who have never handle a forum, there are also “Help” buttons on each section so you can easily click to view the instructions for configuring the options.

4. The forum has a “default” theme. You can download new themes from the SimplePress site (only 3 basic themes are free). To install the theme, first place the theme in the “wp-content -> sp-resources -> forum-themes” folder. Next, in the WordPress dashboard, go to “Forum -> Themes” and select the new theme.

Conclusion

As can be seen above, it is very easy to integrate a forum into your WordPress site. With a few clicks, you can get a forum up and running. I have tried bbPress previously and found that it requires more configuration than SimplePress. For that, I really appreciate what SimplePress has done to make the whole setting up process a breeze. On the other hand, bbPress has better support and there are tons of plugins (free and useful) that you can use. And if you are a developer, it is much easier to modify bbPress code than SimplePress since it is more similar to the WordPress structure. SimplePress is free to download and use, but there is absolutely no support for the public. You will need to sign up as a member (with a subscription fee) to receive support, access the documentation and download custom plugins and themes. One thing though, you won’t be able to view what custom plugins and themes they have until you have signed up as a member. I am not sure how many of you will sign up for a membership before you know what they have to offer, but for sure, they won’t get my business based on the non-existent information on their site.

What do you think?

SimplePress

Related Posts:

• 4 Awesome Typography Plugins to Help Your WordPress Site Stand Out
• 5 Useful Ways To Protect Your WordPress Login
• How to Add Dynamic Widgets To Your WordPress Blog Without Meddling With The Code
• How to Add The Facebook Send Button to Your WordPress Site

How Do Instant Pages Work?

Instant Pages builds upon the functionality of Google Instant shaving between 2 to 5 seconds off a search query by using an algorithm of about 200 factors combined with the Google search history to determine which link a user is most likely to click on. It begins contacting the server to load that page in the background as soon as the search results appear. Check out this quick video to give you a better idea just how much faster Instant Pages are!

How Can I Use Instant Pages To My Advantage?

Google has made this technology works for developers as well as searchers. By following the Guide To Prerendering In Chrome, publishers are able to choose which pages on their site they want to prerender when users are already on the page. However, it is important that you limit the number of prerendered pages because it could result in increased bandwidth usage, slow loading of other links and stale content.

 Before You Start

Although the process of implementing Instant Pages is easy, it’s VERY important to make sure you know where to properly place the code. Take it from me, if you aren’t familiar with PHP code placement, you may want to read about the most common mistakes beginners make when trying to copy and paste snippets into their site. If you put it in the wrong place, you WILL break your site. Always do a backup of your site before making any changes and if you’ve made modifications to your theme, it’s best to make changes and test using a child theme.

Adding The Code

You will need to add a few lines of code to your theme’s PHP settings. Go to your File Manager and open the header.php file under your theme by clicking the Edit button.

The page of code that is set by default will open displaying the current PHP code settings. Here’s where you’ll add the Instant Pages code to make it compatible with your site and where you need to be most careful! Before the closing </head> tag, include the following code:

<?php if(is_archive()) { ?>
<!-- Instant Pages codes for Google Chrome --> 
<link rel="prerender" href="<?php echo get_next_posts_page_link(); ?>" />
<?php } ?>

It should look like this when placed in the code file:

Save your changes and test them out on your site. Here you can see the Bombax theme will start to suggest article topics as you start entering letters into the search box. This doesn’t just give a suggested article; it’s also queued to open very quickly if selected.

In conclusion, adding Google Instant Pages as a background tool to your site will keep visitors engaged on your site. With suggested articles and fast page loading, your site will become more user friendly and encourage many return visitors, producing a low bounce rate. Test it out and see for yourself if your bounce rate improves and come back to let us know!

Related Posts:

• 4 Awesome Typography Plugins to Help Your WordPress Site Stand Out
• How to Embed Responsive Video to Your Post In WordPress
• How to Turn Your WordPress Site Into A Forum With SimplePress
• How to Insert Ads In Between Content In WordPress, Without Any Plugin

Here is the method:

1. In your theme folder, open the functions.php file with a text editor.

2. Insert the following lines to the end of the file, before the “?>” tag

add_filter('the_content', 'mte_add_incontent_ad');
function mte_add_incontent_ad($content)
{	if(is_single()){
		$content_block = explode('<p>',$content);
		if(!empty($content_block[2]))
		{	$content_block[2] .= 'insert_ad_code_here';
		}
		for($i=1;$i<count($content_block);$i++)
		{	$content_block[$i] = '<p>'.$content_block[$i];
		}
		$content = implode('',$content_block);
	}
	return $content;	
}

Remember to change the “insert_ad_code_here” string to the actual ad code. Also, if there is any instance of single quote (‘) in your ad code, you have to add a \ before it. For example, if your ad code is something like:

<div id='div-gpt-ad-1234567-1' style='width:300px; height:100px;'>
    <script type='text/javascript'>
        googletag.cmd.push(function() { googletag.display('div-gpt-ad-1234567-1'); });
    </script>
</div>

You have to make them all into one line and insert a \ before the single quote:

<div id=\'div-gpt-ad-1234567-1\' style=\'width:300px; height:100px;\'><script type=\'text/javascript\'>googletag.cmd.push(function() { googletag.display(\'div-gpt-ad-1234567-1\'); });</script></div>

Explanation of the function

What we are doing with this function is to take the content for each post and break it up into each paragraph. We then detect whether the third paragraph exists. If yes, we insert the ad code to the end of the paragraph. Lastly, we insert back the starting paragraph tag to each section and glue them back into a complete article.

Things you can change here include:

1. The paragraph to insert the ad tag. The default in the above code is the third paragraph. You can change to the second paragraph by changing all instances of $content_block[2] to $content_block[1].

Note: The count of the array starts from 0, so $content_block[2] means the third paragraph instead of the second.

2. The tag to break the article. I used the paragraph tag <p> to break the article. You can use <h2> or <h3> tag instead as the marker.

3. The ad code. You don’t necessarily have to insert ad in-between the content. You can insert newsletter subscription form or any other stuff that you deem appropriate for your site.

Lastly, don’t forget to save the file and upload it to the server. As I mentioned earlier, it is best to test this on a staging site first before making it live.

Related Posts:

• 4 Awesome Typography Plugins to Help Your WordPress Site Stand Out
• How to Embed Responsive Video to Your Post In WordPress
• How to Turn Your WordPress Site Into A Forum With SimplePress
• How To Add Google Instant Pages To Your WordPress Site

Situation

When iPhone first launched, we created a category called “iPhone” for every article related to iPhone. Later when the iPad was released, we again created another category call “iPad”, since at that time, iPhone and iPad are two different devices. When Apple merged all its mobile OS into the current iOS, there seems to be very little differences between iPhone and iPad anymore. In this case, rather than maintaining two different categories of similar context, it is much more efficient to merge them together into one single category.

The merging process

Here is what we need to do:

1. Move all the posts from one category to the other (the one you want to merge into).
2. Delete the duplicate category.
3. Add a URL forwarder to redirect the previous category URL to the new URL.

The steps

1. In your WordPress dashboard, go to “Posts -> All Posts”. Filter all the posts with the category you want to delete.

2. Check out the number of posts in this particular category.

At the top of the screen, click Screen Options and enter the number of posts to appear on the screen.

3. Check every single post in this category. Click Edit.

4. Add the category that you want to merge into.

5. Once done, go to “Posts -> Category”. Delete the category from the list.

6. Lastly, using a FTP application, download the .htaccess file (assuming you are using a Linux web host) from your server root. Open the .htaccess file with a text editor and addd the following line to the top of the file.

redirect 301 relative-path-to-old-category-url http://your-domain.com/path-to-new-category-url

For example, the old category URL is at http://your-domain.com/category/old-category and the new category URL is http://your-domain.com/category/new-category. So in your .htaccess file, you will put:

redirect 301 /category/old-category http://your-domain.com/category/new-category

Save and upload (and replace) the .htacess file to your server.

That’s it. Alternatively, you can install the Redirection WordPress plugin to manage the redirection. This will, however, increase your server load. Using the .htaccess method is more straightforward, though it can be a little bit intimidating to the new users.

Related Posts:

• How to Clean Up Your Tags in WordPress
• 4 Awesome Typography Plugins to Help Your WordPress Site Stand Out
• How to Embed Responsive Video to Your Post In WordPress
• How to Turn Your WordPress Site Into A Forum With SimplePress

The Advantage of adding a Google Custom Search Engine

If you are not aware, the Google Custom Search Engine is a service provided by Google to allow anyone to create a customized search engine. The backend is powered by the Google searchbot, but you are able to customize the search results that appear.

Since the search engine is hosted at Google, the main advantage of using a GCSE is that you can ease some load off your server and give your visitors a better search experience. In addition, you can also integrate your Google Analytics and Google Adsense to the custom search engine and track what your visitors are searching and at the same time make some extra income.

Getting Started

In brief, this is what we are going to do.

1. Create a Google Custom Search Engine (GCSE).
2. Customize your GCSE.
3. Integrate to your WordPress site

1. Create a Google Custom Search Engine (GCSE)

Go to Google Custom Search and click the big “Create a Custom Search Engine” button. You will have to login to your Google account.

Give your custom search engine a name and description. Under the “Sites to search” field, enter “www.yourdomain.com/*” if you only want all pages from the main domain to be available. For those who wanted to include sub-domains as well, use “domain.com” or “*.yourdomain.com” instead.

If you have no intention to pay for the custom search engine, select the Standard edition. The “Site search” edition costs $100 per year and it allows you to remove Google branding and ads.

The next step is to customize the look and feel of the GCSE. You can pick from any of the template or customize the default style to your own. Things that you can customize include the font-family, background-color, search input color, search result color, and many other stuff.

Lastly, you will be shown a bunch of code where you need to copy and paste to the place where you want the GCSE to appear. We are going to ignore this for the time being as we are going to add more customization to the custom search engine.

2. Customizing the Google Custom Search Engine

Go to the Custom Search Control Panel and select your newly created custom search engine.

There are plenty of things that you can configure here. You can take your time to go through the option one by one. Some of the more important one includes: Autocompletions, Google Analytics, Make money and Look and feel. You can even go into the details and refine the results to appear in the result page

Note: The easiest way is to add the code to your theme where you want it to appear. However, in some cases, the search form might not integrate well with your theme. One alternative that we propose is to modify the search box in your theme, and get it to serve Google search result.

Click on the “Look and feel” link at the left sidebar. Under the “Choose a Layout” section, select “Results only”.

Next, press the “Save and Get Code” button. Copy the code.

3. Integrate the Search Result to your WordPress site

Log in to your WordPress dashboard and install (and activate) the plugin “WP Unformatted“.

Next, create a new page. Name the page “Search Result” (or whatever search title you want to show to your reader). In the text editor, go to HTML mode and paste the GCSE code in. Save the page (If you are using WP multisite, you will need to install the Unfiltered MU plugin to allow administrators and editors to insert code in post/page).

Important: Add a new custom field “sponge” (without the quote) and set the value to “1″ (without the quote).

Publish the page. Copy the permalink of this search result page.

Next, you have to open up the theme folder and search for the search form code. The default is in the “searchform.php” file, but in case you don’t find the file there, search for it in “header.php“.

The default searchform code should look like this (based on the TwentyEleven theme):

<form method="get" id="searchform" action="<?php echo esc_url( home_url( '/' ) ); ?>">
    <label for="s" class="assistive-text"><?php _e( 'Search', 'twentyeleven' ); ?></label>
    <input type="text" class="field" name="s" id="s" placeholder="<?php esc_attr_e( 'Search', 'twentyeleven' ); ?>" />
    <input type="submit" class="submit" name="submit" id="searchsubmit" value="<?php esc_attr_e( 'Search', 'twentyeleven' ); ?>" />
</form>

You need to replace:

action="<?php echo esc_url( home_url( '/' ) ); ?>"

with

action="your-newly-created-search-result-page-permalink"

replacing “your-newly-created-search-result-page-permalink” with the permalink that you have copied earlier.

Next, change the field:

<input type="text" class="field" name="s" id="s" placeholder="<?php esc_attr_e( 'Search', 'twentyeleven' ); ?>" />

to

<input type="text" class="field" name="q" id="s" placeholder="<?php esc_attr_e( 'Search', 'twentyeleven' ); ?>" />

replacing the name="s" to name="q"

Save the changes to your server.

Your custom search engine should be working now. Perform a search on your site and see the custom search results load up.

Alternatively, if you have chosen the “Two Page” option in the GCSE Look and Feel page, you can use the above method to create a search result page, but add the search form code to the theme file where you want it to appear, probably in the sidebar/widget area.

In addition, you will have to update the GCSE option page with the search result page permalink so the search query can be redirected correctly to the right URL.

Related Posts:

• Performing Search In iOS: What’s Your Alternatives?
• How to Establish Authorship For Your Posts In WordPress
• Blekko Review: A Worthy Google Challenger
• 48ers: Real Time Search Engine For Social Networks

 3 Reasons Why You Should Embed A Tweet

Let’s walk through several reasons why you would want to embed a tweet into a post or article.

Reason #1

The ability to display tweets from satisfied customers will give you automatic testimonials to display on your website or blog giving credibility to your brand. When prospective customers browse your website, they are looking for reasons you are better or different from someone else offering the same services or products. Actual tweets about your business or service could generate more leads and conversions.

Reason #2

If you built and maintain your website with no developer experience, you may not know how to create ads or Calls To Action (CTA) tabs for generating leads. You can embed tweets as your CTA instead and achieve the same result. You can create an embedded tweet to offer a free info guide or eBook on a topic in exchange for their contact information to build your email list. The prospect walks away with information and is likely to return to your site for more resources.

Reason #3

The main reason we use Twitter is to share content with like-minded people and to learn from what they share. There are a countless number of articles on how to get people to share your content and where to place the social sharing buttons on your page because we all scan articles for that bit of information that someone else might share to increase our knowledge base of that particular subject. In each sub-heading of your post, place an embedded tweet to allow segments of your article to be shared in addition to the entire article. You can get double the exposure from a single article by doing a little extra preparation!

3 Ways To Embed A Tweet

When I first heard about embedding tweets, it looked very complicated. I can read a little code and have taken some Code Academy lessons but I am far from able to change codes in my website. I’m sure many of  you are thinking the same thing so I will show you three easy ways to embed a tweet to your article that don’t require you to know HTML coding.

 1. WordPress Tweet Embed Plugin

WordPress is widely used by beginner and intermediate web developers, so it seems fitting to start with a plugin for your WordPress site. The WordPress Tweet Embed Plugin is the easiest model to embed a tweet. If you can copy and paste, you can use this method. Download and install the plugin as you do any WordPress plugin. When you see a tweet you want to embed, click on the link to open the full article. Copy the URL from the address bar of the web browser and take it to your WordPress dashboard.

Open your New Post page in the Visual tab where you would normally write your post and paste the URL on a separate line from other text.

Click Save Draft and Preview how it will look in your post.

2. Text To HTML Editor Tool

We are going to get a little more fancy now using tools that do all the hard work for you. If you want to create a customized embedded tweet, this is a great option! If you don’t want to interrupt your article with an actual tweet box, use this code option to place a small “Tweet This” link anywhere you want to allow sharing of specific text.

Open the Text Editor Tool and type in what you want the embedded tweet to say. Click URL Encode to produce the line of code you will enter into your next step.

Open a New Post page and enter this line of code into your HTML tab:

Copy the line of code in the Encode box and paste it where the red “Your Tweet Here” is. Click on the Visual tab or Preview to see how it will look. You can add text before the code to be tweeted with it (highlighted in yellow) as a subliminal hint that this is tweetable material.

Alternatively, you can also make a block quote that appears in a separate box like a customized tweet. In your HTML tab, highlight the text and code link that you want to create the block quote for. Click on the b-quote tab and save your changes. Preview your post to see it appear as a separate box that you can customize to your needs.

The “Tweet This” link is live and shareable right from the article. When the link is clicked, a Twitter window will open allowing the viewer to RT and add any comments to it before sending.

 3. Direct HTML

Similar to the other two methods, we are going to copy and paste to create our embedded tweet. When you find a tweet you want to embed, open it and click on Details and then Embed This Tweet.

A window containing the HTML code and the tweet information will open. Copy the code and paste it into your HTML tab, to the position where you want the tweet to show up. Click Preview to see it displayed in your article.

Once you experiment with options, you will see it’s very easy to do! Give it a try and be proud of yourself for tinkering with code and get your content shared through another avenue. Let us know how it worked out for you!

Image credit: House Sparrow by Big Stock Photo.

Related Posts:

• How to Embed Responsive Video to Your Post In WordPress
• GrabInbox Manages Your Social Accounts In One Place And Allows You to Schedule Messages
• Tweet And Get It Plugin Helps You Increase Your Twitter Followers
• 4 Steps to Master Consistency On Twitter – With Buffer [Review]

We have discussed plenty of tricks to secure WordPress, and enabling SSL encryption for your login session is yet another useful way to secure your blog.

If you are not aware, while using SSL encryption, all your data are encrypted before they are transmitted over the web. The encrypted data format data format makes it very difficult to be read by the other users.

To enable the SSL Security to your WordPress blog, you will need to have a SSL Certificate (consult your web host if you don’t have one) and then you can follow the below procedure to make it work with your blog.

• At first, Open your site directory either using cPanel File Manager or the FTP. I would recommend to use the File Manager instead of FTP.
• Once you reach the files directory of your WordPress installation, open the wp-config.php file.
• This is the WordPress configuration files and it is the most important in the whole WordPress system. After the file is opened, add the below code and save the file. You can add the code anywhere in the file, there’s no certain place for it.

/* Enable SSL Encryption */
define(‘FORCE_SSL_LOGIN’, true);
define(‘FORCE_SSL_ADMIN’, true);

• From then on, your WordPress site Admin area will always load with the SSL Encryption. If your site domain is http://www.mydomain.com, it will load the admin area of the same with https://www.mydomain.com/wp-admin.

There are so many advantages of using the SSL for your site. The above process will force WordPress to use SSL encryption for the Administration area. It is not necessary to enable SSL encryption for the frontend (unless you are running a blog shop) since all the confidential information, like the Username and Passwords are used only in the Admin area, not anywhere else.

Image Credit: Reevoo.com

Related Posts:

• Tails : a Linux Distribution For Protecting Your Privacy
• 5 Useful Ways To Protect Your WordPress Login
• How to Encrypt Your Files And Improve Dropbox Security
• How to Increase Your Website Security And Performance With CloudFlare

Here’s how you can establish authorship in WordPress.

Note: The following solution is just one of the many ways to establish the authorship of your content. If you have a better, easier way, feel free to use it.

For single author blog

1. Make sure you have an About page that describes who you are and what your blog is about. At the end of the content (of the About page), insert the following link:

<a href="http://your-google-profile-url" rel="me">Follow me on Google +</a>

Remember to replace the http://your-google-profile-url with your Google Profile URL.

Note: The Google Profile URL is of the format: https://plus.google.com/1234567890987654321.

Next, go to the theme editor and open your functions.php file. Insert the following code at the end of the file:

add_filter('the_content', 'add_author_link');
function add_author_link($content)
{	if(is_single())    	
		$content .= '<p>This article is written by <a href="http://link-to-your-about-page" rel="author">'.get_the_author_meta('display_name').'</a></p>';
 
	return $content;	
}

Save the changes.

What the above code does is to insert a sentence at the end of your article with a link to your About page.

For multi-authors blog

1. Get all your authors to update the Jabber/Google Talk field in the Profile section with their Google Profile URL.

2. Open the functions.php file and insert the following code:

add_filter('the_content', 'add_author_link');
function add_author_link($content)
{	if(is_single())    	
	{	$content .= '<p>Follow this author at <a href="'.get_the_author_meta('jabber').'" rel="author">Google+</a></p>';
	}
	return $content;	
}

The above code will grab the Google Profile URL from the author’s Jabber/Gtalk field and insert the link to the end of the content.

That’s it.

It will take 1-2 weeks for Google to show your profile picture in the search results. Meanwhile you can use the Rich Snippet Test Tool to see how your page looks like in the search results.

Related Posts:

• How to Integrate Google Custom Search Engine to WordPress
• How to Get Google To Show Your Profile Picture In Search Results
• Google+: Circle, Streams, Sparks, Hangout and Mobile App. All You Need To Know About Google+
• Embedding Google Font to Your WP Blog

One of the way to change it is to directly edit the wp-admin.css file under the “wp-admin -> css” folder. This is not a good solution because the next time you upgrade your WordPress, your files will be overwritten.

The best way is to insert a small function to your functions.php.

Open your functions.php file in your Themes folder.

Add the following code to the end of the file:

add_action( 'admin_head-post.php', 'fix_html_editor_font' );
add_action( 'admin_head-post-new.php', 'fix_html_editor_font' );
 
function fix_html_editor_font() { ?>
    <style type="text/css">
        #editorcontainer #content, #wp_mce_fullscreen {
            font-family: Tahoma,Verdana,Arial,Helvetica;
        }
    </style>
<?php }

You can change the font-family to the one you like. I personally prefer the Tahoma and Verdana font family.

Save and upload the functions.php file back to the server. This is the result:

That’s it.

Related Posts:

• Embedding Google Font to Your WP Blog
• 3 Useful WP Plugins to Add a Floating Social Sharing Bar Beside Your Content
• How to Add Image Thumbnails to Related Posts in WordPress
• Add an Author Information Box to Your WordPress Theme

The working behind the Tweet and Get It plugin is simple. First, you create a high-value product to be given away. Next, you create a Tweet and Get it button which is linked indirectly to your download page. When your visitors click the button, they have to first follow your Twitter account and send a tweet before they are redirected to the download page.

1. Install and activate the Tweet and Get It plugin.

2. Go to “Tweet and Get It -> Make Your button” section. Here’s where you can create download button for your free product.

You have to enter your Twitter account, the tweet you want the visitor to send in exchange for the product and upload the product (or insert in the download URL if the file is not hosted in your server). Lastly, enter the name of the button.

3. Click the “Create your button” button. It will then generate the shortcode for the button. Copy the shortcode and paste it to the product giveaway article. This is what you will see in the front page.

When your reader click the button, he/she will be brought to the Twitter authorization page where they have to grant authorization to the Tweet and Get It app. After that, the following screen will appear and they have to click OK (to send the tweet and follow your Twitter account) to proceed.

Lastly, the download button will appear where they can download your file.

Conclusion

One thing that I like about this Tweet and Get It plugin is that from the start to the end, it only takes you 5 minutes to set it up and there is totally no coding knowledge required. If you are looking to increase your Twitter followers count, this is a very useful plugin that you can consider.

Tweet and Get It

Related Posts:

• 3 Easy Ways To Embed A Tweet And Why You Should
• Deck.ly – Longer Tweets With Less Hassle
• 9 Useful Twitter Tools To Do More Than Just Tweeting
• Embed Twitter Tweet button to Your WordPress Blog

1. Google Authenticator

The Google Authenticator plugin makes use of the Google Authenticator mobile app to provide a two-factor authentication login to your WordPress site.

Note: Before activating Google Authenticator, make sure that you have enabled two-factor authentication in your Google account and installed the Google Authenticator app in your Android, iPhone or Blackberry phone.

Once you have installed and activated the plugin, go to the “Users -> Your Profile” section and you should see the Google Authenticator settings.

Check the box beside “Active” and save the changes. Next time you login, it will prompt you to enter the secret key. If you failed to enter the correct code, you will not be able to login.

Google Authenticator

2. One Time Password

One Time Password allows you to login to your WordPress without using your real password. It generates a list of passwords that you can use to login to your site. These passwords are valid only for a single session, so even when the password is stolen, others won’t be able to login to your site. This is particularly useful if you are travelling but need to login to your site in a cybercafe.

Once installed and activated, go to the One Time Password section to generate your password list. Enter a passphrase and click the “Generate” button.

Print out the generated password list and bring it with you wherever you go.

When you need to login, it will show a sequence number. You just have to match the sequence number with your password list and enter the password accordingly.

One Time Password

3. WP Login Security

WP Login Security works via the IP address. It first requires administrators to register or whitelist their IP address. Next, it will detect the IP address whenever the administrator logins. If the IP address is not recognized, it will send an email to the administrator with a link that contains a one-time key.

A good thing about this plugin is that there is little or no configurations required. You just activate it and it is good to go.

WP Login security

4. Login Lockdown

We have mentioned Login Lockdown before in our previous post on WordPress security. We are going to mention it again here because it is truly a useful plugin. What it does is to records the IP address and timestamp of every failed login attempt. If more than a certain number of attempts are detected within a short period of time from the same IP range, then the login function is disabled for all requests from that range.

Login Lockdown

5. WP Firewall 2

This plugin is not directly related to the login field, but it protects your site by investigating web requests to identify malicious attack. It is able to stop the attack before it causes damage to your database.

After activating, you can find the configuration options under the Firewall section. The default options are often good enough for everyone and you seldom have to make any changes.

WordPress Firewall 2

The above mentioned methods are only some of the ways to protect your WordPress site, don’t forget to check out:

• 11 Ways To Secure Your WordPress Blog
• How to Increase Your Website Security And Performance With CloudFlare
• How To Connect To Your WordPress Account Via Secure FTP

Related Posts:

• 4 Awesome Typography Plugins to Help Your WordPress Site Stand Out
• How to Turn Your WordPress Site Into A Forum With SimplePress
• How To Add SSL Security To Your WordPress Blog
• How To Configure Facebook Two-Factor Authentication

Do you know that Google actually penalizes websites that are slow to load? If you want to get a good search engine ranking, one of the most important thing is to make sure your site load fast, blazingly fast!

If you are running WordPress, we have already mentioned several ways to polish up your site loading speed, including adding Google Analytics site speed tracking feature, lazy loading your images, using W3 Total Cache and minify the code.

One other way is to use CloudFlare as a proxy server.

CloudFlare acts as a proxy server that link between you and your readers. When your readers enter your site’s URL, the browser will first connect to CloudFlare, which will then detect their locations and load your site content from the server closest to the readers. This will ensure your reader get the fastest loading time and performance. Furthermore, CloudFlare caches your script, css and image files, so there is no wastage of bandwidth and server resources.

In addition, as a proxy server, CloudFlare can detect who is accessing your site and block threats and limit abusive bots and crawlers before they reach you. In other words, CloudFlare is able to increase your site security as well.

Configuring CloudFlare

Getting your site to run with CloudFlare is easy.

1. Go to CloudFlare.com and sign up for an account.

2. Next, enter your site’s domain name. Click “Add this domain”.

3. CloudFlare will then scan your DNS. It might take up to 2 minutes. Once the scanning is completed, click “Continue to Step 2″.

4. The next page displays a list of your site existing DNS record. Check to see if they are correct. If necessary, you can add in extra DNS record here. If everything is correct, scroll down to the end and click “I’m done checking my DNS records, continue”

5. CloudFlare will then register your DNS setting and configure itself to power your site. CloudFlare will also add a sub-domain (of the name “direct”) for you to access your server without passing through the CloudFlare network.

6. The last step is to update your domain with the new DNS setting. If you register your domain name via a domain registrar, you can login to your domain registrar account and change the DNS setting. If you got everything set up via your web-host, submit a ticket and get them to change the DNS setting for you.

That’s it. You are good to go.

This is loading speed of Make Tech Easier before and after implementing CloudFlare.

Before:

After:

There is a saving of 1.8 second, which translate to a 18.5% improvement.

The above results were taken from Pingdom. You should also test out your site loading speed before and after implementing CloudFlare too.

What’s next after configuring CloudFlare?

After you have set up CloudFlare, login to your CloudFlare account and go to the “Settings -> CloudFlare Settings” (the link is beside your website). Here is where you can configure the settings for CloudFlare. Some of the important settings include Security level, Caching level, customize the Challenge page, E-mail Address Obfuscation, IP Geolocation (useful if you are showing geolocation ads) and Hotlink Protection.

In addition, if you are using WordPress, install the CloudFlare plugin which can help you optimize your database and better protect your site from spammers.

Image credit: lrargerich

Related Posts:

• 8 Useful Tips To Get The Best Out Of Your Android Phone
• How To Add SSL Security To Your WordPress Blog
• 5 Useful Ways To Protect Your WordPress Login
• How to Quickly Build A Professional Website Without Being a Coding Expert

1. Conditional Widgets

As its name implies, Conditional Widgets is a plugin that allows you to define a conditional rule for each and every widget.

After you have downloaded and activated it, go to your Widgets page and add the widgets you want as per normal. What is different now is that within each widget, there is an option for you to configure when the widget should appear in the blog (refer to the screenshot below).

You can get it to show/hide on the Home page, certain categories, or even certain pages. It also supports sub-categories and sub-pages. You just need to define the rule for the parent category/page and their sub-categories and sub-pages will follow suit.

One thing though, it does not allow you to configure on a per-post basis.

2. Widget Logic

Widget Logic is less intuitive than Conditional Widget, but it gives you the flexibility to define where the widget should appear. Widget Logic make use of the WordPress conditional tags to determine where the widget should appear. For example, if you want the widget to appear on a post with post id 46, you place the conditional tag is_single(46) in the Widget Logic field.

Widget Logic

3. Section Widgets

The way that Section Widgets works is slightly different from the above two, but it is also the most powerful among the three. Other than the conditional logic, Section Widgets also allows you to create a tabbed sidebar without having to write a single code.

After the installation, go to “Themes -> Section Widget“. This is where you can customize the look and feel of the tabbed interface. It comes with 25 UI themes for you to choose. If none of them caught your eyes, you can even define your own style.

In the Widget section, instead of adding a conditional logic to each and every widget, you will have to add the “Section” widget to the respective sidebar in order for it to appear. Each Section widget comes with two part. The upper part is where you define the condition (which page/category to appear) and the lower part is the HTML code to display.

To add a tabbed widget, drag and drop the “Section (tabbed)” widget to the respective sidebar. Similarly, the top section is where you define the logic and the bottom is where you create tabs and add content to it.

While Section Widget is very powerful, it does have one caveat – it doesn’t integrate with other widgets. If you have a custom widget (say the custom menu) that you want to show conditionally on your blog, you won’t be able to do that with Section Widget.

Section widget

Which method do you use to add conditional widgets to your WordPress site?

Related Posts:

• 4 Awesome Typography Plugins to Help Your WordPress Site Stand Out
• How to Turn Your WordPress Site Into A Forum With SimplePress
• 5 Useful Ways To Protect Your WordPress Login
• How to Add The Facebook Send Button to Your WordPress Site

A good plugin with the merge tag functionality is Term Management Tools. With this plugin, you can manage your terms (category and tags) easily.

Cleaning up your tags in WordPress

1. Install and activate the Term Management Tools plugin in your WordPress dashboard.

2. Go to your Post Tag list (Posts -> Post Tags).

3. The default view is to show 20 tags per page. If you have plenty of tags, it is going to take up a lot of your time switching between each page. What you can do is to increase the number of tags shown per page. Click the “Screen Options” button at the top of the page. Enter the number of tags you want it to show per page. The maximum number you can enter is 999.

4. Go through the list of tags and put a check beside the tags that have 0 post. At the top (or bottom), click on the dropdown menu and select “Delete”. Click Apply. This will delete the unused tags.

5. Next, go through the list again. For those similar or duplicate tags that you have created, put a check beside them and select “Merge” from the dropdown menu. An input field will appear for you to enter the tag name that you want to merge the two (or more) tags into.

6. If your tag list is long, it will take a long time for you to finish cleaning up your tags, but I assure you it is well worth the effort. Nothing is worst than a messed up and bulky database. Once you have completed the clean up, deactivate the plugin. You have no use for it anymore.

7. Lastly, optimize your database and do a full database backup (using the WP DB Manager plugin).

8. That’s it.

You might also want to check out other ways to clean up your WordPress blog.

Related Posts:

• How to Merge Categories in WordPress
• 3 Useful Tools To Optimize your Blog’s CSS
• 4 Awesome Typography Plugins to Help Your WordPress Site Stand Out
• How to Embed Responsive Video to Your Post In WordPress

What the difference between LIKE and SEND button?

When you click on the LIKE button, it will be posted to your wall and publicly announce that you LIKE a particular piece of content, be it your friend’s status update, an article, a fan page, or even a site.

When you click on the SEND button, a dialog box will appear and you can enter your Facebook friends’ names and type a personal message. The content will then be sent to your friend’s Facebook Inbox.

Adding the SEND button to your WordPress site

In order to add the SEND button, you must be using the Facebook’s XFBML code in your site. The iFrame version does not work at all. If you have not added the XFBML code, follow the instruction here to implement it to your site.

Next, copy the following code and paste it to your theme file (must be within the loop) where you want the SEND button to appear:

<div id="fb-root"></div><script src="http://connect.facebook.net/en_US/all.js#xfbml=1"></script><fb:send href="<?php the_permalink(); ?>" font="arial"></fb:send>

To get the SEND button to show up beside the LIKE button, replace the existing LIKE button code with this code:

<div id="fb-root"></div><script src="http://connect.facebook.net/en_US/all.js#appId=12345678&amp;xfbml=1"></script><fb:like href="<?php the_permalink(); ?>" send="true" width="450" show_faces="false" font="arial"></fb:like>

Remember to replace appId=12345678 with your own Facebook appID.

Alternative method: via plugins

If you have difficulty understanding the method above, the best way to implement the Facebook SEND button is via a plugin.

1. Install the Facebook Send Button WordPress Plugin.

2. Activate the plugin

That’s it. This is a simple plugin that automatically add the SEND button to your single post/page. No configuration required.

Other plugins you can use include: Facebook Like Button for Dummies, Facebook Send Button By Teknoblogo.com, Facebook Like and Send (2 in 1)

What’s your view on the Facebook’s SEND button? Is it adding more value to your site?

Related Posts:

• How to Add Facebook Comment System to Your Site
• The Howto Guide to Add Facebook Social Plugins to Your WordPress Site
• 4 Awesome Typography Plugins to Help Your WordPress Site Stand Out
• How to Turn Your WordPress Site Into A Forum With SimplePress

Upon first launching the application, you will be presented with a login screen where you are allowed to enter the credentials for your blog.

Note: There are two version of WordPress. The first is WordPress.com, which is a service similar to Blogger and hosts blogs for individuals free of charge. The second is WordPress.org, which is for individuals hosting their own blog on their own servers. The Android app can connect to either version of WordPress.

After you have entered your blogs credentials, the application will display all available blogs in a list. It should be mentioned that the Android application is capable of connecting to more than one blog at a time. This particular feature is convenient, as it allows you to post to any number of blogs you owned or involved in.

Selecting a blog from the list will bring you to the blog control screen. At the top of the screen, you have four available options: comments, posts, pages and stats. The comments feature allows you to approve comments ( or delete them ) while on the run. The Post and Pages feature allows you to create posts and pages from your mobile phone. Although this feature isn’t necessarily ideal for intense editing, it is a nice feature if you need to make minor adjustments to your site while away from the office.

Apart from these basic editing features, the application also integrates with communication services on your mobile device. Selecting a post, for instance, will give you the option of sharing the posts via URL, SMS, Gmail, or even Twitter. This particular feature makes the application an ideal platform to share your thoughts while on the move.

Note: The stats feature works only with the WordPress.com version of WordPress. As mentioned previously, this is the freely available and pre-hosted web service that anyone can sign up for. This particular feature is not compatible with WordPress.org, the self-hosted version of WordPress.

In addition to the editing and sharing functions, the application comes with its own notification settings. This setting alerts you to any recent comments that a blog visitor may have posted to your site. All things considered, this is a handy feature to have. If you’re a business owner using WordPress as your main site, this function will allow you to connect with your clients or readers almost as quickly as they can post.

Some may argue that the WordPress app is too sparse in its list of features, and to some extent, it is. The application is primarily designed to make quick edits, approve comments, and be alerted of activities that are occurring on your blog or site. All in all, the application performs its intended functions admirably well and can serve you or your webmaster needs.

Related Posts:

• Apex Launcher Is A Worthy Replacement For The Stock ICS Launcher [Android]
• Give Your Android Phone A Mac-Like Dock
• Llama: Transform Your Android Phone to A Fully Automated Bot
• Android Power Monitoring At Its Best

Here are 4 useful techniques you can use to customize and bring out the best of the WP Admin Bar.

1. Remove existing links from WP Admin Bar

1. Navigate to your theme folder and open the functions.php file with a text editor.

2. paste the following code to the end of the file:

add_action( 'wp_before_admin_bar_render', 'remove_admin_bar_links' );
function remove_admin_bar_links() {
        global $wp_admin_bar;
        $wp_admin_bar->remove_menu('comments');
}

The code above will remove the “COMMENTS” link from the Admin Bar. It works by using the functions $wp_admin_bar->remove_menu(ID). By providing the ID of the links that you want to remove (in this case, the ID is COMMENTS), you can remove any links from the Admin Bar.

Here are some of the ID that will be useful to you:

• my-account-with-avatar / my-account: Links to your account. The ID depends upon if you have avatar enabled or not.
• my-blogs: My Sites menu. For network mode only
• edit: Post/Page edit link
• new-content: Add New menu
• comments: Comments link
• appearance: Appearance menu
• updates: Updates link
• get-shortlink: Shortlink to a page

2. Adding custom links to the WP Admin Bar

To add your own links to the Admin bar, append the following code to your functions.php.

add_action( 'wp_before_admin_bar_render', 'add_admin_bar_links' );
function add_admin_bar_links() {
        global $wp_admin_bar;
       $wp_admin_bar->add_menu( array( 
		'id' => 'Google', 
		'title' => __('Google'),  
		'href' => 'http://google.com' 
	));
}

The example above add “Google.com” as a link in the Admin Bar. You can, of course, customize it to your liking. Things that you need to take note is the ‘id’, ‘title’ and ‘href’

id: the identifier for the link
title: the name that appear on the Admin Bar
href: the url the link is pointing to.

You can also create a submenu with the code below:

add_action( 'wp_before_admin_bar_render', 'add_admin_bar_links' );
function add_admin_bar_links() {
        global $wp_admin_bar;
       $wp_admin_bar->add_menu( array( 
		'id' => 'Google', 
		'title' => __('Google'),  
		'href' => 'http://google.com' 
	));
       $wp_admin_bar->add_menu( array( 
		'parent'=>'Google',
		'id' => 'GoogleAnalytics', 
		'title' => __('Google Analytics'),  
		'href' => 'http://google.com/analytics' 
	));
}

This is how it looks like:

3. Show the login form if user is not logged in

By default, the Admin Bar will only appear for logged-in users. If, however, you want to make the admin bar visible for everyone and make it show the login form if the user is not logged in, you can use the WordPress Admin Bar Improved to enable this functionality.

4. Disable the Admin Bar totally

Some of you might dislike the admin bar and wish to remove it totally. Here’s how you can do so.

1. Login to your WordPress dashboard and go to your profile tab.

2. Under the “Show Admin Bar” section, uncheck the option “when viewing site” and “in dashboard“. Save the changes.

If you are managing a multi-authors blog (or in network mode) and you want to disable the Admin Bar for all your authors, in your functions.php file, copy and paste the following code;

add_filter( 'show_admin_bar', '__return_false' );

This will disable the Admin Bar sitewide.

What other tricks do you use to customize the WP Admin Bar?

Related Posts:

• How to Customize Your WordPress Administration Area
• 4 Awesome Typography Plugins to Help Your WordPress Site Stand Out
• How to Turn Your WordPress Site Into A Forum With SimplePress
• 5 Useful Ways To Protect Your WordPress Login

Now if you are keen to implement the Facebook comment system in your site, here’s how you can do so:

Static site

If you are running a static website, adding the Facebook comment system is easy.

1. Go to Facebook comments social plugin page.

2. Enter the URL of your site, number of comments to show and the width of the comments. Click the “Get Code” button.

3. Copy the code and paste it to your site where you want the comment to appear.

4. Next, still in your site, paste the following code to anywhere between the <head> and </head> tag

<meta property="fb:app_id" content="{YOUR_FACEBOOK_USER_ID}">

Replace the “{YOUR_FACEBOOK_USER_ID}” with your own Facebook ID. This will allow you to moderate the comments.

5. Lastly, paste the following code to just before the <body> tag.

<script src="http://connect.facebook.net/en_US/all.js#xfbml=1"></script>

That’s it for implementing Facebook comment on static website.

WordPress

The easiest way to implement Facebook Comment in your WordPress site is via plugin. One of the more promising plugin is Facebook Comments for WordPress.

1. Download, install and active Facebook Comments For WordPress.

2. Before you can use it, you need to register a Facebook application and obtain the app id. Go to http://www.facebook.com/developers/createapp.php and register a new app. Once you have registered the app, copy the Application ID and Application Secret.

3. Back to your WordPress dashboard, go to the Facebook Comments settings page and paste the Application ID and Application Secret into the first two fields.

4. From here on, you can configure the plugin to your liking. The default language for comments is set to “Afrikaan”, so make sure you change that in the settings before you make it live. Once done, click the “Update Option” button.

Go to your blog and you should see the commenting system in action. If you are using other commenting system like Disqus or IntenseDebate, remember to deactivate them, else you will see two comment system in your blog.

Now, a quick poll, how many of you will switch to Facebook comments system?

Take Our Poll

Related Posts:

• How to Add The Facebook Send Button to Your WordPress Site
• The Howto Guide to Add Facebook Social Plugins to Your WordPress Site
• 5 Ways To Reduce Comment Spam On WordPress Blogs
• 4 Awesome Typography Plugins to Help Your WordPress Site Stand Out