Several times a year the home page banners on the sites may need to be updated. This is one of the more complex procedures Trust staff may need to carry out, so a procedure checklist has been prepared so you can ensure consistent results when changing banners.
Updating the Photoshop file
The banner photo must be prepared before upload using this photoshop file: CBT-banner-master-cropped.psd
Each banner is prepared in Photoshop as a layered image with the desired photograph and the banner graphic elements on separate layers. When the banner is to be updated, the procedure below should be followed.Select your new photograph, keeping in mind the horizontal crop and the ‘cutout’ required for the logo. Often photos will work best if they are shot with the banner usage in mind. A generally well-composed photo may – or may not – be appropriate for the banner, depending on whether the story the photo tells will remain strong when the strongly horizontal crop required for the banner is done.
Installing the New Banner
The new banner photo is uploaded to the Header Right widget area at https://ourtrust.org/wp-admin/widgets.php. Here are the steps required to upload a new photo.
- The header image may be replaced through editing the ‘Visual Editor’ widget placed in the Header Right Widget Area.
- The image (.png) is uploaded to the body of the widget using the ‘Add Media’ button.
- The CSS Class ‘banner-pic’ must also be included in the widget settings (at very bottom).
- Leave the widget title empty.
- This has already been done on all three sites, so you should should just need to upload/replace the image to the existing widget in the future. Select the current image | Choose the pencil icon (Edit) from the list of options | Choose Replace from the Image Details window
- Using the Media uploader, make sure the alignment is set to none and the image size is original/full size (no resizing, cropping).
- Image dimensions need to match PSD provided by Gord Draibye and be .png format.
- The new photo will automatically appear in the correct size and location in the home page banner.