From a development perspective, T-Pro Solutions is a pretty typical marketing site: hero carousel, big banner images on each page, and some calls-to-action. There’s nothing wrong with a site like this, but they’re not always the most exciting to build. T-Pro’s site, however, has a little bit of magic under the hood that’s worth sharing.
During the project kick-off, it was revealed that T-Pro Solutions wanted to present a lead-capture form before users could watch their marketing videos. While I object to any sort of “give us your information before you can make any decisions about our product and/or service”-type of interruption, T-Pro’s hook was at least a challenge: besides capturing the viewers’ information, members of competitors’ teams should be denied access to the videos.
To pull this off, I registered a custom post type of “Private Videos”, which collected an oEmbed-enabled URL (in this case, all the client videos were on a domain-restricted Vimeo account), a title, and a post thumbnail (which would serve as the poster frame). Videos were embedded using the [private-video] shortcode, which accepted a post ID, resulting in the poster frame being embedded with a faux “Play” button overlay, linked to an action on wp-admin/admin-ajax.php (the main interface for Ajax actions in WordPress).
Upon hitting admin-ajax.php (either via Ajax or directly, if JavaScript is disabled) we check for cookies and, if the user hasn’t yet submitted the lead capture form, they are shown (or redirected to) the appropriate Gravity Form. Upon completion of the lead capture form, the user is then shown the requested media (replaced inline when JavaScript is available).
When the cookie is found or the form submitted, the user’s email address is checked against the blacklist of addresses and domains. If the email address fails the blacklist check, alternative content (we recommended a generic “this content is unavailable”-type of message, though it could just as easily be “get lost!” if T-Pro was feeling saucy).
It’s not a bullet-proof system (all a competitor would need to do is use a personal email address and the blacklist would be subverted), but it met the client’s need to protect some of their content from competitors. Overall, we’ve received very positive feedback from T-Pro Solutions on the project, which is leaps and bounds beyond their previous site.
Beyond the private videos, T-Pro Solutions is a responsive, totally custom WordPress theme with styles written in Compass and assets compiled via Grunt. Most of the theme assets are SVGs for maximum flexibility across screen sizes and resolutions. Advanced Custom Fields powers the carousels, per-page sidebars, and a few other dynamic content areas.
Comments are closed.