This project entails JSON twig parsing, using an existing Wordpress plugin, and customizing the display that is generated.
The JSON data is an event feed, and each event contains information that needs to be displayed, including a photo. You can see a draft of the functionality here:
[url removed, login to view]
To create this I am using a plugin that I purchased here: [url removed, login to view]
The project is to produce a responsive grid of events in rows and columns. The image should be a square, with the content laid out as depicted in the "Grid View" image attached.
After 20 events (or another set variable), to display more events a "load more" button would appear, allowing the users to display more.
In addition to the grid view, users should have the ability to switch to a list view. The list view is depicted in the "List View" image.
A few other notes:
Clicking any part of the grid and list area should take the user to the link.
The date of each event should be formatted like this : FRI April 22
The images should fill the square area as best as possible. Not all of the images will be squares.
To save on bandwidth / load times (the image files in the feed are often pretty large) we want to use "lazy loading".
In terms of responsive CSS break points etc. grid view should function in a very similar way to this mockup using the Enfold theme: [url removed, login to view]
The list view can look exactly like this : [url removed, login to view]
- the Wordpress twig parsing plugin allows the user to create templates, and I would like the following setup:
- Grid / list view with switcher (20 items in a grid, 8 in the list)
- Grid view (no switcher) (20 items in the grid)
- List view (no switcher) (8 in the list)
I will provide you FTP and Wordpress access to complete the project.