Keyword	Description
Sitesmith	Front end user experience that user interact with to make design selections.
Siteforge	Backend tool that takes the selections within Sitesmith and builds the website.
Content Editor (Side Panel)	As you make additions/changes in the Content Editor (Side Panel), you will see the changes happening in the Site View Panepreview.
Site View PanePreview
Site View Pane Preview Tool Bar	With this tool bar you can update colors, change images, move elementssections, select variables, updating padding, take a snapshot to save the layout, and navigate between the homepage, listing page, and detail page. Element
Section	Are the sections that display on the homepage of the website. You cannot use an element a section more than once on the homepage and you don’t have to use all elements sections on a website. You want to find the best combination of elements sections that makes the homepage look good and flow properly.
Variant	Variant is a style options within a specific elementsection. Clients have a choice of what the element section looks like. Some elements sections only have one style choice, while others have multiple styles to them. You can only access the Variant when using the Variant tool within an elementsection.
Continue Button (aka Save Button)	This is aka the “Save” button, it will save the content/selections made as you continue through the process. Make sure to click Continue at every opportunity so you save your work as you move through the different selections. No matter what Continue button you click, it will save the work you have done thus far.
Notes	Anytime that you see a “Notes” field within the Content Editor (Side Panel) you will be able to add a note for that selection. The goal is to take a note on something that you are not able to accomplish within the experience and it will save that note into Salesforce for the Front End Development team to complete the request. You can include URLs so that you can give the FED a image or a example from a URL of what you are referencing.

...

Select an Account - This selection connects the account within iCC for the purposes of data, saving, and site building via Siteforge.
- NOTE: This is a type a head field so you can start typing in the account you are looking for verse using a drop down menu
Select a Domain - This selection connects the domain within the account for the purposes of data, saving, and site building via Siteforge.
- Note: This is a type a head field so you can start typing in the domain you are looking for verse using a drop down menu
Select the Package Type - This selection will allow different functionalities to be available within the Sitesmith tool. Depending on which package gets selected will depend on what choices a user will have within the Sitesmith experience.
- Note: This is based on the agreement that the dealer signed, please be sure to select the correct package at this time, as this will be saved once selected and the continue button has been clicked. Once you have saved a package you cannot change the package selection without restarting
- Selections
  - Silver (Fewer website elements sections are available to select)
  - Gold (Both Gold and Platinum have all website element section selections available including Silver Package options)
  - Platinum(Both Gold and Platinum have all website element section selections available including Silver Package options)
Package Content - The goal of this feature is to help enable more functionality in Sitesmith when specific pick options or package details are selected within the sales process. This will allow us to automate some of the setup of features when selected via the package content.
- Note: This has not been fully built, but tow guide selection is available and does allow the tow guide element section to be selected within Sitesmith when checked.

...

During the Site Design process, you will start by utilizing the Content Editor (Side Panel) to start building out some of the design, but as you get into the look of the site, you will will want to align the elements sections you will want to use before continuing to use the Content Editor (Side Panel). By following the process you will save your time from added unnecessary content into an element section that you may not use.

Below is the recommendation of the process that you should follow when utilizing the Site Design functionality. You will follow this process until you get to the Home Page section. At this point you will stop utilizing the Content Editor until you have completed the design phase within the Site View Pane preview where you will display the elements sections needed, add images where necessary, and add background colors before moving on to the the process.

...

In the Site Layout, we start by selecting some of the basic elements sections that will be consistent through on all pages throughout the website. First you will select a starter layout that will give you a starting point. With so many elements sections available on the homepage, rather than displaying all elements sections as soon as you start a Sitesmith experience, we are providing a starting point so you don’t have to remove so many elements sections you don’t need.

You will also get to upload the dealer logo, select a header style, select a footer style, add the operating hours and social media icons.

...

Panel

panelIconId	1f4e3
panelIcon	:mega:
panelIconText	📣
bgColor	#DEEBFF

Goal: Select a layout that will most closely match what site design you would like to complete. You don’t have to stick with this layout, it just gives you a starting point so you don’t have to remove so many elements sections on the homepage.

Expand

title	Additional Details

Here we allow you to select a starting layout, because of all the different elements sections on the homepage, it was getting cumbersome to have to remove multiple elements sections to get to the layout that you want to start with. This is just a starting point and the layout can be fully customized through out the process.

S1 and S2 will be available for a Silver Package dealer
S1, S2, G1, and G2 will be available for a Gold Package dealer
S1, S2, G1, G2, and P1 will be available for a Platinum Package dealer

Future: This layout selection is the first iteration of a new direction that we will be moving forward with. Where we will have demo sites and layouts for the sales team to present during the sales process and select which layout the client likes best.

...

Panel

panelIconId	2705
panelIcon	:white_check_mark:
panelIconText	✅
bgColor	#ABF5D1

Take Action:

Ensure that all the labels you added in the navigation have a site page connected to them
Ensure all menu items have a green check mark and you have the confirmation message
Take any necessary notes for FED
Click Continue.

...

Warning

STOP! - Here is where you will pause from working with the Content Editor (Side Panel) and start configuring the layout of the homepage in the Site View Pane preview by utilizing the Site View Pane preview tool bar. You want to get all the elements sections you want to display on the homepage added prior to going back to the Content Editor (Side Panel).

As you select/remove elements sections on the homepage, the Content Editor (Side Panel) will automatically adjust to match the elements sections that you have selected to be on the homepage.

Site

...

preview Tool Bar

First you will need to understand how to use the tool bar. Here are the icons or actions that you can take within the Site View Pane preview and what they allow you to do.

Icon

Details

Action

The paint can icon tool will allow you to apply a color to the background of certain elementssections. Once you have click the paint can icon tool at the top The paint can icon will display on or in the elements sections where you are able to change the color. If the paint can icon does not appear after you have clicked the paint tool icon at the top, that means that element section does not have the ability to change the color.

The colors available are the 4 main colors within the theme selection in the Content Editor (Side Panel). Plus standard colors such as white, grey, charcoal, and black. The only colors that can be edited are the first 4 theme colors. When you change the theme colors, it will change the colors in this tool as well.

The image icon tool will allow you to apply images within certain elementssections, backgrounds, and banners. Once you have click the image icon tool at the top, the image icon will display on or in the elements sections where you are able to change an image. If the image icon does not appear after you have selected the paint tool icon at the top, that means that element section does not have the ability to change the image.

Actions you can take within the image selector:

You can filter by tag to only see the images you want to view so you don’t have to scroll through all the available images. This is a type a head feature and most of the tags are a single word.
You can refresh the images. This is best used when you change variant within an element section where the image size may be different. You can click Refresh Images to display the images that are sized for the variant that you have selected.
You can preview any image to see it as a larger image by clicking the box with an eye in the upper left corner of the image.
When you find an image you want to use, click the checkmark icon in the upper left of the image to select the image.
To remove the image you have selected, you will select the full image URL and delete the image URL.
You are able to use outside images by copying the image URL from the outside source (i.e. dealers current site) and paste that URL into the Image URL and it will display that exact image in Sitesmith. When the site builds, it will save that image as a new URL so we won’t loose that image. You are copying the image as is, so how ever big that image is from that outside source it will try to use that same size. You may have to resize the image and update the URL with the resized image to make it look proper.
You can apply an overlay on the image to make it darker or lighter or have no overlay to the image. When you apply the overlay the text color will automatically adjust if there is text overtop of the image.
Make sure to click Save after you have selected your image or added a image URL from an outside source.

This sections icon allows you take actions with the element section and change out the different styles (variants) for that elementsection.

Actions you can take within the variant selector tool:

Change Variant - allows you to select the way the element section looks on the homepage, some elements sections have more variants than others.
Insert Section - allows you to insert an element section that may not be displayed yet. If you click the insert section and you do not see any available elementssections, that means you have all available elements sections displayed on the homepage. When you select an element section to be inserted, it will place the element section below the element section that you selected the icon on. When you insert a elementsection, that element section control will show up in the Content Editor (Side Panel) for you to add content.
Move Up and Move Down - allows you to reposition the element section up or down the homepage.
Remove section - allows you to remove a element section from the homepage. If you remove the element section it will be removed from the Content Editor (Side Panel) as well.

The padding spacing icon will allow you to adjust the padding of certain elementssections. Not all elements sections have the ability to adjust the padding, so you will need to click the icon to see which elements sections have the ability to adjust the padding.

You can adjust the Top Padding or the Bottom Padding.

Options are: Extra Small, Small, Medium, and Large.

When to use this? The best scenario is where you see a lot of blank space you want to reduce that blank space as much as possible. You don’t want to totally remove all padding, but you might want to bring things closer together to make them look better.

Sometimes you may need to adjust the top of one element section and the bottom of the other to bring two elements sections closer together.

The Snapshot tool allows you to save multiple layouts and select from the layouts. This helps during the onboarding call with the client to be able to have a few different layouts that allows you to jump back and forth quickly so if the client wants to see a few different layouts we can switch back and forth quickly to show them the selections they are interested in.

Prior to getting on the call with the client you could design multiple options and save them in the snapshot so you can show them the options quickly by loading the different options for them on the call.

Actions you can take within the snapshot tool:

Save snapshot - you can save the layout how it is by clicking on the icon, within the pop up window you will want to name your snapshot with something that helps you remember the styling of this layout, and click Save.
Load snapshot - you can load the snapshot that you have saved by selecting the name and click Load.
You can delete saved snapshots from the load snapshot drop down. There is a red trashcan, click that to delete a saved snapshot.

Image RemovedImage Added

This allows you to quickly toggle between the homepage, listing page, and detail page without having to click into the Content Editor (Side Panel)

Clicking any element section within the Site View Pane preview will open the Content Editor (Side Panel) to the the element section you clicked on so that you can quickly navigate where you need to take an action within the Content Editor. Sometimes the element section may not have any action you can take in the Content Editor (Side Panel), but many times there are additional controls within Content Editor (Side Panel).

...

This is the list of all available elements sections on the Homepage, this does not mean we should display all elementssections, but for the user guide purposes, we are listing all available with the details for each. You will want to align your homepage elements sections to what the clients current site has or based on preference that the client has mentioned.

Elementssections	Details	Action
Hero	This is a multiple select element section meaning that you will have some functionality that you can take within the Content Editor (Side Panel) and you can use the variant selection icon to choose which variant you want to display. You will also need to use the Image Selection Tool depending on the variant you select. Within the Content Editor you can enter the slogan for the hero, if the variant you selected has it available (not all variants have a place for a slogan). Depending on if you want to use a Text Slogan or a Slogan created via an image, you have the ability to do either or, but you cannot currently do half text, half image. When using the image selector, you will need to save the image on your computer to be able to upload the image. There is a size limit of 100k There is an HTML editor option that will allow some additional styling features for text slogans. As always there is a notes area to include additional notes for the design/FED teams. Be sure to click the “Continue” button after using the tool so that it saves any work done.
Highlighted Product Types	This is a multiple select element section meaning that you will have some functionality that you can take within the Content Editor (Side Panel) and you can use the variant selection icon to choose which variant you want to display. You will also need to use the Image Selection Tool depending on the variant you select. Before starting this step, someone should have already enabled all the necessary product registrations within iCC for this dealers account. The product registrations are what help drive this feature within Sitesmith. Without the registrations, there would be nothing to select in this elementsection. To get a type to display with in the types bar, you will check the box for the default type available, or click the Add Type button to add a custom type to the bar. It’s best to use the check boxes when available. When adding a custom type, you will want to select the proper graphic for the type you are adding. In some cases you will want to add a custom type when grouping types such as motorhomes together into one icon. When adding in custom types you will want to make sure you link the page to the correct URL. Here is a list of default product page names to use Standard Pages. If the page is not listed here, follow the same pattern as (/product/type-name/) for an RV type. Note: You can add in custom non-type icons into the types bar. Maybe the dealer wants to use a type space to display Used RVs as a type or use a space for another graphic such as Shopper Guide. These custom pages do not need to follow the same structure as the types, this icon can link to any page within the website, just make sure you link the page correctly. You have the ability to select which type of icon graphics are used. More realistic 3rd graphics or silhouette graphics. You can also display or not display the New and Used links below the type icon. Due note that no matter what icon is there it will apply the new and used links. Notes will have to be taken for any custom work done by the FED team. As always there is a notes area to include additional notes for the design/FED teams. Be sure to click the “Continue” button after using the tool so that it saves any work done.
Tow Guide CTA	This is a multiple select element section meaning that you will have some functionality that you can take within the Content Editor (Side Panel) and you can use the variant selection icon to choose which variant you want to display. Within the tow guide element section you are able to adjust the heading and sub heading text. Currently no other options are available to adjust on this elementsection. As always there is a notes area to include additional notes for the design/FED teams. Be sure to click the “Continue” button after using the tool so that it saves any work done.
Shop Guide CTA	This is a multiple select element section meaning that you will have some functionality that you can take within the Content Editor (Side Panel) and you can use the variant selection icon to choose which variant you want to display. For the shopper guide, you are able to adjust the heading and sub heading text. Currently no other options are available to adjust on this elementsection. As always there is a notes area to include additional notes for the design/FED teams. Be sure to click the “Continue” button after using the tool so that it saves any work done.
Lifestyle Links	Within the Lifestyle Links we have 3 defaults that you can select. You also have the ability to add your own lifestyle links by entering in a link and clicking the plus icon, you will also want to add a label to display on the button on the website. The max you are able to display is 3. You will need to add a Target URL for each selection so the button links to a listing page. You will have to take notes for FED to make sure the listing pages have the proper settings on the listing page to display the units to match the Lifestyle button. As always there is a notes area to include additional notes for the design/FED teams. Be sure to click the “Continue” button after using the tool so that it saves any work done.
Rotating Banners	You will want to use the Image Selector tool to select the available banners within the image gallery. There is nothing more you can do within the Content Editor for this elementsection. As always there is a notes area to include additional notes for the design/FED teams. Be sure to click the “Continue” button after using the tool so that it saves any work done.
Shop Your Way	This is a multiple select element section meaning that you will have some functionality that you can take within the Content Editor (Side Panel) and you can use the variant selection icon to choose which variant you want to display. Within the Shop Your Way element section you can select up to 4 max services to display on the website. Each service has default text links within the groups that are set based on commonly used groupings for each service. While some dealers want to customize this more, this element section allows us to create the structure for the FED to add custom selections or make custom groupings based on what the client is looking for. As always there is a notes area to include additional notes for the design/FED teams. Be sure to click the “Continue” button after using the tool so that it saves any work done.
RV Explore	Within the RV Explore element section you are able to adjust the heading, sub heading text, and where the button links to. You also have the ability to select a background image for the elementsection. You will want to select an image where the focus of the image is more on the right side because of the text box being on the left side. For any additional work, we will need to involve the design/FED team. As always there is a notes area to include additional notes for the design/FED teams. Be sure to click the “Continue” button after using the tool so that it saves any work done.
Featured RVs	Currently there is no ability to select a different variant or make any changes within the Content Editor (Side Panel) for this elementsection. For any changes/additions to this elementsection, we will have to involve the design/FED team. As always there is a notes area to include additional notes for the design/FED teams. Be sure to click the “Continue” button after using the tool so that it saves any work done.
Highlighted Services	This is a multiple select element section meaning that you will have some functionality that you can take within the Content Editor (Side Panel) and you can use the variant selection icon to choose which variant you want to display. You will also need to use the Image Selection Tool depending on the variant you select. Within the Highlighted Services element section we have the ability to select up to 4 total Highlighted services. Whether you select from the default or create custom Highlighted Services we can only display 4. When creating a custom service, you will need to first type in the name of the service then click the plus icon. You will then need to add a Label to display on the website, add Action Text, and type in the Target URL (Note: When you type in the page name, if you currently don’t have that page created in the site page section, you will need to add the page in the Site Pages section.) Note: When switching between different card variants (Tall vs Short), you will need to make sure you are refreshing the images within the image selector tool because the size of the images are different between tall card vs short card. For anything custom, you will have to include the design/FED team to make customizations. As always there is a notes area to include additional notes for the design/FED teams. Be sure to click the “Continue” button after using the tool so that it saves any work done.
Brand Display	Before starting this step, someone should have already enabled all the necessary brands/models within iCC RV Library for this dealers account. The RV library is what helps drive this feature within Sitesmith. Without the models enabled there would be nothing displayed in this elementsection. We want to ensure we have all the proper brands/models enabled prior to the call with the client so that they can see and validate that we have enabled all the correct brands. If a dealer sells many different manufacturers on their lot, we will want to select the first option “Show manufacturer logos with brand listed in dropdowns.” If a dealer sells one manufacturer we should display the second options “Show all brand logos (without manufacturers)” so it appears like they have more logos vs just showing on manufacturer logo. It is up to the client what they want to do, but we should not have too many logos or too few logos displaying on the homepage. As always there is a notes area to include additional notes for the design/FED teams. Be sure to click the “Continue” button after using the tool so that it saves any work done.
Reviews	This is a multiple select element section meaning that you will have some functionality that you can take within the Content Editor (Side Panel) and you can use the variant selection icon to choose which variant you want to display. You will also need to use the Image Selection Tool depending on the variant you select. Within the Reviews elementsection, you have the ability to add static reviews to the homepage. You can add a name, location, and a short review. You also have the ability to link where the Read More Reviews would go to. You can link it to our default testimonials page or to a 3rd party review page. As always there is a notes area to include additional notes for the design/FED teams. Be sure to click the “Continue” button after using the tool so that it saves any work done.
Welcome Section	This is a multiple select element section meaning that you will have some functionality that you can take within the Content Editor (Side Panel) and you can use the variant selection icon to choose which variant you want to display. You will also need to use the Image Selection Tool depending on the variant you select. Within the Welcome To Section, you will be able to edit the Heading and add the body content. As always there is a notes area to include additional notes for the design/FED teams. Be sure to click the “Continue” button after using the tool so that it saves any work done.