Categories
Web Development

Webinar on Facebook Tab Manager for WordPress

I am hosting a webinar Thursday April, 14 2011 at 7 pm ET on the use of the Facebook Tab Manager WordPress plugin I created, which allows a website operator to include blog posts and other content on a Facebook page for a business, campaign, or other organization. For an example, see the “Clip File” tab on http://www.facebook.com/carrcomm.

Thursday April, 14 2011 at 7 pm ET, details: http://www.anymeeting.com/davidfcarr

I will present a tutorial and answer questions.

I also want to hear from those of you who have done interesting things with Facebook Tab Manager.

Background: Facebook Tab Manager is a WordPress plugin that lets you incorporate blog and website content into a Facebook page for a business or organization. You can create posts specifically for Facebook and designate content that will only be shown to people who Like your page

Categories
Clips Forbes.com

Forbes.com: Custom iPad App Is Just What the Doctor Ordered

Latest blog post for Forbes.com:

Custom iPad App Is Just What the Doctor Ordered

For Salient Surgical Technologies, a custom iPad app is just what the doctor ordered — or, rather, just the trick to get the doctor to place an order.

“The thing about medical device sales is that it’s very difficult to get attention of doctors – any attention at all,” said David Hohler, Salient’s IT director. So anything he can provide to make a sales representative’s life easier is priceless. That made it well worth his while to hire the Boston-based mobile application development firm DreamingCode to create a custom app that presents the equivalent of many binders worth of product literature, plus videos, in a navigation scheme organized around the parts of the body. (Read More)

 

Categories
BrainYard Clips

Facebook iFrames: Good For Business, Bad For Security?

This was the kick-off column for my new gig with informationweek.com as a writer and columnist on “enterprise social media” (how businesses are applying social media to reshape sales, marketing, and corporate collaboration)

Facebook iFrames: Good For Business, Bad For Security?
David F. Carr | March 21, 2011
Legitimate developers will be pleased with the expanded flexibility, but malicious ones will find it easier to introduce malware, security experts warn.
Categories
Facebook Tab manager Web Development

Facebook Tab Manager Update to Support Latest FB Changes

Last night I posted an update to Facebook Tab Manager in an attempt to keep up with recent changes in the Facebook platform — in particular, HTTPS URLs for tabs and canvases and a change in the rules for tab URLs.

Download it at http://wordpress.org/extend/plugins/facebook-tab-manager/

The bottom line is the instructions I provided for registering apps and tabs on Facebook had drifted out of synch with the Facebook Developers app registration form.

The most consequential of these changes is that you can now specify HTTPS encrypted URLs as alternative sources of your canvas or tab content. This solves a problem I only heard about recently concerning people who take advantage of the “secure browsing” feature Facebook introduced earlier this year, which allows users to specify that all facebook.com addresses should be loaded in HTTPS mode. If your app or tab was not available at an HTTPS address, Facebook simply wasn’t displaying it (and your browser would probably have complained about mixed insecure / insecure content anyway).

The catch: this only fixes the problem if your web server is configured to support HTTPS. If you want to make your content available to the broadest audience, maybe it’s time to spring for the required SSL certificate. Even if you don’t do e-commerce on your website, you will get some additional benefits such as being able to better protect your password when you log in as administrator.

The other Facebook change I’m reacting to is that you now specify the full URL that tab content will be pulled from.

Previously, the form forced you to specify your canvas as a directory style URL with a trailing slash like http://www.mysite.com/fbtab/canvas/ and the tab had to be a file or directory below that level like http://www.mysite.com/fbtab/canvas/tab/ and the form had you fill in just the last part of the address for the tab as in “tab/” in the tab section.

I’ve updated my instructions to reflect this change, including the fact that you can now use the same fbtab post serve as the basis of both an app canvas and a page tab. Facebook Tab Manager still lets you choose to create a tab/canvas pair of posts, with the canvas taking advantage of the wider content area, where that is worthwhile.

Other changes:

  • I eliminated the banner I had appearing on pages when viewed on your own website. Caused more problems than it solved.
  • Tweaked the handling of stylesheets to be served as a static document when no custom CSS is being used. Should help with performance.

As always, let me know where you see room for improvement (most of you aren’t shy about that).

http://wordpress.org/extend/plugins/facebook-tab-manager/

Categories
Web Development

HTTPS URL Options for Facebook Tabs and App Canvases

Facebook has made several changes to the structure of the application registration form used to define Facebook apps and page tabs over the past couple of days.

This apparently overlaps with the introduction of the “secure browsing” option for Facebook users, which makes it possible to view pages using the https (SSL encrypted) protocol rather than http. The problem there lies with viewing an IFrame that points to unsecured content within a secured page. Most browsers would issue a warning under those circumstances, but the way Facebook deals with it is to not display tabs containing unencrypted content to those browsing in https mode. I first heard of this as an issue from users of my Facebook Tab Manager plugin who could not view their own pages because they were browsing in secure mode.

Now that users of the secure browsing feature have pulled all their hair out, Facebook has followed up by adding Secure Canvas URL and Secure Tab URL options to the app registration form. So provided you have an SSL encryption certificate installed on your server, you can simply specify the https versions of URLs as alternatives, and Facebook will serve those to browsers visiting the https version of the outer Facebook pages.

The example below is from my consulting work for Caspio, which provides both http and https versions of every application created with its cloud database service.

Secure canvas and tab URLs on the app registration form

On the other hand, this is the error message you get if you attempt to designate an https URL for your page tab without actually having an authenticated SSL certificate associated with the web hosting domain. So better to have site visitors see nothing than see this.

ugly error message
You can't fake SSL

The other change Facebook has made at more or less the same time (although I swear these secure URL options weren’t there when I looked yesterday), was to allow you to designate any URL as the location Facebook will pull from for the content of a business page tab.

Previously, Facebook assumed that a tab was somehow subordinate to an accompanying application. Therefore, it used to be that you had to make the canvas url a directory with an ending “/” and the tab URL had to be either a file name or a subdirectory beneath it. Now, you can have the same URL serve for both the tab and canvas versions of your application. It also becomes easier to use a URL using a query string as either a canvas or tab URL.

See: Facebook iFrame App / Page Tab Registration Just Got Easier

Categories
Web Development

Facebook iFrame App / Page Tab Registration Just Got Easier

I don’t see that this has been announced or documented anywhere, but Facebook has made a change that will make it easier to fit a wider variety of apps into the registration form for Facebook apps and Facebook page tabs (particularly tabs).

The short version, for those who have been following the introduction of iFrame support in Facebook page tabs: you no longer have to define as a subdirectory or a file below the directory specified for your canvas URL.

I stumbled across this while writing some documentation for Caspio, the online database company. I’ve been doing a mix of writing, editing, and web consulting for Caspio, and I had recommended they change (or create an alternate version of) the URL addressing for their cloud database product to fit more neatly into the registration form. Now they don’t have to. I had also wrestled with some of the peculiarities of app/tab setup when programming my Facebook Tab Manager plugin for WordPress.

When you register an application with Caspio, they assign a coded URL with a query string that functions as your “application key.” For deployment to a regular website, you copy and paste a JavaScript snippet that has that URL embedded in it, and the JavaScript widget downloads your form or report.

To turn a Caspio app into a Facebook app, you can simply paste the coded URL into the Facebook Developers form. Facebook lets you invoke an app as an HTML iFrame that retrieves content from the address you specify.

However, after Facebook introduced iFrame support for page tabs in February, I found that registering a tab was not so simple.

It turns out Facebook expected you to structure the relationship between an app and a tab something like this:

Canvas (App version) http://howto.caspio.com/facebook/

Tab http://howto.caspio.com/facebook/index.php

The app would then be available at a URL like
http://apps.facebook.com/caspio-demo-apps/

— and you can see the example “Contact Demo” tab at —
http://www.facebook.com/caspioinc/

To produce this example, I had to create PHP files on howto.caspio.com that included the Caspio JavaScript widget.

The problem with trying to use the Direct from Caspio URL was that there is no way to define a “subdirectory” of a URL like
http://b4.caspio.com/dp.asp?AppKey=5F422000i9f9h4e2i7c9g6c9c3

Last time I checked, the form was structured so that I could only specify the subdirectory or file name, not a full url. So if I put something in that blank, the Facebook platform would apparently try to interpret it as something like —

http://b4.caspio.com/dp.asp?AppKey=5F422000i9f9h4e2i7c9g6c9c3/demo

— not a legal URL, and so my page tab wouldn’t work.

But no longer! As of this morning, the form will now allow me to put the same URL in both the App Canvas and Tab URL blanks, and it works.

new app registration
Facebook App/Tab Registration with Query String

 

Categories
Web Development

Public Speaking

Wordcamp Miami 2011

This photo from my speaking gig at WordPress Miami is courtesy of event participant Alex Harris, from his Flickr stream.

Thanks to the members of Club Awesome Toastmasters in Coral Springs for helping prepare me for opportunities like this.

I’m available to speak on technology trends for big businesses, small businesses, and non-profits, on topics including Internet strategy, email marketing, WordPress, social media, and cloud computing.

Categories
Web Development

Prototype ExpressDB for WordPress Plugin

This is a prototype of an unfinished plugin to promote ExpressDB, a simple and inexpensive data capture service offered by Caspio Inc., the cloud database company.

ExpressDB is popular with web designers who aren’t necessarily database or programming experts. It lets you concentrate on designing the form and mapping out the fields of data you want to record. The online service takes care of actually catching the form post, recording whatever data it contains, and optionally sending you an email notification.

For WordPress users, it occurred to me that it would be nice if you could use a shortcode — a placeholder in your post or page content — to specify the form fields, rather than manually coding an HTML form. The plugin would provide some default formatting, but you could modify it within limits. I’m interested in feedback on whether this approach makes sense.

Here is what I have so far:

A sample form
The shortcode setup in WordPress

You list the fields of data you want to collect as parameters within the shortcode tag. For the action tag, you go through a brain-dead simple two or three step process to register a database on ExpressDB, and the service assigns a coded action tag that you can copy and paste, as shown below.

Getting the action tag from the ExpressDB service

I have some other ideas for letting people modify the form styling that I’m still tinkering with. For a lot of people, this could be a really easy way of creating a contact form event registration form.

Update: Getting read to release this, and I’ve added a Settings Screen that lets you set the default styles to be applied to your forms.

The HTML output for a typical form looks like this:

<form name="expressdb" class="expressdb" method="post" action="http://www.expressdb.com/edp/?AppKey=420CEF8044F20484E049B6213F9BCCXXX" enctype="multipart/form-data">
<table>
<tr>
<td colspan="2" class="labelcell"><label for="First_Name">First Name</label></td>
<td colspan="2" class="fieldcell"> <input class="text" type="text" name="First_Name" id="First_Name" tabindex="1" /></td>
</tr>
<tr>
<td colspan="2" class="labelcell"><label for="Last_Name">Last Name</label></td>
<td colspan="2" class="fieldcell"> <input class="text" type="text" name="Last_Name" id="Last_Name" tabindex="2" /></td>
</tr>
<tr>
<td colspan="2" class="labelcell"><label for="Note">Note</label></td>
<td colspan="2" class="fieldcell"><textarea name="Note" id="Note" tabindex="3" ></textarea></td>
</tr>
<tr>
<td colspan="2" class="labelcell"><label>Options</label></td><td colspan="2" class="fieldcell"> <input type="checkbox" name="Option_1" id="Option_1" tabindex="4" /> <label>Option 1</label></p>
<input type="checkbox" name="Option_2" id="Option_2" tabindex="5" /> <label>Option 2</label></td>
</tr>
<tr>
<td colspan="4"><button id="expdbsubmit" type="submit" tabindex="6" />Submit</button></td>
</tr>
</table>
</form>

You can modify the default styles to be applied to selectors like form.expressdb input through the settings screen. Or you can add tweaks on a one-off basis by including a little bit of code as an enclosure within the shortcode like this

[expressdb textarea=”Note”]button.expdbsubmit {color: red}[/expressdb]

Categories
Web Development

ExpressDB Shortcode Test

[expressdb text=”First Name, Last Name” textarea=”Note” checkboxes=”Option 1, Option 2″ action=”http://www.expressdb.com/edp/?AppKey=420CEF8044F20484E049B6213F9BCC4C81C1A127″]
[/expressdb]

Categories
Web Development

Video: How to add a custom tab to your Facebook page

This was created by John Haydon, one of the people who has been giving me feedback on how to improve Facebook Tab Manager, and gives a good overview of the basics of creating content with the plugin.