To setup your environment:
- Download and install Docker from https://www.docker.com/
- Fork https://github.com/ShawONEX/corus-wp-exercise to your own GitHub repo
- Clone your new forked repo to a local folder on your computer
- Go to the root of the cloned repo in Terminal/Command Prompt/Power Shell (you should see docker-compose.yml in the list of files)
- Run the following command:
docker-compose up - Open a browser and go to http://localhost:8000 and follow the instructions to complete the WordPress database installation
- Go to http://localhost:8000/wp-admin/ and log-in as the administrator
- Enable
Corus Themein the appearance settings - Enable
Advanced Custom Fieldsin the plugins section
The required slick files are contained in the components/slick-slider folder:
- CSS file needs to be included in the
<head> - Add slick.js before your closing
</body>tag (slick depends on jQuery)
<div class="your-class">
<div>your content</div>
<div>your content</div>
<div>your content</div>
</div>
$('.your-class').slick();
Modify the 'Corus Theme' to add the following functionality:
- Add a custom post type called "gallery". This post type will ONLY have the following fields
- Title (default WordPress field)
- Slider Image 1 (Image upload field)
- Slider Image 2 (Image upload field)
- Slider Image 3 (Image upload field)
- Use Advanced Custom Fields to create the three slider image fields (plugin provided in the repo)
- Create a single post-type page to output the gallery images based on the post_id.
- Using slick slider http://kenwheeler.github.io/slick/ output the three images to create the "single item" carousel
- Please use OOP where necessary
- Please use best security & sanitization practices where necessary
- Please use Git workflow best practices
- Submit the url to your forked repo with the completed work for review (please ensure that the repo is public)
- Please do not push anything to this repo
React
Typescript
Django
Laravel
Facebook
Microsoft
Google
Alibaba
D3
Tencent