Brivo Content and Functionality Integration WordPress Theme Challenge

Welcome to the Brivo Content and Functionality Integration WordPress Challenge! The goal of this challenge is to integrate the content and functionality into our base WordPress theme. The end result should be fully functional WordPress theme with all its data editable/configurable through WP-Admin. 

Final Submission Guidelines

Challenge Guidelines
The overall goal of this guidelines is to build the backend/admin functionality as specified below, integrate the content and functionality to the provided base theme removing all the hardcoded content and making sure that this are all editable in the backend as well as to build the new pages from the provided storyboard. 

Backend Theme Requirements

Custom Post Types 

1. Products:
   - should have the basic Title, Content Editor, and Post Thumbnail fields
   - should the following custom fields: 
   -- Teaser (text)
   -- Featured (checkbox)
   - should have custom taxonomy named as Solutions that will serve as category and sub-category, please note that this custom taxonomy should only available to this custom post type.
   - the custom taxonomy are: Government, Small Business, Retail, Education, Multi-site Offices, Healthcare, and Religious Institutions
   - the sub-category for each custom taxonomy except for Government are: Brivo OnAir and Ingegrations
   - the sub-category for Government are: Brivo CloudPass and Aparato
2. Solutions:
   - should have the basic Title, Content Editor, and Post Thumbnail fields
   - should have an extra field for Teaser (text) 
3. Testimonials:
   - should have the basic Title that will serve as the name of the person
   - Content Editor 
   - and custom fields for Position (text) and Company(text)

Custom Fields
For custom fields, we recommend to use this plugin http://www.advancedcustomfields.com/ 

Theme Options
Use this for framework for the theme options requirements - http://reduxframework.com/ 

The following are the theme option fields requirements and subdivision 

1. General
   - Demo Field options (these are the options for "I'm interested in learning about...")
   - Address
   - Footer Text
2. Social Media
   - Facebook 
   - Twitter URL
   - Twitter Account
   - Google+
   - LinkedIn
   - Phone (1 for Label and another 1 for Actual Phone number)
   - Email
3. Benefits
   - Title (e.g. What Does Brivo Do?)
   - Benefit Text
   - Brivo Dealer button label
   - Brivo Dealer button URL
   - Brivo Brand Story button label
   - Brivo Brand Story button URL
4. Products & Solutions
   - Title (e.g. Products & Solutions)
   - Text
   - Call To Action button label
   - Call To Action button URL

Page Instructions

1. General Pages
   - Footer Contact us - use plugin (Contact Form 7 ?)
   - Footer Twitter - use Twitter API to pull the tweets of a certain account that is configured in Theme Options' Twitter Account field
   - Footer Contact Information- use the data in Theme Options' Address field and Social Media fields
   - Copyright text - use Theme Options' Footer Text field
2. Home
   - Top Part Content (What Does Brivo Do?) - will be the actual page content
   - Custom fields for "I'm New To Brivo", "I'm a Brivo Customer", and "I'm a Brivo Dealer". These can be wysiwyg editor.
   - Custom fields for "Welcome to Brivo" section, this too can be a wysiwyg editor.
   - Custom fields for "Product & Solutions" title and text. Carousel data should be pulled from Product post type
   - Custom fields for "What's New" title. Content should pull 3 recent regular post type article.
   - Custom fields for "See for yourself" section title and text. Dropdown options should be pulled from Demo Field theme options.
3. What Does Brivo Do
   - This will be a new page, see 01_what_does_brivo_do.png
   - Top Content will be based from the Theme Options > Benefits
   - Bottom Left Content will be the actual page content, images should be treated as content and not as CSS background
   - Sidebar page list will be nav menu
   - "Become a Brivo Dealer" and "Products & Solutions" are widgets
   - Customer Testimonial will be a random post from Testimonials post type
4. Benefit Details
   - This will be a new page, see 02_Benefit_details.png
   - Top Content will be based from the Theme Options > Benefits
   - Bottom Left Content will be the actual page content, images should be treated as content and not as CSS background
   - Sidebar page list will be nav menu
   - Customer Testimonial will be a random post from Testimonials post type
   - "Become a Brivo Dealer" and "Products & Solutions" are widgets
5. Brivo Dealer
   - This will be a new page, 03_Brivo_Dealer.png
   - Top Content will be based from the Theme Options > Benefits
   - Bottom Left Content will be the actual page content, images should be treated as content and not as CSS background
   - Brivo Solutions
   -- each solutions should be linked to their respective pages (Solutions post type)
   -- see the existing Product & Solutions page for the hover effect of these tiles
   -- create and use shortcode to display these tiles
   -- the 8 tiled solutions data should be pulled from Solutions post type
   - Featured Products
   -- default number of products to display is 2 but this should be configurable in the shortcode vars
   -- create and use shortcode to display this content
   -- get featured products from Products post type
   - Sidebar
   -- Customer Testimonial will be a random post from Testimonials post type
   -- "Become a Brivo Dealer" and "Products & Solutions" are widgets
   -- page list will be nav menu
6. Products & Solutions
   - This is an existing page
   - Top Content will be based from the Theme Options >Products & Solutions
   - Main content will list all the Product Category (this is the Solutions custom taxonomy under Product post type)
   - Each Product Category will list all the Products post type under that category
   - The Sidebar filter will list all the Product category and sub-category and when the sub-category is clicked, it will only show the products with that sub-category
   - Brivo Solutions
   -- the 8 tiled solutions data should be pulled from Solutions post type, use the shortcode that is mentioned in "5. Brivo Dealer" requirement above.
   -- Should have custom field for the section text and title (wysiwyg editor)
   - Customer Testimonials Carousel - pull data from the Testimonials post type
   - Search product and solutions - should be functional, use this same page template and should only search Product and Solutions post types

7. Support, About, and Contact pages
   - use dummy content and default template

8. Search
   - out of scope

Please ask in the forum for questions and clarifications.

Theme Requirements

General Rules

• Test in all the required browsers.
• Watch word typos in every place including the source code. Make sure they have correct meaning.    
• DO NOT render any CSS properties from JavaScript functions.    

WordPress Guidelines

• Your project should use the provided theme, this is based from Roots starter theme. (http://roots.io/starter-theme/) This theme includes the latest Bootstrap, and utilizes LESS for CSS. A tutorial for getting started with Roots can be found here. (http://roots.io/roots-101/)
• Follow the Roots method for structuring your theme. Wherever you might need to have duplicate markup and queries, use get_template_part() to move this section to its own template file. These files should be saved in a /templates/ directory. Compartmentalize your structure wherever possible.
• Menus should be implemented with WordPress menus when required.
• Create and utilize a custom page template whenever possible and applicable.

HTML/CSS Requirements 

• Your HTML code must be HTML5 compliant
• Validate your code - reviewers may accept minor validation errors, but please comment your reason for any validation errors. 
• Use the validators listed in the scorecard.    
• Use CSS to space out objects, not clear/transparent images (GIFs or PNGs) and use proper structural CSS to lay out your page. Only use table tags for tables of data/information and not for page layout.    
• No inline CSS styles - all styles must be placed in an external stylesheet.    
• Use semantically correct tags - use H tags for headers, etc. Use strong and em tags instead of bold and italic tags.    
• Element and Attribute names should be in lowercase and use a "-" or camel naming to separate multiple-word classes (i.e.. "main-content", or "mainContent)    
• Label all CSS or HTML hacks with explanations so others will understand.    
• Your code must render properly in all browsers listed in the scorecard in both Mac and PC environments.

Interaction Guidelines
All Javascript/Interactive elements described above must be implemented in your submission. Any libraries required should be included in your Roots-based theme, but should not be compiled with Grunt into a single file. All libraries should be included in the Theme through the standard WordPress script/styles include method, wp_enqueue_script() and wp_enqueue_style(). 

• You are allowed to use the jQuery JavaScript library for this contest.
• Label all JavaScript hacks with explanations so others will understand.

Wordpress Plugins and Helpers

• You are allowed to use open source WordPress Plug-ins and/or Helpers.
• Document your plug-ins and/or helpers and what they are used for.

Browsers Requirements IE8+

• Latest FF Mac & PC
• Latest Safari Mac & PC
• Latest Chrome Mac & PC
• Android Tablet
• Android Phone
• iPhone
• iPad

Submission Deliverables

• Detailed deployment instructions.
• A WordPress theme is a folder containing all the images, css, javascript, and PHP files that describe the appearance and layout of a WordPress blog. The PHP files have a standard naming convention for page types. 
• You must include any necessary plug-in files along with the necessary configuration settings.