Style Guide
Header Styles
Heading h1
This is a heading h1 set in Playfair Display font. Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat.
Heading h2
This is a heading h2 set in Playfair Display font. Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat.
Heading h3
This is a heading h3 set in Playfair Display font. Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat.
Heading h4
This is a heading h4 set in Playfair Display font. Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat.
Heading h5
This is a heading h5 set in Playfair Display font. Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat.
Heading h6
This is a heading h6 set in Playfair Display font. Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat.
List Styles
Unordered List
- Lorem ipsum dolor sit amet.
- Aliquam tincidunt mauris eu risus.
- Vestibulum auctor dapibus neque.
- Nunc dignissim risus id metus.
Ordered List
- Cras ornare tristique elit.
- Vivamus vestibulum nulla nec ante.
- Praesent placerat risus quis eros.
- Fusce pellentesque suscipit nibh.
Link Styles
Primary Link Button Modal Link Button
Regular Text LinkAlt Link Button Modal Link Alt Button
Instructions
The Home Page Banner
A pod controls the main featured banner on the home page. There are two main areas of this pod; the image and the description.
To edit this content browse to the pods section located under the content editor. From there you can upload your own photo, change the description or upload a photo in the descriptions place.
Editing the Home Page Content Blocks
Featured on the home page of template 13 are three main Calls to Action(CTA). These areas are used to bring a certain area of the site to the users attention, tease them about it and then have them click through to learn more.
In the sites footer we have also placed a social media block for quickly adding links to your other web locations such as facebook, twitter etc.
We have made these areas easy to edit and manage through the use of content blocks.
The About Us and Our Wines sections are both the same they just flip the image from right to left.
Under the Content Editor tab, navigate to the sub menu item titled “Content Blocks.”
From here either click on the About Us or Our Wines.
Events
The events content block is fairly similar to how the About Us and Our Wines section is set up with the exception of a few different fields.
You will notice there are two events under the event content group. Two is generally the best number to have displayed on the home page. This is both to keep the homepage size down, and also to bring the two most featured events to the forefront.
Social Icons
By default we have set up the four biggest social networks with icons. By clicking on each all you have to do is populate the link field with the link to your social page such as www.facebook.com/MyWinery. Simple as that.
Did you break something?
Luckily for you we have included the default HTML and CSS files for this template that you can download right here.