Adding Images to the Slider
Step 1: Add the images you wish to use to the “Resources” section.
Step 2: Navigate to your Page Inspector > HTML tab > Header Tab.
Step 3: Copy and Paste the code below into the text area.
<img src="%resource(paisley.png)%" alt="example" title="Caption text here" />
Step 4: Change name_of_resource.jpg to match the name of your resource & be sure to make sure the extension matches as well (png, jpeg, or jpg). The names are case sensitive so slide-1.jpg in the code and slide-1.JPG in the resource section would not work.
Step 5: Change the value of ‘title’ to your desired caption or delete title if you don’t wish to display a caption.
Step 6: Repeat steps until you have as many photos you want to display in the slider, preview and you are complete. Your finished code in the Header-Header section should be similar to the screen shot below.
Adding Content to the Promotional Boxes
Step 1: Navigate to the Sidebar Tab of the Page Inspector > Sidebar.
Step 2: Copy and Paste the code below into the Sidebar text area.
<div id="myExtraContent1"> Promo Box 1 Content Here </div> <div id="myExtraContent2"> Promo Box 2 Content Here </div> <div id="myExtraContent3"> Promo Box 3 Content Here </div> <div id="myExtraContent4"> Promo Box 4 Content Here </div>
Step 3: Highlight the code & select Ignore Formatting from the Format Drop down menu (or press ? . ).
Step 4: Add your desired content to each section replacing the text “Promo Box # Content Here”. Then Highlight everything between
& select Ignore Formatting from the Format Drop down menu again (or press ? . ). The content will now not be highlighted in pink anymore and only the HTML code will be highlighted as code.
Step 5: Preview and you are complete. Your finished code in the Sidebar should be similar to the screen shot below.
Social Media Icons
Step 1: Social Media Icons can be placed in the Main Content area, Sidebar, and Site Slogan. Copy and paste the code below into your desired location.
<div id="socialMedia"> </div>
Step 2: Copy the code below and paste it between <div id=”socialMedia”> & </div>.
Step 3: Find the Social Media Icon you wish you use from the Glyph Chart below.
Step 4: Type the corresponding letter in-between <span> & </span>.
Step 5: Replace http://www.webaddresshere.com with the address to your social media site.
Step 6: Repeat steps 3 – 5 untill you have all the icons you wish to use.
Step 7: Highlight the code & select Ignore Formatting from the Format Drop down menu (or press ? . ). Your finished results should resemble the screen shot below.
Step 1: After creating a page, double click the title to begin renaming the page.
Step 2: Type in <p> & then your desired subtitle followed by </p>. Your finished title should resemble the screenshot below.