Andre Bovee-Begun

Bridge Blogging with WordPress 101: Customizing and Extending Hand Diagrams

Hi there! As the shiny new marketing intern at Master Point Press, one of my many duties is helping out with the care and feeding of BridgeBlogging.com, a great collection of frequently updated blogs about all things Bridge-related, ranging from the personal to the analytical, the brief to the compendious. One thing all our blogs have in common are handy and attractive visual features like suit symbols, and advanced formatting options. Unfortunately, these can be a little difficult to use. That’s why I’m creating this series of articles for practicing or aspiring bridge bloggers, designed to show off the ease and capabilities of the WordPress blogging software we use. Today’s installment shows you how to create unusual hand diagrams like South-alone or West-North.

Of all the features that a WordPress blog that are useful for Bridge blogging, the ability to create hand diagrams, auction tables, and suit symbols is one of the most valuable. As our bloggers know, they have access to that feature through the “Spade” Screen shot 2011-03-11 at 2.43.00 PM button on the WordPress editing page for their blog. But as useful as these templates are, it’s easy to think of situations they don’t cover—like when you want to discuss a defensive situation using a West-North hand diagram, or present a bidding problem using a South-alone hand diagram. Luckily, you can quickly and easily modify the hand-diagram basic templates to suit such situations. Customizing hand diagram tables is a simple process once you get the hang of a few buttons on the WordPress editing toolbar.


Making West-North Diagrams

Two very important buttons are “Delete Row”Screen shot 2011-03-11 at 11.14.37 AMand “Delete Column”Screen shot 2011-03-11 at 11.26.07 AMbuttons.

You can use these two buttons to pare down a large hand diagram into one that only shows the sections you want to use. To illustrate how, I’m going to create a few customized hand diagrams by modifying the basic templates using these buttons on the WordPress Toolbar. First, click the spade and create a table. I’m going to create an West-North diagram, so I’ll start with a four-hand diagram because it includes North and West. Then I’ll delete the unwanted rows and columns, which I’ve indicated by marking them in red below just for the sake of demonstration.

Dealer: Vul: North
West East
South

As you can see, the bottom horizontal row and the right-most vertical column have to be eliminated. To do that, I’ll click inside one of the cells on the bottom row to place the cursor there. Then you’ll click the “Delete Row” Screen shot 2011-03-11 at 11.14.37 AM button in the toolbar, and here is what happens:

Dealer: Vul: North
West East

Please note that the “Delete Row” Screen shot 2011-03-11 at 11.14.37 AM button only appears when the cursor is inside the table, so if you can’t see it, that probably means you still need to click inside one of the table cells you want to delete.

Having done that, next you need to delete the right-most vertical column, so you’ll click inside one of its cells to place the cursor there, and then click the “Delete Column” Screen shot 2011-03-11 at 11.26.07 AM button.

Dealer: Vul: North
West

Voila! An West-North hand diagram, ready to fill in. But I don’t want the “Dealer” and “Vulnerable” text to show up in this diagram, so you just manually delete those words. Here is how the table will look online:

North
West

Making North-East Diagrams

Making a North-East diagram is a similar process. You can start with another four-hand diagram, since it contains both North and East:

Dealer: Vul: North
West East
South

First, delete the bottom row using “Delete Row” Screen shot 2011-03-11 at 11.14.37 AM. Then, click inside the left-most vertical column like so:

Dealer: Vul: [PUT CURSOR HERE!] North
West East

Then click the “Delete Column” Screen shot 2011-03-11 at 11.26.07 AM button. Remember that your cursor has to be inside the table before the button will appear. By first creating a four-hand diagram and then deleting one row and one column, you end up with a table that looks like this:

North
East

Done! But what about that empty cell in the top-left corner? Not a problem: As long as a table cell doesn’t contain anything, it won’t show up once your blog is published. It is only visible in the editor window because WordPress shows the borders of your table so that you can easily see the table’s structure. If you want a certain cell to be invisible, simply delete all its contents.


What if you want a North-East hand diagram that shows Dealer and Vulnerable? In that case, you don’t want to delete the left-most vertical column, only the West cell. Individually click inside the West cell of the table and manually erase the text inside by selecting it and hitting delete, like so:

Dealer: Vul: North
West East

And here you go, one North-East diagram showing Dealer and Vulnerable:

Dealer: Vul: North
East

Done!


Making South-Alone Diagrams

Now that you know them, you can extend these methods to create other kinds of tables from the basic templates given by the Spade button. For example, to create a South Hand Diagram, you would simply create a North-South diagram and then use “Delete Row” Screen shot 2011-03-11 at 11.14.37 AM to delete the top two horizontal rows, turning this:

North
South

…into this:

South

That’s all for today! I hope that this helps you in your blogging, and maybe gives you a few ideas for future posts. WordPress has lots of buttons and features to handle visual formatting. To name a few:

The “Insert Row” Screen shot 2011-03-11 at 12.20.19 PM and “Insert Column” Screen shot 2011-03-11 at 12.24.22 PM buttons are handy for adding extra rows to extend auction tables.

If you click the “Show Kitchen Sink” button Screen shot 2011-03-11 at 12.06.04 PM you will see a whole slew of extra buttons magically appear, which are used mainly for changing the appearance of your text. You have to be very careful with these, as they will sometimes do unexpected things and may cause your text to display wrong on some computers. That’s why they are hidden by default, but options like text color, subscript, and superscript are sometimes nice to have access to. If you’re feeling bold (or blue) then try creating a new post just to experiment with WordPress’s many buttons—just remember one rule: until you’ve gotten the hang of it, only experiment with text you don’t mind losing. As always, questions, concerns, rants, and raves can all be addressed to me in the comments or at andre@masterpointpress.com.

Leave a comment

Your comment