a verse of code

24 Wordpress Plugins to extend Wordpress beyond a blog

Posted on Feb 7th, 2010 in Wordpress | 0 comments

There’s been many times where people are amazed that Wordpress can be used as a tool to not build a blog, but an honest looking professional website. It wouldn’t be possible without the endless development of Wordpress Plugins.

Wordpress as a core is an appreciative blogging platform with WYSIWYG (What You See Is What You Get) publishing and some simple settings, but with plugins and themes you have everything you need to build a website many people would spend thousands of dollars for. Wordpress was developed with the focus for extensibility and it continues to practice this concept as Wordpress continues to evolve and ultimately, get better.

I’ve followed the Wordpress development channels and blogs for quite some time now and as new features are mentioned for the next version, the question, “Can that be a plugin?” has come up more often than not. Actually most new features should start with this question. The beauty of this concept allows Wordpress to stay rather minimal and allow the user create the perfect Wordpress setup with a collection of plugins.

This rather simple guide is here to share with you plugins that I’ve come to love over the years. Hopefully I can share a few plugins and truly show you that Wordpress is more powerful than you may have even known.

Core Plugins

These plugins have become standards, defaults, plugins I install on nearly every Wordpress setup. These core plugins setup my Wordpress sites for search engine optimization (SEO), site tracking, and security.

Akismet

Akismet is one of two (Hello Dolly being the latter) plugins that comes packaged with every installation of Wordpress. Akismet protects your site from potential comment spam on your articles. It’s accuracy is incredible. If you’re planning on allowing comments on your Wordpress site, Akismet should be activated and registered. Akismet requires a Wordpress.com key (which can be attained here).

All-In-One-SEO Pack

If you’re unfamiliar with SEO (Search Engine Optimization) I suggest you read this and this and this. This plugin is designed to practice common SEO strategies.

Google XML Sitemaps

This plugin extend the strategies of SEO by creating an sitemap that is complaint with many search engines, such as Google. To understand more about sitemaps read this.

Robots Meta

This plugin continues to expand the strageties of SEO as well as protect parts of your site out of search engines. It does this by creating a robots.txt file. This file is read and honored by search engines as what it should indexed when it crawls your site. Learn more about robots.txt file here.

Wordpress Database Backup

Wordpress is strongly dependent on a database to store everything from your site’s settings to all the posts and pages you wrote. When you think about it, the things in the database is the irreplaceable data to your site, the content that makes your site unique. This plugin will allow you to automatically schedule periodic backups of your database, if in an unfortunate circumstance, you would lose your site. This plugin even will email you a database backup file periodically. I suggest you setup a GMail account just for Wordpress database backups and get in the habit of setting up your Wordpress sites to send the backups to that account.

Google Analyticator

If you’re not using Google Analytics by now, stop what you’re doing and go register yourself here. Google Analytics is an extremely powerful and free tool to monitor and track your visitors on your site. It will tell you how many hits you’re getting, where in the world your users are coming from and even tell you what search terms people are using to find your site. This plugin extends and optimizes the setup of Google Analytics to your Wordpress site.

WP Super Cache

This plugin will allow your Wordpress site to be cached. This basically means that your site is ready to potentially accept a potential spike of traffic without crashing. You never know when it may happen, but who wants their site to fail when the most people want to see it?

Popular Feature Plugins

These plugins extend your Wordpress site to include many popular features found on websites. These features range from contact forms to e-commerce platforms to photo galleries to social media tools. These aren’t the only plugins to achieve the extended functionality of Wordpress sites, but they are my plugins of choice.

Adding Photos and Image Galleries

NextGen Gallery

This plugin is the ultimate plugin for creating photo galleries in Wordpress. Easily upload images, create slide shows, galleries with numerous image effects and automatically add watermarks to your images.

Adding Videos

Viper’s Video Quicktags

Getting video into your website can be somewhat tricky, but if you’re willing to use a social video service such as Youtube, Vimeo, or Metacafe, this is the plugin that will make integrating your videos much easier. In some cases you have the option of customizing the design and layout of your video to better match the design of your site.

Adding Audio Players

Audio Player

This is by far the simplest way to get audio files to play on your site. Upload your videos with Wordpress’ media manager and then link your audio files inside of a post or page. Here’s a great tutorial on doing just that.

Adding Downloads

Wordpress Download Monitor

Sometimes there are situations where you want to offer file downloads such as PDFs or other files on your website. Use this plugin to not only upload your files, but to protect its original location with its rewrite URL feature as well as keep track of the number of times the file is downloaded.

Adding Forms such as Contact Forms

cforms II – contact form

Contact forms are the most popular method for a user to submit content to you, the publisher. This plugin will allow you to create simple to complex contact forms ranging from a simple “Contact Us” form to a detailed request form.

Gravity Forms

If you’re really serious about forms, Gravity Forms is by far the best plugin you’ll find to creating forms on your site, but it is a premuim plugin that costs some money. Being that it is a premium plugin, you can definitely tell these guys are on top of things with this plugin, as they continue to better the overall form creation process. Add to it, their support and this plugin is worth more than what you pay for.

Adding Content Ratings

GD Star Rating

This plugin will give you the ability to allow your users to vote and rate your posts. If you’re creating a review website, you’re given a variety of options to displaying stars and multiple rating systems.

Adding Polls and Surveys

PollDaddy

PollDaddy is actually an independent solution for creating polls on your website. This plugin simply allows you to integrate your polls you create in PollDaddy into your Wordpress site.

Integrating Social Media

TweetMeme

Social media plays a huge role in the popularity of websites, Twitter being one of them. This plugin is a solid choice of using TweetMeme to retweet your posts, allowing your users to easily share your content on your site to their followers on Twitter.

Digg Digg

Details go here…

Sociable

Details go here…

Intergrating Advertisement

Easy Adsense

Details go here…

Selling Your Own Products (eCommerce)

WP e-Commerce

Details go here…

Shopp Plugin

Details go here…

Advanced Feature Plugins

Integrating a Forum

BBPress

Details go here…

Creating a Social Network

Buddypress

Details go here…

Creating a Membership

WP Wishlist Member

Details go here…

xFEM2cd1mqGG

Understanding the cloud and how easy it is to start using cloud computing for your website

Posted on Nov 16th, 2009 in Services | 0 comments

I’ve been asked a few times lately about cloud computing and using the cloud for your web site/services so I thought I would share a little. I’ve been using the cloud for a couple years now for various services (mainly storage). As it’s popularity continues to grow and standards for cloud computing continue to form, I think the ability to efficiently optimize many aspects of your website with cloud computing is definitely worth it’s interest! Let me share with you…

cloud

What is cloud computing?

This is probably the biggest question. What the hell is cloud computing?

So lets think of the traditionally conventional method of a website and how it is connected to the internet. You have a server, which is nothing much more than a computer configured to host a website and a connection to the internet. Your server has disk space, computing process power and applications that allow you to make the processing power and disk space accessible through connections to the internet. The disk space holds all of the files and applications that run your website and the processing power is responsible on how quickly these files and applications can deliver results to the end user.

So it has always been thought that the more disk space you have for your website, faster processing power, and faster internet connection you have available will provide the best results for your web site. The problem with this is it really isn’t that efficient and can be very costly to have a server and internet connection like this. You could be potentially paying monthly payments for unused disk space and bandwidth.

This is where cloud computing comes in.

Instead of thinking of a website that resides on a server (or a discrete number of servers), with a discrete number of processes and a discrete number of connections to the internet, we have the cloud. The cloud is a software as a service (this is what we call Amazon’s S3, EC3, and CloudFront, for example) which actually is a large network of servers and connections virtualized.

Amazon’s service is a massive software application that is responsible for where files are stored, where processing power comes from and what connection to use to serve your files.

So now Amazon has this ambiguous enigmatic mecca server (the cloud) that everyone shares its storage, processing and distribution power. The beauty of this is each user of the cloud no longer has to purchase or allocate so much memory and processing power for their website, instead using a SaaS such as Amazon allows you to only use what you need. This means you only pay for the storage you use, the processing you generate and the number of requests you make.

Everything is incremental and becomes very efficient for you.

With cloud computing services you no longer pay for a large server of gigs upon gigs of memory where you only use maybe 10% of it and a large throttle of bandwidth which you’ll be lucky to use 10% of that. Now with a company such as Amazon, they can provide you with a service, to host files, to provide you with strong processing power, and efficiently fast deliverability. A website now can be optimized by using cloud computing services to host files and process tasks.

What about the security of the cloud?

The next question raised is the matter of security. Having a non-finite number of users who access and use the cloud opens potential vulnerabilities which would allow the wrong exploit to cause massive damage. The security of the files are currently controlled by ACL settings and internal security settings of your cloud service provider. Since you don’t know the exactly physical location of your files and exactly where your process is coming from, you’re putting a lot of trust in your cloud service provider (such as Amazon) on the integrity of your files, yet that will soon be regulate as standards of the cloud come into play. I read an article that said there are 8 (or possibly more) groups working on creating the standards for the cloud. As early as the cloud concept is, I think its only going to better in time.

Should I use the cloud?

I definitely think you should. Actually, a hybrid of the cloud and a secure server setup. Think of it like this, continue to use your server(s) like you would to host your website, but outsource the less important things to the cloud. This means public images, video files, PDFs and such (mostly media) should be stored and hosted on the cloud where the more important private and secure files are still on your main server setup.

What this will do is allow you to use a server setup with less hard disk space allocated to files and less bandwidth for delivering the files. The cloud will host the files and efficiently deliver the files faster (as a service). Now you can be more economical by only paying for the hard drive space and bandwidth you need.

How to get started on the cloud

It’s actually easy than you can imagine to using the cloud. I’ve been using Amazon S3 (Simple Storage Service) and CloudFront to delivering files on a website. Amazon S3 is a storage solution that allows you to store files as either a public or private storage box. Using Amazon S3 for your website will make your files public, but very efficient on the amount of disk space and bandwidth you use, since you only pay for what you use.

Here are the current prices on Amazon S3: http://aws.amazon.com/s3/#pricing

As you can see there are 3 different things you can be charged for:

Storage – This is a price you pay per GB that your files are being hosted on S3
Data Transfer – This is a price you pay per GB of transfer you make to and from S3
Requests - This is the price you pay on the number of actions you make on the S3 service.

Amazon provides a monthly calculator to see how much it would cost to use their AWS services here: http://calculator.s3.amazonaws.com/calc5.html

Now that you’ve gotten an idea on how much it will cost to use Amazon S3, the next step is actually using it.

Transferring files is as simple as using a software application that looks similar to your favorite FTP application. I like to use Cloudberry which available free to download here: http://cloudberrylab.com/default.aspx?page=cloudberry-explorer-amazon-s3

After you’ve installed Cloudberry, you’ll need to connect Cloudberry to your Amazon S3 account.

Here’s how you can do this:

Open CloudBerry and click File->Amazon S3 Accounts
Double-click New Account
Give your Account a name (if you plan on connecting to more than one Amazon S3 Account this is useful, otherwise you’ll probably only have one S3 account).
Next you’ll need two things from your Amazon Web Services account. Go to http://aws.amazon.com and login to your Amazon account.
Click on Your Account->Security Credentials.
You should see a Access Keys tab, if you don’t have one created yet, create one. You’ll need the access key ID and secret access key.
Enter both of these values into Cloudberry. At this point Cloudberry is connected to your Amazon S3 Account and you’re ready to start uploading files to the cloud!
You’ll notice that Cloudberry looks similar to an FTP client. On the left side is your computer then (after selecting your S3 account from the drop down box) on your right side your Amazon S3 account.
Now you’ll need to create a bucket. A bucket is Amazon’s terminology for a folder to store files on the cloud. Click the blue bucket icon to create a new bucket.
After you’ve created a bucket, you can upload files to that bucket simply by browsing and dragging files from your computer on the left to the bucket on the right.
Next we need to set the ACL settings of the file so that it is accessible by other websites. Right click the file on your S3 account on the right, choose ACL->ACL Settings and click on [Public (everyone)]. Click [Ok] and now the file is public for access.
Finally we need to know the absolute URL of the file to access. Right-click the file and choose [Web URL]. This will show you the absolute URL of your file. For example, if you’re using S3 to host your images, you can use this URL when referencing it on your website as the source of the image.
That’s it you’re now successfully using the cloud to store and access a file for your website.

A step further…

If you want to optimize the use of the cloud further you can also use your Amazon S3 files in conjunction with Amazon’s CloudFront. Amazon CloudFront is a network of edges (locations where files can reside) which will make your file accessible from multiple locations to improve on latency and bandwidth. Amazon CloudFront will optimize the delivery of your file, by delivering your file to the closest location the file resides.

Think of it like this, you’re neighbor recently viewed a file on Amazon S3, instead of requesting Amazon S3 for the file again, Amazon CloudFront will be able to see that the file was recently accessed from a closer position and deliver it to you faster. This does decrease the bandwidth costs of your Amazon S3 account, but is made up by using Amazon CloudFront. Actually the bandwidth rates are the same, so to use Amazon CloudFront or not, will not drastically effect the cost of using Amazon Cloud services.

Using the CloudFront will actually be much more efficient for your website by delivering files to your web users much faster.

Here are Amazon CloudFront prices: http://aws.amazon.com/cloudfront/#pricing

Here’s how you can integrate Amazon CloudFront with your Amazon S3 account:

Open Amazon’s AWS Management Console here: https://console.aws.amazon.com/cloudfront/home
Click [Create Distribution]
Select your Amazon S3 Bucket you created above and click [Create]
Now you need to modify the URL that you got in step 12 above so that it is hitting Amazon CloudFront’s edge network. For example the file I added has an absolute URL of http://anthonymontalbano.s3.amazonaws.com/anthony.jpg
We need to replace the bucket URL (which is anthonymontalbano.s3.amazonaws.com with the edge network of d34k2wyjxt4ma5.cloudfront.net) so my new URL for my file hosted on the cloud is http://d34k2wyjxt4ma5.cloudfront.net/anthony.jpg
That’s it! You are now using two Amazon cloud services to distribute and deliver files to your website efficiently and much more cost effective than before!

Side note: If you’re comfortable setting up CNAME you can create one to hide the dirty URL that Amazon gives you. This means that a URL such as http://d34k2wyjxt4ma5.cloudfront.net/anthony.jpg and simply become http://media.room3064.com/anthony.jpg. To do this you will need to edit your DNS settings with your webhost that is managing your website.

Summary

Hopefully by now you have a better idea of what the cloud is and how you can use it to deliver content on your website much more efficiently and maybe save you some money as well. As the cloud evolves and standards and services become more available, the idea of the cloud can be used to host a website in it’s entirety! Actually for files that are accessed by more than one web location, we can be much more efficient with delivering these files using the cloud. Get use to the idea that a file doesn’t have one simple location (or cached location) to access it, yet it’s true location is managed and delivered by the cloud to speed up efficiency.

I think as the potential behind the technology and services will create a whole new dynamic for how we build, design, and manage websites.

So, are you on the cloud yet?

Automatically progress through form fields for phone, date and social security number input using Javascript

Posted on Oct 27th, 2009 in Javascript | 0 comments

Scenario:
You want your users to enter a phone or social security number with 3 separate web forms, but you don’t want the user to hit [Tab] to progress to the next form field. Have you ever noticed on some forms that as you type the numbers it automatically moves you to the next form box? Here’s a little javascript technique to achieve this functionality on your site.

Here’s an example:
Enter your phone:

Did you notice how as you entered your phone number it automatically moved to the next form field box for you?

Here’s how you can do this:

Add the following Javascript code below to the head of your site:

<script type="text/javascript">
function autoFormAdvance(afterNumChars,currentFormId,nextFormId) {
	if(document.getElementById(currentFormId).value.length==afterNumChars) {
		document.getElementById(nextFormId).focus();
	}
}
</script>

The next step is to create your form elements. Each of these form elements must have an id attribute to identify them to the javascript.

Here’s an example of HTML code:

1
2
3

<input type="text" onkeyup="autoFormAdvance(3,'areaCode','phonePre')" id="areaCode" maxlength="3" size="3"/>
<input type="text" onkeyup="autoFormAdvance(3,'phonePre','phoneSuf')" id="phonePre" maxlength="3" size="3" />
<input type="text" id="phoneSuf" maxlength="4" size="4"/>

If you notice in the code above, the autoFormAdvance function is being called upon an onKeyUp action for that form element.

There are 3 values the autoFormAdvance function takes:

afterNumChars – This is the number of characters it will take to move to the next form field
currentFormId - This is the current form ID
nextFormId - This is the form ID that you want to automatically progress too

Notice you don’t need to add the action on the last form element since, at this point, you’ve completed entering the data.

Further Suggestions:

Set the maxlength of each form field to truly limit the number of characters this field can hold
Set the six of each form field to match the length of the input. This will help save space and make your form look nicer.

A Quick Introduction

Posted on Oct 27th, 2009 in General | 0 comments

There’s something beautiful in code, how the beauty isn’t necessarily in the visual code itself, but what it represents. This blog is dedicated to my passion for coding and sharing my code snippets that I write or recommend along the way.

I’ve written a lot of the years and this is me giving a little something back. You can learn more about me here or see some of my open source code projects here.

As for now, I hope I can share with you a few things…