• 4000 S Rose Ave Oxnard, CA 93033
  • Mon - Th: 8:00 am - 2:00 pm
  • (805) 278-5521
ArabicEnglishSpanishChinese (Simplified)FilipinoVietnameseIndonesian

Style Guide

Welcome to the formatting page for this theme. We’re glad you are interested in using this and want to show you how elements look. Please use the Table of Contents below to quickly view the sections you are interested in or feel free to scroll away and review everything from top to bottom.

Table of Contents

Typography

Montserrat & Source Sans Pro

Heading: Montserrat

Body: Source Sans Pro

Colors

Gold Tones

Black Tones

Want to see what a blockquote looks like?

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut elit tellus, luctus nec ullamcorper mattis, pulvinar dapibus leo.Lorem ipsum dolor sit amet consectetur adipiscing elit dolor

John Doe

Perhaps you’d like to see what an unordered list looks like?

  • Unordered list item #1
  • Unordered list item #2
  • Unordered list item #3

Or you’d prefer to see what an ordered list looks like?

  1. Ordered list item #1
  2. Ordered list item #2
  3. Ordered list item #3

Or maybe a mixed list?

  • Unordered list item one
  • Unordered list item two
    1. Ordered list item one
    2. Ordered list item two
      • Unordered list item one
      • Unordered list item two
        1. Ordered list item one
        2. Ordered list item two
      • Unordered list item three
    3. Ordered list item three
  • Unordered list item three

Care to see what the headings look like?

Headline 1

Headline 2

Headline 3

Headline 4

HEADLINE 5
Headline 6

What do tables look like?

Title for table using heading 2

Column Title 1Column Title 2Column Title 3Column Title 4
    
    
    
    

What Button Options do I have?

There are four sets of primary buttons with an icon to the right of the text associated to the call to action. The text in each button can be changed to fit the call to action. To edit the text in the button make sure to unlink the widget first.

The Green button should be used on white backgrounds as the primary button. The black button is for use on green backgrounds and or as a secondary button.

  • Button – Learn More – Internal Page
  • Button – Visit Page – External Website
  • Button – View PDF – Link to PDF Document
  • Button – Download – Link to downloadable content (zip files, google drive folder)

Alerts and Notifications

Below you will find the different alerts/notification banners. you can place across the website that you want users to notice when you want to leave them a note to read before proceeding forward.

Note!

Sample text. Please replace with your information

Attention!

Sample text. Please replace with your information

Warning!

Sample text. Please replace with your information

Success!

Sample text. Please replace with your information

Here are examples of how Columns can be used

Here is an example of how a One Column layout would look like

This is a heading 5

Pacifica High School Aerial ShotThe widget I am using here is the Text Widget editor.

This is an example of a hyperlink WordPress page, you could edit this to put information so readers know where you are coming from. You can create as many pages like this one or sub-pages as you like and manage all of your content inside of WordPress.

This is a heading 4 italicized with color #038C38

This is a second paragraph example of a WordPress page, you could edit this to put information so readers know where you are coming from. You can create as many pages like this one or sub-pages as you like and manage all of your content inside of WordPress. This is an example of a WordPress page, you could edit this to put information so readers know where you are coming from. You can create as many pages as you like and manage all of your content.

Here is an example of how a Two Column layout would look like

This is a heading 3

Text Editor Widget with a brief descriptions of the content is about leading to the call to action which is the button.

This is a heading 3

Text Editor Widget with a brief descriptions of the content is about leading to the call to action which is the button.

Here is an example of how a Three Column layout would look like

This is a heading 3

Text Editor Widget with a brief descriptions of the content is about leading to the call to action which is the button.

This is a heading 3

Text Editor Widget with a brief descriptions of the content is about leading to the call to action which is the button.

This is a heading 3

Text Editor Widget with a brief descriptions of the content is about leading to the call to action which is the button.

Here is an example of how a Four Column layout would look like

NOTE!

Below we are using a four column layout. As you can see this makes the columns narrower for our content especially for our buttons. If we use long wording for the button in a four column layout it runs the chance of it using two lines of text. 

To keep size consistency we can re-word our call to action button to keep them in a single line. This example is shown right below the double line buttons in column 3.

This is a heading 3

Text Editor Widget with a brief descriptions of the content is about. Leading to the call to action which is the button.

This is a heading 3

Text Editor Widget with a brief descriptions of the content is about. Leading to the call to action which is the button.

This is a heading 3

Text Editor Widget with a brief descriptions of the content is about. Leading to the call to action which is the button.

Button layout below is Ok

Button below is Better

This is a heading 3

Text Editor Widget with a brief descriptions of the content is about. Leading to the call to action which is the button.