✨ Updates to SHGR Design
Full list of development changes with details here.
I have highlighted the areas that require design changes or new mockups. The rest are notes on how the design will function or options that it will have.
I have highlighted the areas that require design changes or new mockups. The rest are notes on how the design will function or options that it will have.
Styles Page
- Headings
- Same as SHGR
https://www.sacredheartgr.org/style-guide/
- Same as SHGR
- Custom Blocks
- Image Color Blocks (SHGR)
- Keep option of 2 or 3 rows
- 2 Rows - https://www.sacredheartgr.org/get-involved/
- 3 Rows - https://www.sacredheartgr.org/im-new/
- Banner Block
- Option of with or without image
- With Image - https://www.sacredheartgr.org/im-new/
- Without Image - https://www.sacredheartgr.org/im-new/
- Accordion Block
- Same as stbrendans.net/RCIA
- Title = Heading 5 (secondary color)
- Underline and X = Primary Color
- Image Color Blocks (SHGR)
Homepage
- Header
- Same as SHGR
- Does have option for white header (uses color logo)
As seen on Joseph White Pigeon
- Hero Area
- Based on Fold only
- Type
- Video
- Slider (1-4 images)
- Content
- Title
- Description
- Button (0-1 button)
- Featured Buttons
- 2-4 buttons
- Icon - Optional
- Title - Required
- Description - Optional
- Mass Section
- Editable Title
- Editable Description
- Editable description link
- Editable 0-2 buttons below Mass Times
- Banner
- Add option of Fixed (default) or Static (doesn’t move at all)
- Parish News
- Slider buttons - same as JPII Template or SumterCatholic.org
- Mobile = Slider as seen on https://transfiguration.diocesanweb.org/
Contact Page Template
- Same as SHGR
Pop Up Notification
- Use SPAGR plugin (Blake has OG XD file)
https://xd.adobe.com/view/8fe5928d-0425-4fcb-4e4f-7a0d487db7dd-f9d4/?fullscreen- Title uses homepage “Join Us for Mass” heading
- Button uses default button styling (as seen on homepage)
Mass Page Template
- Style similar to St. Mark Ft. Pierce https://stmarkftpierce.diocesanweb.org/mass-times/
- Section Title = Heading 3
- Day = Heading 5
- Time = Paragraph
- Looks like
[Section Title]
[Day]: [Time(s)]
Post Archive
- News page will be standard News archive page (keep archive post styling, but only display posts on page, no app or calendar)
- Remove "Announcements" heading
- Remove Calendar & Buttons links from header
- Remove myParish App & Calendar
Single Post
- JPII Styling
- Image on left ¼
- Content on right ¾
- Changes
- Post title in header (SHGR page title styling)
Footer
- Use JPII Template Footer Style
As seen on Joseph White Pigeon- No icon ever
- No quote overlap box ever
- Contact Us button styling to match SHGR banner section buttons
- Social Media styling to match SHGR footer
- Headings to match SHGR footer
- Link
Mobile Menu
- Same as SHGR (color uses primary color)
- Using the mmenu plugin (see file below for designs to use in mockup )
- Colors can be changed (see demo site here)
