[TUTORIAL] How to Configure the Footer

  1. 1. Go to your website's root folder and click on _includes.

    Go to your website's root folder and click on _includes.
  2. 2. Click on footer-dept.pcf.

    Click on footer-dept.pcf.
  3. 3. Make sure you Check Out the file so you can see and edit all of the footer properties. You will see different properties if the file is not checked out.

    Make sure you Check Out the file so you can see and edit all of the footer properties. You will see different properties if the file is not checked out.
  4. 4. Once the page is checked out, click on Properties.

    Once the page is checked out, click on Properties.
  5. 5. You can skip this Title and Metadata section.

    You can skip this Title and Metadata section.
  6. 6. Instead, we'll start in Custom Settings.

    Instead, we'll start in Custom Settings.
  7. 7. The first option we have is under Layout > Links Grid Layout. You have your choice of Small, which is a simple footer with no link lists, or 3- or 4-columns of links in a larger footer. For this example, we'll choose 4 columns.

    The first option we have is under Layout > Links Grid Layout. You have your choice of Small, which is a simple footer with no link lists, or 3- or 4-columns of links in a larger footer. For this example, we'll choose 4 columns.
  8. 8. Next, you'll have the option to turn the top divider on or off. This is the gradient that separates the bottom of your content and the footer itself. Unless there's a specific reason you can't use it, we recommend keeping the divider on.

    Next, you'll have the option to turn the top divider on or off. This is the gradient that separates the bottom of your content and the footer itself. Unless there's a specific reason you can't use it, we recommend keeping the divider on.
  9. 9. Now we'll move to the Bottom Content section. Bottom Links are links that appear between the contact information and the Privacy Policy and other required links in the blue band of every footer, regardless of the layout you chose above.

    Now we'll move to the Bottom Content section. Bottom Links are links that appear between the contact information and the Privacy Policy and other required links in the blue band of every footer, regardless of the layout you chose above.
  10. 10. Show Department Name is pretty straightforward. You can choose to show the name of your department in the footer. We recommend leaving this on Yes...

    Show Department Name is pretty straightforward. You can choose to show the name of your department in the footer. We recommend leaving this on Yes...
  11. 11. ...and typing your department's name in the "Department Name" field.

    ...and typing your department's name in the "Department Name" field.
  12. 12. "Show Contact?" will display the address and other contact information for your department in the footer's blue band.

    "Show Contact?" will display the address and other contact information for your department in the footer's blue band.
  13. 13. "Show Back to Top Button" will display an up arrow in the bottom right-hand corner of your site, so people can easily get back to the top of your site's webpages. We recommend leaving this set to "Yes."

    "Show Back to Top Button" will display an up arrow in the bottom right-hand corner of your site, so people can easily get back to the top of your site's webpages. We recommend leaving this set to "Yes."
    1. 14. A. Next is the Social Links section. Depending on which social media accounts you have, you can fill them in here and their icons will display in the blue band of the footer.

    2. 14. B. For each platform you select to display, enter a screenreader-friendly title in the Title field, like "Student Affairs Facebook Page",

    3. 14. C. the full URL of the page,

    4. 14. D. and you can leave the icons as-is.

    A. Next is the Social Links section. Depending on which social media accounts you have, you can fill them in here and their icons will display in the blue band of the footer. B. For each platform you select to display, enter a screenreader-friendly t
  14. 15. When you're done, click on SAVE.

    When you're done, click on SAVE.
  15. 16. If you selected a 3- or 4-column layout, you'll also need to configure the column category names and links beneath them.

    If you selected a 3- or 4-column layout, you'll also need to configure the column category names and links beneath them.
  16. 17. To do this, click on the Edit tab...

    To do this, click on the Edit tab...
  17. 18. And you'll see placeholder content in various content areas.

    And you'll see placeholder content in various content areas.
  18. 19. Click on each content section to make edits. We'll start with Category 1...

    Click on each content section to make edits. We'll start with Category 1...
  19. 20. ...and update the name.

    ...and update the name.
  20. 21. You'll need to click on SAVE before you go to edit a different section.

    You'll need to click on SAVE before you go to edit a different section.
  21. 22. Next, click "Edit Category 1 Links"...

    Next, click "Edit Category 1 Links"...
  22. 23. ...which work like any other bulleted list of links in the CMS.

    ...which work like any other bulleted list of links in the CMS.
  23. 24. As an example, I'll type "Office of Equity and Access" in the first bullet...

    As an example, I'll type "Office of Equity and Access" in the first bullet...
  24. 25. ...hit the Insert Link button in the toolbar...

    ...hit the Insert Link button in the toolbar...
    1. 26. A. ...and either paste the URL directly here,

    2. 26. B. or use the File Chooser.

    A. ...and either paste the URL directly here, B. or use the File Chooser.
    1. 27. A. I'll type a # as placeholder content for now,

    2. 27. B. then click on SAVE.

    A. I'll type a # as placeholder content for now, B. then click on SAVE.
  25. 28. Repeat that for each link in the column and delete any placeholder bullets you don't need.

    Repeat that for each link in the column and delete any placeholder bullets you don't need.
  26. 29. Click on Save to move to the next category, and repeat these steps.

    Click on Save to move to the next category, and repeat these steps.
  27. 30. After you save your final section, click on Preview...

    After you save your final section, click on Preview...
  28. 31. ...then PUBLISH to push changes live. Great job!

    ...then PUBLISH to push changes live. Great job!