Steps

The Sprocket Steps web part is used to visually display content as a sequence of steps. This web part is frequently used to display Project Milestones but also can be used anywhere you wish to guide a series of actions or display progress.
When your page is in Edit mode, click the icon, search for "Sprocket Steps", and select the Sprocket Steps web part from the results.

Features

• Edit in the page as manual entries or use a task list as the data source
• Display steps horizontally or vertically
• Add a subtitle to display date or information
• Use Status and Due Date to display progress and overdue steps as red
• A link can be added to the step
• The style can reflect your site theme

Configurations

After you select the Sprocket Steps web part, click the Configure Web Part button or icon on the menu on the left of the web part to open the Configuration section on the right. In this section, you can perform the following configurations:

1. On page 1, configure the following in Display Options section:

   Field	Description
   Show Title	Click to enable title display of the web part.
   Show in Panel	Click to enable display of items in panel.
   Show Sample Data	Enable to display the sample data.
   Type	Click the drop-down list and select the type as Dots or Chevron.
   Layout	Click the drop-down list and select the layout as Horizontal or Vertical.
   Wrap Items	Enable to wrap the items when you have selected Horizontal layout.
   Show Filter Bar	Click to enable Filter bar where you can search for teams.

2. Click Next to navigate to page 2. On this page, configure the following in Steps section.

tip

Fields marked with red asterisks (*) are mandatory.

In the Item Data Source field, click the drop-down and select the data source as List or Manual.

If you have selected Manual, perform the following:
a. Click Add Milestone button.
b. Populate the form as tabulated:

Field	Description
Title	Enter the title for the milestone/step.
subtitle	Enter a subtitle for the milestone/step.
URL	Enter a URL which is associated to the step. Select the check box if you want to open the URL on a new browser tab.
Status	Click the drop-down list and select a status. Available options are Not Started, In Progress, Completed.
Due Date	Click the calendar icon and pick a due date. Note: The milestone will turn red after the selected date.

c. You can click Add Milestone button to add further steps/milestones.

If you have selected List in the Item Data Source field, perform the following:
a. Populate the form as tabulated:

Field	Description
Site URL	Click the drop-down list and select a source site.
Web URL	Click the drop-down list and select a source web.
List Title	Click the drop-down list and select a source list.
Open list in new tab	Enable to open the list on a new tab, when you click Go to List link. If this option is disabled, the list will open on the same page.
Link Types	Click the drop-down list and select an option.
Order By	Click the drop-down list and select a field value based on which you want to order the documents.
Show items in ascending order/Show items in descending order	Select from one of the options to order the list based on ascending or descending order of the field value selected in Order By field.

Using Filters

Filters enable you to control the document listing. Sprocket offers you the following filter options:

1. Use Query Strings
   To use the query string, add [PageQueryString:Parameter] to the 'Value' text box of each filter. To use the property bag, add [PropertyBagKey:Key] to the value box of each other. You can also use the current URL with [CurrentPageUrl].

2. Use Expressions
   To use expressions, click Add Filter button and in the pop-up, select values for Field, Operator, and Values. You can use And/Or conditions to define multiple expressions.

3. Once all the required updates and configurations are performed, click Republish button to publish the page.

FAQs

1. Do I need to add the steps if I already have a task list?
You do not need to recreate the information manually if you have items and dates in a task list. In the web part settings change the Item Data Source to List, link to the relevant list and apply formatting including sorting and filtering if required. Any updates made to the list items will be reflected in the web part.

2. Can I change the order and update the steps?
Where steps are added manually open page 2 of the web part settings and use the up/down arrows to change the order. You can edit the fields and update the Status to change the icon displayed for the step.