In this article I share details on how we can display custom fields added via Advanced Custom Fields Pro (commercial plugin) on the single page of a Projects Custom Post Type in Genesis. Here are the design goals:
- Images uploaded in the backend should appear as a slider at the left.
- If no images are uploaded in the Gallery field, then Featured Image attached to the entry should appear at the left
- If no Featured Image has been attached, a default image should appear at the left
- Regular custom fields like Client Name, Date Completed appear to the right of slider.
- The entire right div and field labels should only appear if the field values are not empty.
- Project's content to appear below.
- Links to Previous and Next projects.
- Create Projects CPT and 'Project Type' custom taxonomy.
- Create a 'Client Details' custom fields group containing these custom fields:
- Client Name (Text)
- Date Completed (Date Picker)
- Techniques Used (Wysiwyg Editor)
- Project Link (Url)
- Project Images (Gallery)
- Set this field group to show in Project CPT.
- Set up FlexSlider jQuery script for the slider.
- Create single template file for Projects CPT.
- Style it up.
Create Projects Custom Post TypeInstall Types (or your favorite CPT creation/management plugin) and set up a Projects CPT like so: Ensure that Thumbnail support and has_archive are ticked.
Create Project Type taxonomy[Optional] Create a Project Type custom taxonomy linked to Projects CPT like so: If you would like this taxonomy to work like categories rather than tags, set this to be Hierarchical.
Advanced Custom Fields ProInstall and activate Advanced Custom Fields Pro. Create a Client Details group like so:
To view the full content, please sign up for the membership.
Already a member? Log in below or here.