BUTTONS
Learn More
VIDEO
WP Video Lightbox plugin
1) Upload anchor image in the media section and copy the link.
2) Replace anchor link below with your newly copied anchor image link.
3) Replace the video ID.
youTube VIDEO (with anchor image):
[video_lightbox_youtube video_id=”N_Y3nFTP8sY” width=”auto” height=”auto” anchor=”https://www.pitzer.edu/admission-new/wp-content/uploads/sites/106/2018/04/video_videopage_4.jpg”]
Vimeo VIDEO (with anchor image):
[video_lightbox_vimeo5 video_id=”223699690″ width=”640″ height=”480″ anchor=”https://www.pitzer.edu/admission-new/wp-content/uploads/sites/106/2018/04/video_thumb_abroad_botswana.png”]
MAPS
Counselors by state – use Map plugin
On the road– use Hero Maps plugin
CRAWL / PROMO
Use Nest Flyout plugin to manage button text in the WordPress front-end customization panel.
Edit the Crawl Flyout page for the flyout content (the background image can also be changed in the WordPress front-end customization panel.)
COLORS
Orange – #F7941D
Dark Gray (body and header text) – #58595B
Light Gray (nav background + stat bars background) #d4d4d4
Medium Gray (alternate page section backgrounds) #eeeeee
FORMS
Use Forms Lite (Formidable) plugin (for Request Information form in the flyout panel on the connect page )
STATS
Large numbers – use h5
Small numbers – use h6 with soft return between lines.
Citations (tiny type) – use soft return (h6 from line above), and define the size; 10px, Times New Roman, italicized.
Additional notes: text box should have 10px padding above and 20px below, 0px left and right.
HEADERS
H1
Main Page headers
With dotted rule below
H2
Sub Headers
H3
*Footnotes and small italicized Times New Roman text
H4
Info box titles
in info boxes on the Apply page
H5
Stats – large numbers
h6
Stats – small text
Has special line-height styling – size; 8pt, font; Times New Roman, italic
CORE VALUES PAGE
To keep margins consistent on mobile, add extra class name to the large images – core-value-image
VIDEO THUMBNAIL TEMPLATE (PSD)
There’s an image template for the video thumbnails uploaded to the media library called video_thumb_template_400x360.psd
TUTORIAL NOTES:
ITEMS TO DISCUSS:
- Anchor links
- Returns (soft vs. hard)
- Video – absolute links
- TypeKit – login to Adobe Cloud https://www.adobe.com > navigate to https://typekit.com/ > search for Trajan Pro Light and Regular.
– Follow the instructions at this link – https://helpx.adobe.com/typekit/using/add-fonts-website.html
