Challenge Overview
Welcome to SunShot - You Save With Solar - WordPress Multisite Base Theme Challenge! YouSaveWithSolar.com (YSWS) is a site/app that will make it easier for consumers, businesses, non-profits, and communities to find trusted solar providers regardless of where they live nationwide. The site aims to be the premiere destination for anyone looking to choose solar and will evolve based on feedback, technology improvements and continual evolution of the industry. This site also aims to provide a community with a growing network not only for consumers but for installers as well. The YSWS site will also provide education on the benefits of going solar i.e. purchase vs lease, long term benefits and savings, etc.
This challenge will utilize WordPress multisite setup. The main site will be something like www.yousavewithsolar.com. Then, the private label sites will have something like this www.yousavewithsolar.com/unitedairlines.
Creation of private label sites will be done via a Super Admin which is already built-in with wordpress multisite.
The goal of this challenge is to create the base theme of a WordPress multisite installation. This can be a single WordPress theme that would work on both main site and private label site (sub-sites) or two identical themes (1 for main site and 1 for sub site) that is based on the provided wireframe and with the features outlined in the Challenge Details section.
As part of this challenge you will need to document all WordPress, PHP, HTML5, CSS3, and JavaScript codes. We need clear explanation of the code to help us figure all the code functions and make it easier for future developers and the client to understand what you have built. You are allowed to use Bootstrap and jQuery for this challenge.
Final Submission Guidelines
The are no storyboard for this challenge as the main goal is to create the base theme that has all the WordPress structure and code functionality. The “skin” of the site will be handled in the next challenge.
General Requirements:
1. Content
Make sure all content are editable in WP Admin and no hardcoded content in the template files.
2. Login
- Implement a login in a modal.
- Successful login should be redirected to WP Admin panel.
- No need to implement social login
Page Requirements:
1. Main Site Pages:
1.1. Home Page
- Follow the layout and content as per wireframe.
1.1.1. Carousel
- Top section is a content rotator that is based on a settings in theme options (see Theme Options Requirements below for details).
- Get the info (title, excerpt, featured image, and link) from the page to display in the rotator item.
- Clicking the button in the rotator item will redirect to their corresponding page.
1.2. Self Identification Home
- This is an order screen for residential.
- Entering a location address should get the zip code from Google API and store it in a hidden field.
- Each order will be saved as an Orders custom post (see custom post type requirements below for details).
- The title of the post will be a combination of First Name, Last Name, and Zip Code.
- On successful creation of new post, send an email to the Solar Companies that has the zip code in their service. Get posts from Solar Companies custom post type.
- The email should include all the information the user has entered including any file attachment.
- Need to store which solar companies the order has been sent.
- Redirect to Confirmation Page on successful order.
1.2.1. Upload Electric Bill
- This is ability for users to upload a copy of their electric bill in PDF, JPG, or PNG, TIFF format.
- This information will be saved in WP.
- This needs to be passed to respective solar providers as email attachments.
1.3. Self Identification Business
- This is an order screen for Business
- Similar functionality as above (Self Identification Home) but for Business
1.4. Self Identification Non Profit
- This is an order screen for Non-Profit
- Similar functionality as above (Self Identification Home) but for Non Profit origanization.
1.5. Self Identification Communities
- This is an order screen for Communities
- Similar functionality as above (Self Identification Home) but for Communities.
1.6. Confirmation page
- This page shows up after successful order.
1.7. Sign Up
- Implement a WordPress sign up in a modal that will create a subscriber user role account.
- No need to implement registration via social account.
2. Private Label Site Pages
2.1. Homepage
- This will be similar to the content of main page
2.2. Self Identification Home
- Similar functionality as the main site with additional custom field to store where (what site) the order came from.
- The Solar Companies data will be maintained in main site Admin only. Query main site to get these data or use Rest API request.
2.3. Self Identification Business
- Similar functionality as the main site with additional custom field to store where (what site) the order came from.
2.4. Self Identification Non Profit
- Similar functionality as the main site with additional custom field to store where (what site) the order came from.
2.5. Confirmation page
- This page shows up after successful order.
2.6. Sign Up
- Implement a WordPress sign up in a modal that will create a subscriber user role account for the specific subsite only.
- No need to implement registration via social account.
Wordpress Requirements:
1. Version 4.3.1 in Multisite environment.
2. Use Redux framework for site options.
3. Use Advanced Custom Field for custom fields.
4. Other plugins - ask in the forum if allowed or not.
Site Options Requirements:
1. General tab
- This tab will contain the following:
1.1. Logo
- There should be uploadable logo.
- Make sure the uploaded logo image is only applied to the appropriate partner site site and does not interfere or display on any of the other sites.
1.2. Content Rotator
- This will have 6 fields of relational post object of Page type
- Each field should have switch field that will turn the on/off the selected page from displaying in the home page.
2. Solar Coverage tab
- This tab will contain a field to upload a CSV file that will update the Solar Coverage data.
- Use the provided solar-coverage CSV files to test this functionality.
- This should only shows on the main site.
- This tab should have file upload field (you may need to add custom field) that when a CSV file is uploaded it will create or update a post from the Solar Companies custom post type (see below for the details of this custom post type).
- There should also a field for the name of the Solar Company. This should be a relational dropdown field to select an existing post from the Solar Companies custom post type AND a text field in case a post is not yet existing. This will serve as the name of the post to update.
- If user select a post from the dropdown, then you have to remove all the zip codes custom field data of that post and add new values based on the content of the CSV file.
- If user enters a value from the text field, then create the post under the Solar Companies custom post type and add the values of zip codes based on the content of the CSV file.
3. Social Media tab
- Have fields to enter the URL for Google+, Facebook, LinkedIn, and Twitter separately.
Custom Post Type Requirements:
1. Solar Companies
- Title will be the name of the solar company.
- No content editor.
- Zip Codes - this is a custom field (textarea) that will hold the zip codes in comma separated format.
- Email - text field for company email address.
- Side ID custom field (site select field)
- Need to show this only in main site.
2. Orders
- Title.
- No content editor.
- User Info tab which will have custom fields of First Name, Last Name, Email, Location Address, Zip Code, and Reference Code. All these fields are text input type.
- Roofing Details tab which will have custom fields of Roof Type (image select), Roof Orientation (image select), and Roof Age (select dropdown field).
- Electric Usage tab will have custom fields Electric Bill (file type), Average Monthly Bill (text input).
- Identification tab will have custom fields Site ID (site select field with multiple selection), Property Name (text field), Property Type (select field with options Home, Business, Non-Profits, and Communities), Ownership Information (select field with option Own Building, Leased Property, and Rented Property), and Solar Companies (this will be a relational post object of solar companies post type with multi-select turned on).
- On the main site main site, show all posts under this custom post type.
- On the subsite, show only the post/orders that has a link (Site ID) to the subsite.
Browser Requirements:
- IE9+
- Latest Chrome
- Latest Firefox
- Latest Safari
HTML5:
- HTML should be valid HTML5 compliant.
- Provide comments on the page elements to give clear explanation of the code usage. The goal is to help future developers understand the code.
- Please use clean INDENTATION for all HTML code so future developers can follow the code.
- All HTML code naming should not have any conflicts or errors.
- 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)
- Use semantically correct tags- use H tags for headers, etc. Use strong and em tags instead of bold and italic tags.
- No inline CSS styles- all styles must be placed in an external stylesheet.
- 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.
CSS3:
- You are allowed to use Bootstrap for this challenge.
- Provide comments on the CSS code. We need CSS comments to give a clear explanation of the code usage. The goal is to help future developers understand the code.
- Please use clean INDENTATION for all CSS so developers can follow the code.
- All CSS naming should not have any conflicts.
- As possible use CSS3 style when create all styling.
- 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.
Javascript:
- All JavaScript must not have a copyright by a third party. You are encouraged to use your own scripts, or scripts that are free, publicly available and do not have copyright statements or author recognition requirements anywhere in the code.
Submission Guidelines:
- Wordpress Theme source code that includes PHP template, CSS, JS, and Images files including all the required plugins.
- Sample data.
- Deployment guide.