View
2.821
Download
1
Category
Tags:
Preview:
DESCRIPTION
eMusic started transitioning to WordPress as their web front-end in 2011. Like most enterprise sites, they had outgrown their closed-source CMS and were looking for ways to speed up development and empower their editorial team. They decided to convert their Java back-end to Java-based Web Services, and their front-end to PHP, using WordPress for publishing, merchandising, web configuration, and service consumption. The site now boasts one of the best implementations of "WordPress as a CMS" and scales to many millions of page views a month. Scott Taylor led eMusic through this transition. eMusic is music discovery service, previously subscription-only, which enables its subscribers to discover and purchase music at a discounted rate. Its recently-launched "A la Carte" service allows visitors to download albums and track without a subscription. eMusic has been around since 1998 and was one of the first services to champion the MP3 format and DRM-free downloading. Scott's presentation will be a walk-through/case-study of eMusic's WordPress implementation, and he'll also share some tricks of the trade for managing many custom post types, regionalizing content, and easily integrating with services like AWS.
Citation preview
eMusic WordPress NYC
Tuesday, March 19, 13
Scott Taylor@wonderboymusichttp://scotty-t.com
Tuesday, March 19, 13
eMusic Architecture• Linux (CentOS) / AWS (ELB, EC2, S3)
• PHP 5.3 / Apache / MySQL 5.5 (InnoDB)
• PHP Extensions: cURL / Memcached / APC
• WP Plugins: Memcached Redux / Batcache / HyperDB
• Custom scaling: Cloud / Minify
• External Java Web Services
• GravityForms for /support/ sub-site
• bbPress for Message Boards (soon!)
• BuddyPress component architecture for profiles / account (soon!)
Tuesday, March 19, 13
Tuesday, March 19, 13
• “Home” is home.phpwww.emusic.com/
• “Artist” is page-artist.php + rewriteswww.emusic.com/artist/the-weeknd/13522347/
• “Album” is page-album.php + rewriteswww.emusic.com/album/the-weeknd/trilogy/13692332/
• “Genre” is taxonomy-genre.phpwww.emusic.com/music-genres/alternative-punk/
• “Search” is rewrite + ?s=search+termwww.emusic.com/search/music/?s=the+weeknd
• “Browse” is page-browse.php + REWRITESwww.emusic.com/browse/album/hip-hop-r-b/artist:13522347/editors-pick/new:year/
Pages
Tuesday, March 19, 13
Search + Browse
Built on top of Elastic Search
Combination of modified WordPress search and multiple queries to Elastic Search
Tuesday, March 19, 13
Artist
Tuesday, March 19, 13
Album
Tuesday, March 19, 13
Genre
Tuesday, March 19, 13
Custom Post Types• We have 54 of them!
• “Editorial Types” - type of article, different types of displayed data
• Merchandising modules
• House Ads
• Configs
• Homepage contains many
Tuesday, March 19, 13
Stage
Actor
New and Noteworthy17 Dots
Feature Pack
Double Wide
House AdRecommendations Service
Catalog Service
Twitter feed Coming Soon
HOMEPAGE
Tuesday, March 19, 13
Editorial• Features, Reviews, Interviews
• Sales
• Merch Modules
• Archives
Tuesday, March 19, 13
Taxonomies
• `region` = regionalizes content
• `editorial_target` = where it can show up
• `genre` = which genre it is targeting
• `tag` = what topic it is related to
• `category` = used for grouping post_types
Tuesday, March 19, 13
Merchandising
Region-specific, Genre-specific
Double-wide
New and Noteworthy
Tuesday, March 19, 13
Merchandising
Region-specific, target/page-specific, genre-specific
Stage
Actor
Tuesday, March 19, 13
House Ads
• Homegrown replacement for DART
• Probability strategies / self-optimizing
• Click-tracking
• URL path / Query string / Cookie
• Test multiple pieces of creative
Tuesday, March 19, 13
Creative + Taxonomies
Tuesday, March 19, 13
Strategies + Rules
Tuesday, March 19, 13
House Ad
House Ad
House Ad
Regionalized
Targeted
URL parsed
Cookie parsed
<div class="house-ad-target" data-target="non-member-stage"></div>
Tuesday, March 19, 13
Web Services
• Data over HTTP
• All return JSON
• REST
• Security / Authentication
• All Catalog Data comes from services
Tuesday, March 19, 13
AJAX / Persistent Player
• Primary use of Backbone
• history.pushState, no full page reload
• Local storage for player history
Tuesday, March 19, 13
17 Dots / Post Formats
Tuesday, March 19, 13
Dashboard
Tuesday, March 19, 13
Link Images to External IDs
Tuesday, March 19, 13
Schedule Catalog Items
Tuesday, March 19, 13
Front End Technologies• Backbone / Underscore / NodeJS
http://backbonejs.org/
OOP JavascriptArrays / CollectionsMinified via Grunt / UglifyLint’d via JSLint / JSHint
• LESS http://lesscss.org/
OOP CSSMinified via YUI Compressor
Tuesday, March 19, 13
Tuesday, March 19, 13
Thank You Questions?
Tuesday, March 19, 13
Recommended