if ( function_exists('register_sidebar') ) {

    $allWidgetizedAreas = array("Homepage Left", "Homepage Right", "Sidebar One", "Movies", "Admin");
    
    foreach ($allWidgetizedAreas as $WidgetAreaName) {
    
        register_sidebar(array(
           'name'=> $WidgetAreaName,
           'before_widget' => '<div id="%1$s" class="widget %2$s left half">',
           'after_widget' => '</div>',
           'before_title' => '<h3 class="widgettitle">',
           'after_title' => '</h3>',
        ));
    
    }

}

Like the article? Get the book!

© 2010 Digging into WordPress | Permalink | Comments | Add to Delicious
Categorized: PHP | Tagged: functions, PHP, widgets

Direct Link to Article — Permalink on DiW

Like the article? Get the book!

© 2010 Digging into WordPress | Permalink | Comments | Add to Delicious
Categorized: Links | Tagged:

Direct Link to Article — Permalink on DiW

Like the article? Get the book!

© 2010 Digging into WordPress | Permalink | Comments | Add to Delicious
Categorized: Links | Tagged:

1. Using CSS3 and progressive enhancement
2. Multiple columns by filtering the_content
3. More flexible multiple columns
4. Multiple loops displayed in multiple columns
5. Display your posts in horizontal display order with two columns
6. Bonus: Display your category list in two columns

1. Using CSS3 and progressive enhancement

I think the easiest way to display your content in multiple columns is to apply a little CSS3 in progressively enhancing fashion. Let’s say you have the following markup:

<div class="content">
	<p>Lorem ipsum..</p>
	<p>Lorem ipsum..</p>
	<p>Lorem ipsum..</p>
</div>

We can add the following CSS to display the content in multiple columns:

.content {
	  -moz-column-count: 3;
	  -moz-column-gap: 10px;
	  -moz-column-rule: none;
	  -webkit-column-count: 3;
	  -webkit-column-gap: 10px;
	  -webkit-column-rule: none;
	column-count: 3;
	column-gap: 10px;
	column-rule: none;
	}

This will display your content in three columns with a 10px gap between each. This technique is a great way to enhance the display of your content for people running cool modern browsers like Safari and Firefox. What about folks visiting with Internet Exploder or older browsers? They will see your content displayed in a single column, just like they would have before you applied the multiple columns. Note that you can specify any number of coulmns and any width for the gap.

2. Multiple columns by filtering the_content

If you need something a little more “universal” than what is currently available with CSS3, we can always dig into our template files, modify things at the PHP/(X)HTML level, and then style accordingly. Here is the technique provided by Kriesi.at:

function my_multi_col($content) {

	$columns = explode('<h2>', $content);
	$i = 0;

	foreach ($columns as $column) {
		if (($i % 2) == 0) {
			$return .= '<div class="content_left">'."\n";
			if ($i > 1) {
				$return .= "<h2>";
			} else {
				$return .= '<div class="content_right">'."\n <h2>";
			}
			$return .= $column;
			$return .= '</p></div>';
			$i++;
		}
		if(isset($columns[1])) {
	    		$content = wpautop($return);
		} else {
	    		$content = wpautop($content);
		}
		echo $content;
	}
}
add_filter('the_content', 'my_multi_col');

Just place that into your active theme’s functions.php file and then apply the following CSS:

.content_right, .content_left{
	float: left;
	width: 45%;
	}
.content_left{
	padding-right: 5%;
	}

Once implemented, this multi-column technique creates a a column for each instance of <h2> found within the post content. Thus, be sure to limit the number of <h2> elements to two in order to avoid layout breakage. Note that you could also modify the code to use a different element if the <h2> tag isn’t good for you. Multiple columns doesn’t get much easier, but just in case you need an alternate method for whatever reason, read on for some more great techniques.

3. More flexible multiple columns

The previous method works nice for two columns and no fuss, but for three or more columns we’re going to need something a little more robust. fortunately, Rob Searles shares a technique that allows any number of columns with completely different content in each. This technique creates columns based on multiple instances of the <!--more--> tag. There are several caveats, so check the orginal article for all the details.

Here are the steps involved in implementing this technique:

1. Add the my_multi_col_v2 function to your functions.php file
2. Add another snippet to your theme template file, for example page.php
3. Add some CSS to format the markup into columns
4. Add a couple of <!--more--> tags in your post or page to create the three columns

1. Let’s go through these steps, beginning with the main function that you should place into your theme’s functions.php file:

function my_multi_col_v2($content){
	// run through a couple of essential tasks to prepare the content
	$content = apply_filters('the_content', $content);
	$content = str_replace(']]>', ']]>', $content);
 
	// the first "more" is converted to a span with ID
	$columns = preg_split('/(<span id="more-\d+"><\/span>)|(<!--more-->)<\/p>/', $content);
	$col_count = count($columns);
 
	if($col_count > 1) {
		for($i=0; $i<$col_count; $i++) {
			// check to see if there is a final </p>, if not add it
			if(!preg_match('/<\/p>\s?$/', $columns[$i]) )  {
				$columns[$i] .= '</p>';
			}
			// check to see if there is an appending </p>, if there is, remove
			$columns[$i] = preg_replace('/^\s?<\/p>/', '', $columns[$i]);
			// now add the div wrapper
			$columns[$i] = '<div class="dynamic-col-'.($i+1).'">'.$columns[$i].'</div>';
		}
		$content = join($columns, "\n").'<div class="clear"></div>';
	}
	else {
		// this page does not have dynamic columns
		$content = wpautop($content);
	}
	// remove any left over empty <p> tags
	$content = str_replace('<p></p>', '', $content);
	return $content;
}

2. Once that’s in place, replace your the_content() tag with the following code:

$content = get_the_content('',FALSE,''); // arguments remove 'more' text
echo my_multi_col_v2($content);

3. The last bit of code that we need to setup is the CSS to make it all sweet:

/* dynamic columns */
div.dynamic-col-1 { float: left; width: 38%; padding-right: 2%;}
div.dynamic-col-2 { float: left; width: 38%;padding-right: 2%;}
div.dynamic-col-3 { float: left; width: 20%;}
div.clear { clear: both; }

4. And last but not least, remember to add the two <!--more--> tags in your post/page content to create the three columns.

That’s all there is to it. Pretty good stuff, but even so, there are even more alternatives available. next we’ll look at a technique for displaying multiple loops in multiple columns.

4. Multiple loops displayed in multiple columns

Not too long ago, I wrote a post at Perishable Press explaining how to display multiple loops with multiple columns. The final product will look display something like this:

• First column, first loop: display posts #1-5
• Second column, second loop: display posts #6-10
• Third column, third loop: display posts #11-15

Using WordPress and a little CSS, this configuration is relatively easy to accomplish. Let’s cut right to the chase..

Step 1: Setup the multiple loops

The first thing we want to do is replace the standard WordPress loop with the following code:

// FIRST LOOP: display posts 1 thru 5
<?php query_posts('showposts=5'); ?>
<?php $posts = get_posts('numberposts=5&offset=0'); foreach ($posts as $post) : start_wp(); ?>
<?php static $count1 = 0; if ($count1 == "5") { break; } else { ?>

<?php the_title(); ?>
<?php the_content(); ?>

<?php $count1++; } ?>
<?php endforeach; ?>


// SECOND LOOP: display posts 6 thru 10
<?php query_posts('showposts=5'); ?>
<?php $posts = get_posts('numberposts=5&offset=5'); foreach ($posts as $post) : start_wp(); ?>
<?php static $count2 = 0; if ($count2 == "5") { break; } else { ?>

<?php the_title(); ?>
<?php the_content(); ?>

<?php $count2++; } ?>
<?php endforeach; ?>


// THIRD LOOP: display posts 11 thru 15
<?php query_posts('showposts=5'); ?>
<?php $posts = get_posts('numberposts=5&offset=10'); foreach ($posts as $post) : start_wp(); ?>
<?php static $count3 = 0; if ($count3 == "5") { break; } else { ?>

<?php the_title(); ?>
<?php the_content(); ?>

<?php $count3++; } ?>
<?php endforeach; ?>

That’s the juice right there. We have three loops, each displaying five posts. The first loop displays the first five posts, the second loop displays the next five posts, and the third loop displays the next five posts. Thus, this multiple-loop configuration displays the most recent 15 posts, each of which being unique. See the original post for more information, options and details.

Step 2: Markup your theme template file(s)

Now that we have the PHP in place, we are ready to add the (X)HTML markup required for the final three-column configuration. There are many ways to accomplish this, this is merely one of them:

<div id="column_01">

	<!-- FIRST LOOP -->

</div>

<div id="column_wrap">

	<div id="column_02">

		<!-- SECOND LOOP -->

	</div>
	<div id="column_03">

		<!-- THIRD LOOP -->
	
	</div>

</div>

Here, each of the three loops will be placed into its own div, which then will be styled with a little CSS to transform it into one of the three columns. Note that you may want to change the id names of the divisions to better represent the particular semantics of your document. Now let’s move on to the CSS..

Step 3: Styling the columns with CSS

The final step in the tutorial is to style the markup with CSS. Nothing too fancy, really. Creating the columns is merely a matter of floating the individual divs and applying a width to each of them:

/* three column layout */
div#column_01 {
	float: left;
	clear: none;
	width: 30%;
	}
div#column_wrap {
	float: right;
	clear: none;
	width: 60%;
	}
	div#column_02 {
		float: left;
		clear: none;
		width: 45%;
		}
	div#column_03 {
		float: right;
		clear: none;
		width: 45%;
		}

The trick here is to use width values that will create the correct column widths. The values used in the example produce three columns of approximately equal width. Again, for more information on the details of this technique, see the original post.

Once you get everything setup, your posts should display your multiple-loop content in multiple columns, with each column showing the contents of a different loop. This is a great way to customize your theme, making it possible to present lots of disparate information within an easy-to-understand layout. Even so, this technique may not do it for you either. If so, we’ve got a couple more WordPress tricks up our sleeve!

5. Display your posts in horizontal display order with two columns

That’s a mouthful, isn’t it? What we’re doing in this section is changing the order in which your two-column posts appear on the page. Typically, your two-column layout displays posts like this:

Post #1   |   Post #4
Post #2   |   Post #5
Post #3   |   Post #6
 .        |    .
 .        |    .
 .        |    .

All of the multi-column methods we’ve discussed so far result in this sort of post-display order. So now we want to change things up a bit and display our two-column posts in horizontal display order, like so:

Post #1   |   Post #2
Post #3   |   Post #4
Post #5   |   Post #6
 .        |    .
 .        |    .
 .        |    .

How is this accomplished? As explained in my horizontal-display tutorial, this is easily accomplished using two default loops and the rewind_posts() function. The first loop will display the posts in the first column, while the second loop will display the posts in the second column. To do this, we use PHP’s modulus operator to filter out every other post from the first loop, which will display posts in horizontal order.

To make this happen, first replace your default WordPress loop with the following code:

<?php if (have_posts()) : while(have_posts()) : $i++; if(($i % 2) == 0) : $wp_query->next_post(); else : the_post(); ?>

<div id="left-column">
<h1><?php the_permalink(); ?></h1>
<?php the_content(); ?>
</div>

<?php endif; endwhile; else: ?>
<div>Alternate content</div>
<?php endif; ?>

<?php $i = 0; rewind_posts(); ?>

<?php if (have_posts()) : while(have_posts()) : $i++; if(($i % 2) !== 0) : $wp_query->next_post(); else : the_post(); ?>

<div id="right-column">
<h1><?php the_permalink(); ?></h1>
<?php the_content(); ?>
</div>

<?php endif; endwhile; else: ?>
<div>Alternate content</div>
<?php endif; ?>

With that code in place, oddly numbered posts will appear within a division identified with an attribute of id="left-column". Likewise, even-numbered posts will appear within a division identified with an attribute of id="right-column". Thus, we may apply the following CSS to position the divisions as two adjacent columns:

div#left-column {
	width: 333px;
	float: left;
	clear: none;
	}
div#right-column {
	width: 333px;
	float: right;
	clear: none;
	}

Of course, when it comes to configuring the WordPress loop and styling your page with CSS,
anything is possible. Feel free to experiment and adapt this technique to suit your own diabolical purposes ;) As with the other methods described in this DiW post, much more information is available for this technique at the original article, including a nice, CSS-only method that is sure to leave you breathless.

6. Bonus: Display your category list in two columns

Using a little PHP magic, we can get WordPress’ wp_list_categories() to display our categories in two columns. As Blog Oh Blog explains, all you need is the following code placed in your theme file:

<?php // display categories in two columns
$cats = explode('<br />', wp_list_categories('title_li=&echo=0&depth=1&style=none'));
$cat_n = count($cats) - 1;
for ($i = 0; $i < $cat_n; $i++):
	if ($i < $cat_n/2):
		$cat_left = $cat_left.'<li>'.$cats[$i].'</li>';
	elseif ($i >= $cat_n/2):
		$cat_right = $cat_right.'<li>'.$cats[$i].'</li>';
	endif;
endfor; ?>

<ul class="left">
	<?php echo $cat_left; ?>
</ul>
<ul class="right">
	<?php echo $cat_right; ?>
</ul>

Just use that code where you would like the categories to appear and enjoy the results.

Wrapping it up

Hopefully these techniques will inspire and enable you to break out of the “single-column” mindset and explore some multi-column possibilities. Using multiple columns for your content is a great way to enhance the visual appeal of your design and readability of your content.

There is SO much you can do with WordPress, PHP, (X)HTML, and CSS. The possibilities are endless indeed. The multiple-column techniques presented in this article provide a great starting point for creating more elaborate and sophisticated page layouts. So experiment, have fun, and be safe!!

Like the article? Get the book!

© 2010 Digging into WordPress | Permalink | 16 comments | Add to Delicious
Categorized: CSS, Design | Tagged: CSS, loop, PHP, posts

<div <?php post_class() ?> id="post-<?php the_ID(); ?>">
   <!-- Post stuff -->
</div>

I was in a circumstance where I wanted to add an additional class to what that was outputting. My thought process went like this:

1. Arg. I guess I’m going to have to write a function to filter the output of that function. Let’s begin the research.
2. Wait. I bet that function has an alternate that returns a string rather than echos it. I’ll just use that, and echo it out along with my own custom class.
3. Double wait. I bet those smart WordPress folks have thought of this…

1. Filtering

This kind of thing is generally beyond my comfort zone, but you’d basically write your own little function which takes in what the output would have been, add you own stuff to it, then return the new value.

Then call the new function with a filter in your functions.php file:

add_filter('post_class','add_my_stuff');

2. Output exiting classes, then add yours

Like most functions that echo stuff, there is a version that doesn’t echo stuff, in which “get_” prefaces the function name. I didn’t even have to look it up I just knew there would be. Since it’s a list, this function returns an array, so to output them, you’ll need to loop through the array:

<div class="<?php $allClasses = get_post_class(); foreach ($allClasses as $class) { echo $class . " "; } ?> group" id="post-<?php the_ID(); ?>">

The cool part here is that is doesn’t add “class=” in the output, you can do that yourself, meaning that I can add my own classes after the output is finished.

3. Built in…

Of course, as it turns out, this is far easier than #2 made it out to be. To add additional classes, just pass them as a parameter!

<?php post_class('special'); ?>

Like the article? Get the book!

© 2010 Digging into WordPress | Permalink | 2 comments | Add to Delicious
Categorized: PHP | Tagged: classes, functions, Theme

While I’m 98% a WordPress guy, there are a few circumstances I might take the EE route, like when:

1) I knew I was going to need a whole bunch of different custom data types and groups and didn’t feel like dealing with the whole Pods or Flutter setup.

2) I also knew no newbie client was going to need to get in there.

Direct Link to Article — Permalink on DiW

Like the article? Get the book!

© 2010 Digging into WordPress | Permalink | Comments | Add to Delicious
Categorized: Links | Tagged:

But alas…

This ain’t gonna work “out-of-the-box”

After tinkering with some far-too-complicated solutions, someone on Twitter helped me with a deliciously simple solution: Just add this to your functions.php file:

add_filter('widget_text', 'do_shortcode');

This will ensure that the text content of widgets is parsed for shortcodes and those shortcodes are ran. Awesome.

Stephanie Leary wrote a great article on Using Shortcodes Everywhere, which covers this as well as using shortcodes in a bunch of other places: Comments, templates, excerpts, etc.

Like the article? Get the book!

© 2010 Digging into WordPress | Permalink | 4 comments | Add to Delicious
Categorized: PHP | Tagged: shortcode, widgets

If you are a seasoned plugin developer, you already know how to hook it up at the WordPress Directory, but for those who don’t, this DiW tutorial will show you everything you need to know.

Why host your plugin at the WP Directory?

Some of the benefits of hosting your plugin at the WordPress Plugin Directory:

• Track basic statistics regarding how many people are downloading and when
• Provide a centralized location for users to leave comments and feedback
• Get your plugin rated against the many other hosted WordPress plugins
• And of course, give your plugin greater exposure to the WP community

Further, it seems that plugins hosted at the official directory are perceived to be associated with a greater degree of “trustworthiness.” People trust WordPress, and they also trust the various resources (plugins, themes, etc.) made available to them through the wordpress.org website. Basically, if you’re writing plugins for the WordPress community, you should be sharing them with as many people possible. The Plugin Directory does this exceedingly well.

“Worth playing for?” Let’s look at a quick overview before digging into the specifics of getting your plugin added to the Directory..

Overview

To help get a sense of direction before getting started, consider this overview of events:

• Write and prepare your plugin
• Prepare the readme.txt file
• Sign up for access to the Subversion Repository
• Wait for approval and SVN access information
• Use Subversion software to upload your plugin files
• Wait a few minutes for the system to add your plugin to the Plugin Directory

Of course, the big hurdle that many “would-be” contributors have is using the SVN/Subversion system and software. To be honest, this was one of the reasons why I never bothered adding my other plugins, but now that I’ve seen how easy it actually is (once you learn it), I will most likely add my other plugins as well (eventually).

First steps

First, get your plugin and files ready. You don’t need to compress anything with zip or tar because the SVN system will do that automatically for you based on the contents of your plugin. In my case, the plugin was Block Bad Queries, which contains the following two files:

• block-bad-queries.php
• readme.txt

The actual plugin file is the “block-bad-queries.php”. The “readme.txt is the only other required file. If you have multiple plugin files, that’s fine too, they will be uploaded and managed together during the subversion process.

For more information on getting things ready, check out Plugin Submission and Promotion at the Codex. A key factor in the process is a well-written readme.txt file, which we’ll look at next..

Pimp your readme.txt file

I think having a well-prepared readme.txt file is one of the things that helped everything go smoothly for my first time out. Your plugin’s readme.txt is used for the content of the various pages in a typical plugin listing:

• Plugin Name
• Description
• Installation
• Faq
• Screenshots
• Other Notes
• Changelog
• Stats
• Admin

That’s basically it. If your readme.txt contains each of these sections, you should be good to go. There are various details required for certain sections, such as the opening “Plugin Name” information, which requires the following specifics (using BBQ as an example):

=== Plugin Name ===

Contributors: Jeff Starr
Plugin Name: Block Bad Queries
Plugin URI: http://perishablepress.com/press/2009/12/22/protect-wordpress-against-malicious-url-requests/
Tags: wp, protect, php, eval, malicious, url
Author URI: http://perishablepress.com/
Author: Perishable Press
Requires at least: 2.3
Tested up to: 2.9
Stable tag: 1.0
Version: 1.0 

I think we’re all familiar with this type of information – something similar is included at the top of virtually every plugin (and theme) in existence. In any case, this is the first part of a proper readme.txt file, as seen in the WordPress/bbPress plugin readme file standard, which also contains details and further information about the various requirements.

So, to put all of this together and create your own readme.txt file, just copy & paste the following template into a blank .txt file and flesh it out with your own details:

=== Plugin Name ===

Contributors:      (plugin contributors)
Plugin Name:       (name of your plugin)
Plugin URI:        (web page for plugin)
Tags:              (tags for the plugin)
Author URI:        (plugin authors site)
Author:            (the plugin's author)
Donate link:       (a link for donating)
Requires at least: (minimum required WP) 
Tested up to:      (tested WP up to ver)
Stable tag:        (plugin's stable ver)
Version:           (plugins current ver)

== Description ==

== Installation ==

== Upgrade Notice ==

== Screenshots ==

== Changelog ==

== Frequently Asked Questions ==

== Donations ==

Aside from wanting to put the “Plugin Name” section at the top of the file, these different sections can be rearranged in any order, but they all need to be present in order to adhere to WordPress guidelines and pass the readme validation. For more information on fleshing out each of these different sections, check out the standard readme.txt example. Once you get everything pimped and ready, the readme validator will display the good news:

Your readme.txt rocks. Seriously. Flying colors.

If you don’t see this message, you’ll get a list of things that need fixed in order to pass validation. The validator is a great tool that makes it easy to put together a proper readme.txt file.

A few notes on the readme file

Here are a few notes that I found helpful while creating the readme.txt file:

• The readme file uses markdown for marking up your info with links, lists and so on.
• You may use PHP in your readme content (escape with backticks: `<?php ?>`)
• Use asterisks for *emphasized text*
• Use double asterisks for **strong text**

As you can see, the readme.txt file is quite flexible, enabling you to customize your plugin’s information as provided in the Plugin Repository.

Prepare the plugin file

After creating and testing your plugin, you need to give it a license. Here is what the WordPress Codex has to say about it:

• Your plugin must be GPLv2 Compatible.
• The plugin most not do anything illegal, or be morally offensive.
• You have to actually use the subversion repository we give you in order for your plugin to show up on this site. The WordPress Plugins Directory is a hosting site, not a listing site.
• The plugin must not embed external links on the public site (like a “powered by” link) without explicitly asking the user’s permission.
• If you don’t specify a v2-compatible license, what you check in is explicitly GPLv2.

Once you’ve given your plugin the required license — either explicitly by including the license or implicitly by not including any license — you’re ready to get hosted at the Repository. Take a few deep breaths and clear your mind..

Sign up for access to the Plugin Repository

Now with your plugin files ready to go, visit the Sign-up page, login to your account, and fill out the form with the following information:

• Plugin Name (required)
• Plugin Description (required)
• Plugin URL

After submitting the form, be prepared to wait awhile to be approved access to the subversion repository. For my plugin, it took around 18 hours to receive a response. Just be patient, if everything looks good, someone will approve your request within a reasonably undefined amount of time. Eventually, you should receive an email with all the information you need to access the Subversion Repository. This is where you will upload and store your plugin. The system will use the files and information included in the Subversion Repository to generate the actual web pages that appear in the Plugin Directory with all of the other plugins. It usually takes a few minutes for the system to create your plugin’s entry, so be patient after uploading. Just as a general reference, I think I waited something like five or ten minutes before seeing my plugin listed in the Plugin Browser.

Use Subversion software to upload your plugin files

At this point, you’ve been granted access to the SVN repository and are ready to upload your files and call it done (until the next plugin update). To begin this task, familiarize yourself (if necessary) with the basics of using Subversion with WordPress.

There’s a LOT to learn about Subversion, but don’t let that stop you from making quick use of it to get the job done.

What is Subversion?

Basically, Subversion is an open-source piece of software that people use to more easily manage files and directories as they change over time. The key thing about Subversion is that it enables you to restore previous versions of your data and understand how things have changed. This “time-machine” functionality is especially useful for managing things like continually changing source code, and makes managing thousands of plugins much easier.

How do I use Subversion?

To use Subversion, you’ll need some software. Mac people get it pre-installed with Leopard, and Windows peeps can download the binary installer here. Keep in mind that, for either operating system, Subversion is something you run through either Terminal (Mac) or the Command Prompt (Win) as a series of commands. As you can imagine, there are a gazillion commands available, but we’ll only be needing a select few for our purposes here.

Please don’t make me use the command line!

If the thought of using the command line to run software makes your stomach turn, you can use Subversion through a graphical interface such as Versions for Mac, and/or
Tortoise for Windows. I haven’t used either of these apps, but they certainly look more inviting than the command prompt, which is what we’re rolling with for this tutorial.

How does it work?

There are two sets of files we’re working with: local files (on your computer) and remote files (on the server). For each set of files, we want the following directory structure (using my plugin as an example):

root-folder/
	/trunk/
		block-bad-queries.php
		readme.txt
	/branches/
	/tags/

To get started, we’ll place our files into the /trunk/ directory, and then in the future add new versions to either the /branches/ directory (for major updates) or /tags/ directory (for minor updates).

Once uploaded, your files are stored in the central plugin repository on WordPress servers. From the repository, anyone can check out a copy of your file(s), but only you (the plugin author) have the authority to check in new file(s). Using Subversion, any changes made to your local files are mirrored exactly on the server, and eventually reflected in your plugin pages in the WordPress.org plugin directory.

Add your plugin to the Repository

Now that we have our files ready and Terminal (or Command Prompt) open, let’s wrap this up and upload our files to the Plugin Repository. Here’s an overview of what we’re going to do:

1. Check out the blank repository (i.e., the empty directory structure)
2. Add your files to the local /trunk/ directory on your computer
3. Update the repository with copies of your local files

Here’s how to do it with Mac Terminal, and it’s very similar for Windows Command Prompt:

$ mkdir my-local-dir
$ svn co http://svn.wp-plugins.org/your-plugin-name my-local-dir
$ cd my-local-dir/
my-local-dir/$ cp ~/my-plugin.php trunk/my-plugin.php
my-local-dir/$ cp ~/readme.txt trunk/readme.txt
my-local-dir/$ svn add trunk/*
my-local-dir/$ svn ci -m 'add some notes here'

And here are the same commands with comments and returned messages:

# create a local folder for your copy of the repository

$ mkdir my-local-dir

# download the empty directory structure to your new folder

$ svn co http://svn.wp-plugins.org/your-plugin-name my-local-dir
> A	my-local-dir/trunk
> A	my-local-dir/branches
> A	my-local-dir/tags
> Checked out revision 11325.

# copy your plugin files to the local trunk directory

$ cd my-local-dir/
my-local-dir/$ cp ~/my-plugin.php trunk/my-plugin.php
my-local-dir/$ cp ~/readme.txt trunk/readme.txt

# register the new files with Subversion

my-local-dir/$ svn add trunk/*
> A	trunk/my-plugin.php
> A	trunk/readme.txt

# update the Repository with the new files

my-local-dir/$ svn ci -m 'add some notes here'
> Adding	trunk/my-plugin.php
> Adding	trunk/readme.txt
> Transmitting file data ..
> Committed revision 11326.

# All done!

That may look like a mouthful, but it’s actually only about seven commands, even fewer if you manually create the directory structure and add the local files yourself. You should also keep the following notes in mind if you are new to the whole “command line” thing:

• Any line prefixed with a pound sign # is a comment and should not be used as a command.
• Lines beginning with a ”>” character indicate a response from the software and should not be used as a command.
• All of the specific file and directory names need to be changed to match your own.
• The “-m 'add some notes here'” in the last command is used to add notes for the event — they may be anything you wish (or none at all).
• At the last step, you may be prompted for your username and password, which should be the same as used when logged into the WordPress.org site.

After running those commands, your plugin will be in the Repository and ready for the system to automatically create your actual plugin pages as they will appear in the Plugin Directory. This usually takes some time, so grab a drink and kick back for around five to ten minutes. Eventually, you will see your plugin appear on the Newest Plugins page, and then also at its dedicated page, which will be something like this:

http://wordpress.org/extend/plugins/your-new-plugin/

Once you get this far, you’re golden. There are many other cool things you can do with Subversion to manage and update your plugin. To get started with updating and tagging, check out the How to Use Subversion in the Plugin Directory. And for even more information on the entire process of adding your plugins, check out the Plugin Developer FAQ.

Final thoughts..

Overall, getting my first plugin hosted at the WordPress Plugin Directory was a great learning experience that will make it easy to add other plugins in the future. Hopefully the fruits of my labor will help you when adding your own plugins to the Directory. As always, feel free to chime in with suggestions, questions and concerns about any of the techniques described here. It would be great to hear more about using Subversion (tips, tricks, etc.).

Also, if you are interested, you can see the result of all this work by checking out the Block Bad Queries (BBQ) Plugin at the Plugin Directory. There’s still a few details that need to be added/tweaked, but it’s great just having it in there.

Like the article? Get the book!

© 2010 Digging into WordPress | Permalink | 7 comments | Add to Delicious
Categorized: Plugins | Tagged: plugin, svn

Instead of services that read your feeds (e.g. Google Reader) having to ASK for your feed periodically, now they can instead just wait until YOUR SITE notifies THEM. Basically a “push” service.

It seems to me this is half the equation. The other half is building services that accept these push notifications. I’m not sure who is already doing that, but I wouldn’t be surprised if Google is on it, since it seems like a more efficient way of doing things on both sides (less server resources on both sides).

Two concerns I can think of:

1. Is this just as reliable as the “old” way? People not getting feed updates because of a hiccup in the chain sucks for everyone.
2. This makes “accidentally” hitting that publish button potentially even more embarrassing than it already can be. Like when you accidentally publish a post instead of a page.

Also check the overview slideshow here.

Direct Link to Article — Permalink on DiW

Like the article? Get the book!

© 2010 Digging into WordPress | Permalink | Comments | Add to Delicious
Categorized: Links | Tagged:

Direct Link to Article — Permalink on DiW

Like the article? Get the book!

© 2010 Digging into WordPress | Permalink | Comments | Add to Delicious
Categorized: Links | Tagged: