Help Files

Below is the documentation for managing the website.

If you have any questions, please contact Brett Atkin at brett@pixeljocks.com.

Site Images

There are a variety of images used throughout the site.

  1. Hero Images
  2. Slider Images
  3. Featured Images
  4. Gallery Images

Each image category has specific image dimensions to maintain consistency of design and layout throughout the site.


All images should be sized and cropped BEFORE uploading to the website.  The dimensions provided are exact.  The image should be sized for height and/or width and then cropped to the exact dimension needed.


When adding hero, slider and featured images, please give the image an appropriate Alternative and Title text.  This text helps with search engines and screen readers. It also helps when searching for an image in the gallery. Please see the screenshot below.

You can also add this text to each gallery image but that would be a time consuming process for large galleries.

Once an image is uploaded, you can access this screen by clicking the image.


In the Media section, images can be placed in folders to better organize files uploaded.  There are folders for all types of files except gallery images.  All hero, slider and featured images should be placed in the appropriate folder.


Hero Image & Slider Images

Size: 1920px wide by 500px tall
Format: jpg


Featured Images

These are the featured images for a gallery, news post, and the featured event image on the home page.

Size: 600px wide by 400px tall
Format: jpg


Photo Gallery Images

To maintain uniformity in the size of the images being uploaded for photo galleries, this is the default dimensions for photo gallery images.

Size: 800px max width and 800px max height
Format: jpg

The images uploaded should be at 800px in either height, width or both. Images with smaller dimensions should not be used (for example, 400px by 300px).

Another consideration for photo galleries is the number of images used.  A photo gallery page with 100 images will take longer to load than a gallery with 40 images.  Please limit the galleries to the best images rather than all the images.

Photo Galleries

Adding a new photo gallery to the site is a multi-step process.

  1. Size and crop all gallery images
  2. Size and crop gallery featured image
  3. Size and crop hero/slider image (optional)*
  4. Create a new Envira Gallery
  5. Create a new Gallery
  6. Check the website Home and Gallery page to make sure everything looks and works correctly.

Please size and crop all images before uploading, see the section above for proper image dimensions.

After you upload the images, the Envira Gallery needs the following configuration settings.

  1. Gallery Layout - Mason
  2. Number of Gallery Columns - Three Columns (3)
  3. The Enable Lazy Loading box must be unchecked.

Once you create the Envira Gallery, you need to copy the Envira Code to be used later.

When you add a new Gallery, you need the following information.

  1. Gallery title
  2. Gallery description
  3. Envira Code - copy and paste this code below the description.
  4. Featured Image

* If there is a particularly great image, please create an image that could be used as a hero image or slider image.

 

Forms

Creating new forms begins with gathering the following information.

  • Event name, date/time and location
  • Are any form fields needed beyond first name, last name, email address, phone number and address?
  • Is the event for RSVPing (free) or registration (pay)?
    • If registration, what is the fee per person?
  • Any special instructions that need to be included in confirmation emails

RSVP Events

  1. Make a copy of the RSVP template form
  2. Rename form title
  3. Update any form fields
  4. Update any quantity limits
  5. Set up notification emails
    1. Update event details in registrant emails
    2. Set reminder date for reminder emails
  6. Test Form

* For RSVP forms, for the quantity limits to work the pricing field has to be used but will be hidden with CSS.  Please contact brett@pixeljocks.com to have that done.

Registration Events

  1. Make a copy of the Registration template form
  2. Rename form title
  3. Update any form fields
  4. Update any quantity limits
  5. Set up Stripe integration
  6. Set up notification emails
    1. Update event details in registrant emails
    2. Set reminder date for reminder emails
  7. Test form

News

Here are the steps to enter a new News story.

  1. Click "Add New" under Posts
  2. Enter the News story title
  3. Enter the News story copy
    1. Click "Add Media" and add the featured image in the appropriate size
    2. Once the image is added, click the image and then the pencil icon
    3. Set Display Settings > Align > None
    4. Set Advanced Options > Image CSS Class > news-featured
    5. Add a line break after the image and add the News copy
      1. Please Note: the layout will look wrong but when you publish the story, the image will be placed to the right and the News copy will wrap around it.
  4. Select the appropriate Category in the Categories widget
  5. Add the featured image in the appropriate size in the Featured Image widget
  6. Once everything is set and reviewed, click Publish
    1. Please Note: when you click "Publish", the story is sent to Facebook

When entering a story that includes an image gallery, please link to the Gallery page and not include the gallery shortcode in the story itself.

News Story Help