How to Create and Edit the Storefront Footer Follow
The footer area is your company information in the case of a B2C site, or the company information of your customer in the case of a B2B site. The footer displays at the bottom of each page on the website. We have three ways you can display the footer information.
- Default - we will automatically display and format the Site Owner account information from the Site Owner Profile.
- Custom - You can add custom information via HTML.
- Enhanced - Using our Footer Editor, you can build a footer with columns, links, newsletter signups, and more. This option is popular for B2C sites.
To make your selection of the type of footer you would like to use, go to: Admin > Site Settings > Display Elements > Site Footer.
Creating a Default Footer
In the Display Elements area, select the "Site Default (Owner's Info) option. You will see that MOD automatically fills in the information that is being pulled from the Site Owner's Profile. Select Save and this detail will be displayed at the bottom of the site page as seen in the screenshot below.
This information can be edited by changing the Site Owners account information. In order to do this, you will need to be signed in as the Site Owner, then go to the Site Settings > Site Info in the Administration Menu.
Creating a Custom Footer
If you are using the Custom option, the footer can be edited in the Site Settings > Display Elements section.
You can add custom text that you would like to display in the text field that will be displayed to you once you select the option. You may want to use this reference to change how you want the emails to be sent out. You can add another email, bcc someone, or cc someone onto the email that will be sent by clicking the bottom link as seen below:
Additionally, if you are not well versed in HTML you can always use an online HTML editor to help.
Creating a Footer with the Enhanced Option
The Enhanced option is common in a B2C website. This option allows you to customize links to various pages, categories, social media websites, newsletters, etc. from your MOD website. Navigate to this option by going to Site Settings > Display Elements > Site Footer > Select the Enhanced option > then select the Footer Editor link.
As seen below:
When you select this option, a new Editor window will open where you will construct the Footer that you would like.
The Footer is broken up into 12 columns. Each column can have 4 different widget elements that you can drag and drop into the columns you create. You can also specify how wide you would like each column to be by using the dropdown menu at the top of each. In my example you will see that I have five columns but the first 4 are using the space of 2 column, and the last one is using the space of 4. Together they add up to the 12 available. I've also added another row below those 5 that is using the full width of the page (all 12 columns) that I've used to create my contact information.
Once you've dragged and dropped your various widgets onto the layout, you can use the pencil icon to edit the content of each, or the garbage icon to delete one from the column you added it to. You can also drag and drop each of the widgets to other columns if you would like.
The Four Widget Elements you can drag and drop are:
- Title - When a title is added, it will have a larger font and the text you enter will have an underline. Use this to start each column or break up one or more elements you have in one of your columns, as seen in the screenshot above for Follow Us.
- Data - Using the Data option you can enter html text directly in the text area available to you. This can be used to add a custom script (for something like a Newsletter sign up), or simple text. You can also use the Merge drop down inside the Data edit window to add some common data options and shortcuts as described below.
The various options in the Merge area are:
- File Library - to use an image from the file library, select this link and then select Edit on the image you would like to use. From the popup window, copy the HTML URL shown and then close the window and return to the Editor where you will paste the HTML URL into the window.
- Social Media - Facebook, LinkedIn, Twitter, Youtube, Phone and Email are all options that when selected, you will enter in the link to your accounts and the link script will be entered for you in the text area.
- HTML - With this option we've provided some common HTML codes for you to use with the text you can enter in the Data window. Options are: Divider Line, Line Break, List Ordered, List Unordered, Paragraph, Paragraph Small Font, and Link.
- Pages - Select from the list of all the Pages you've created on your site by selecting the Edit button at the bottom of the window. Each page will be shown on its own line in the column.
- Catalog - Select from the list of all the Catalogs added to your website by selecting the Edit button at the bottom of the window. Each catalog will be shown on its own line in the column. If you add a Catalog to your footer, be sure to turn ON that catalog in Users & Groups.