Plugins

Plugins are necessary to extend the functionality and improve performance of the website. The goal is to keep this list as short as possible without sacrificing functionality or performance.

Basics

  • Jetpack (included with hosting)
  • Akismet (included with hosting)
  • Avada Core
  • Avada Builder
  • The Events Calendar

Gutenberg Specific (for posts)

  • Abbreviation button for the Block Editor
  • Better Core Video Embeds
  • Code Syntax Block
  • Flexible Table Block
  • Kadence Blocks

Additional

  • Enable Media Replace
  • Instant Images
  • Formidable Forms Pro ($$)
  • Meta Box AIO ($)
  • Perfmatters
  • Presto Player Pro ($)
  • PublishPress Author Pro ($)
  • PublishPress Checklist Pro ($)
  • PublishPress Planner Pro ($)
  • Rank Math Business ($$)
  • SchedulePress Pro ($)
  • Script Organizer ($)
  • Short Pixel Image Optimizer ($)
  • The Events Calendar Pro ($$)
  • Wicked Folders Pro ($)
  • wpDataTables ($$)
  • Powerful Filters for wpDataTables ($)
  • Formidable Forms integration for wpDataTables ($)

Images

Almost all of the images on this site come from Unsplash.com . Occasionally, there are images and graphics from Adobe Stock and AF.mil. All photographs used for featured images are save in a 16:9 aspect ratio and a minimum full size of 1400×787 pixels. Attribution is usually included.

Photo by Simon Williams

Design Guide

Accessibility (#a11y)

One of the primary reasons for using Avada has been the Theme Fusion team’s commitment to WCAG compliance.  Everything that is added to this site should comply as much as possible with WCAG 2.2. If you encounter an item that is not compliant, please use the contact form and let me know.

Typography

With the addition of Adobe Font support, this site now uses the following fonts:

  • Postea Variable for heading (custom CSS required for variable fonts)
  • Sophia Pro for the body font
  • Sophia Pro Condensed is occasionally used as a section heading

All fonts use the sans serif system fonts as a backup.

The title bar fonts are white and use a text shadow to help with legibility on various backgrounds.

Heading 1
clamp(1.4rem,calc(1rem + 3.5vw),4rem)

Heading 2
clamp(1.73rem, calc(1.25rem + 2.40vw), 2.96rem)

Heading 3
clamp(1.44rem, calc(1.14rem + 1.52vw), 2rem)

Heading 4
clamp(1.20rem, calc(1.02rem + 0.91vw), 1.67rem)

Heading 5
clamp(1.00rem, calc(0.90rem + 0.49vw), 1.1rem)

Heading 6 (uppercase)
clamp(0.95rem, calc(0.79rem + 0.20vw), 1rem)

Paragraph text (1.25rem)

Colors

This pallet was chosen to minimize color perception issues. A few vibrant colors are used sparingly to help bring life to certain elements. This will change over time and be minimized as much as possible for consistency. This will be transitioning to use TailwindCSS colors throughout.

Primary

Power : #22d3ee (–awb-color6)

#1a1819 body text (–awb-color8)

#ffffff (–awb-color1)

#c3c3c3  Light text for dark backgrounds

Power Shades (TailwindCSS Cyan)

#164E63

#155E75

#0E7490

#0891B2

#06B6D4

#22D3EE

#67E8F9

#A5F3FC

#CCFAFE

#ECFEFF

The grays

#1f1f1f (–awb-color5)

#333333 (–awb-color7)

#4a4e57 (–awb-color4)

#e2e2e2 (–awb-color3)

#f5f5f5 content background (–awb-color2) 

Previously Used

#4a005b

#9b0081

#282828 

#3097cc

#1833af

#FFCE22

#75bffc

#63e6be

#d6eafc

#ed2423

#b5db2c

#faa612