Instructions
Content Editor
To learn how to use the Content Editor, click here for our Content Editor Documentation.
Content Blocks
To learn how to use Content Blocks, click here for our Content Block Documentation.
Pods
To learn how to use Pods, click here for our Pods Documentation.
Layouts
If you want to get rid of the sub navigation on a page (like this one), go to Content Editor > select the page > Page Properties > Layout > Wide Page.
Featured Products Slider
These products are added to the Homepage through the Product Group 'Featured Products'. After clicking into a product, it can be added under Categories > Product Groups > Featured Products.
Homepage Linked Images
These are managed under Content Editor > Content Blocks > Homepage Links. There you can edit the existing Homepage Link Content Blocks or you can click 'Add A New Content' Block and then select the group of 'Homepage Links'. You can upload a background image, Give it a title, subtitle and a link. They will then automatically appear on the website. If you don't want to use them right now, you can delete them altogether. (Don't worry - you can still recreate them in the future by following the instructions above.)
Blog Section
You can edit the blog title (From Our Blog) under Content Editor > Pods > Homepage Blog. This section will automatically pull in a couple of your latest blog posts. If you have no posts to display, you can use this spot to add additional text content.
Subscribe Section
You can edit the title and text under Content Editor > Pods > Homepage Subscribe Content. Anyone who subscribes which this form will be added to the Contact Type of 'Newsletter'.
Events
This section automatically pulls the title, date and time from a maximum of your three closest upcoming events. You can add text and edit the 'View All Events' link and button text under Content Editor > Content Blocks > Homepage Events.
Homepage Content
This section is managed under Content Editor > General Page > Homepage. You any content here through the Content Editor. You also have the option of removing the three linkable content sections as these are entered onto the page through the components tool (Gear icon). If you want to edit/add them, you can do so under Content Editor > Content Blocks > Content Sections. To create one, click on 'Add A Content Block'. Give it a title and select the Group of 'Content Section'. Here you can add an image, title and content. You also have the option of adding a link and you can choose a width of 1/3 or 1/2. Make sure that it is added onto the page under Content Editor > General Pages to ensure that it appears on your site. You can also add these onto any inner content pages in the same way.
Footer Pages
The pages that show up in the footer are managed in the Content Editor. To add or remove a page from the footer, select the page, click Page Properties, for Footer Menu select Yes or No.
Footer Contact Info
The Contact section text is a pod and can be edited under Content Editor > Pods > Footer Address.
Footer Social Media
The social media icons available to use are Facebook, Twitter, Google Plus, Pinterest, Instagram, Vimeo, Youtube, and Yelp. These are not editable and must be changed by our design team. During the setup process, please send the corresponding links to your project manager.
Style Guide
Header Styles
Heading h1
This is a heading h1. 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. 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 18px. 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. 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. 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. 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
To use any of the following button styles, copy the code underneath the button > go to the Content Editor page > Click Source > Paste the code > Click Source > Highlight the button text and click the link icon to edit the link. You can then change the text to be whatever you want!
<a class="linkBtn" href="#"><span>Primary Link Button</span></a>
<a class="modalLinkBtn" href="#"><span>Modal Link Button</span></a>
<a class="largeLinkBtn" href="#"><span>Large Link Button</span></a>
<a class="linkAltBtn" href="#"><span>Alt Link Button</span></a>
<a class="modalLinkAltBtn" href="#"><span>Modal Link Alt Button</span></a>
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.
