Twenty Twelve Landing Page
Isn't WordPress overkill for a startup's "coming soon" page? Yeah but: would need a brochureware site soon enough, and subscribing for notifications? So, no, WP it must be. (The core web app would obviously run on a "real" back-end — Node, NoSQL… the cool stuff.)
But, first things first, just a landing page.
Requirements
- Single, simple page: nicely styled, very little text and layout.
- Subscribe to be notified once we launch.
- Social share buttons?
Stream of consciousness
- Installing yet another WP on WebFaction is just a few clicks. ;o)
- Bought a really trivial static HTML template from ThemeForest. ($5, don't overthink it?)
- I want to tweak it, and tho it provides a PHP script to collect emails in a text file, it's a bit too simple? No input sanitization? I don't trust PHP. And how to use it to mass mail later? Headache!
- WP plugin with >1M installations ought to be safer. And it handles mailing already. ;o)
- Subscribe2's setup sucks: ugly, incomprehensible. (I blame WP for this: should provide better (uniform/consistent, correct) settings facilities for extensions…)
- Let's add a "page template", like TT's "Full-width Page Template, No Sidebar" (full-width.php), removing what we don't need (probably stuff
get_header()
renders), and adding a form for subscribing — widget? Oh, shortcode! So easy. (I'm fascinated by WP's component/extension mechanisms.) - HTML: to drop the banner/masthead, don't call
get_header()
, which includes theme's header.php, but copy parts of it into our template instead. - And all this should be put in a child theme, of course. Create the mandatory style.css with metadata, and put template's CSS in it.
- What about assets? Those relative to child's style.css — no problem. JS: ask WP to load them. Including CDN stuff. In coming-soon.php, since only used on that page, otherwise we'd add a functions.php.
- CSS: target stuff on landing page by prefixing selectors with
body.page-template-coming-soon-php
. Inheriting TT's CSS is a lot of baggage to carry… Override stuff (so much!) this page doesn't want, or start from scratch? - Had to selectively use parts of content-page.php instead of
<?php get_template_part( 'content', 'page' ); ?>
. - Webfonts! Google. Easy:
wp_enqueue_style("webfonts", "http://fonts.googleapis.com/css?family=Roboto:400,700", array(), null);
andbody.page-template-coming-soon-php h1.entry-title {font-family: Roboto, sans-serif; font-size: 75px; color: white; text-align: center; text-shadow:0 2px 2px rgba(0,0,0,0.3);}
- Responsive? CSS
background-size: cover
. - Large images?
- Subscribe2's HTML sucks!
<br>
?! What year is this? Patch the code (PHP) or hack around it in CSS? Also, I don't want the "unsubscribe" button, nor the annoying hiding of the form when I'm logged in. Hmm, shortcode has an optional attributehide=unsubscribe
, but the<br>
I can't get rid of (hide with CSS), can I? So it seems will have to mess with the code: comment lines 69-71 of classes/class-s2-frontend.php out:/* if ( $user_ID ) { $this->s2form = $this->profile; } */
and remove the $#@! non-semantic elements!$this->form = "<form method=\"post\"" . $action . ">...
--
The real world is a special case