By default, you can only change the loop speed of the Slideshow, Image Carousel, and Ticker Design Element to slow, fast, and medium:
This article will demonstrate how to change the loop speed to your desired value. Follow the steps below to get started.
TABLE OF CONTENTS
Prerequisites
- You must have the latest version of ShortPoint SPFx installed on your SharePoint environment.
- You must be a ShortPoint Designer with an active license.
- You must already have a Slideshow, an Image Carousel, or a Ticker on your page.
Step-by-step Tutorial
Follow the steps below to learn how to change the loop speed to specific values.
Step 1: Edit the ShortPoint web part
Go to the SharePoint page you want to use and click Edit:
Close the Toolbox:
Select the ShortPoint tag:
Click the Edit properties icon:
Step 2: Edit the Design Element
NOTEBefore proceeding, you must already have a Slideshow, an Image Carousel, or a Ticker on your page.
Click the EasyPass tag of the Design Element you will use. For this guide, we will use the Slideshow Design Element:
Click the cogwheel icon:
Step 3: Set a Loop Speed
Switch to the Design tab:
Select Slider Settings:
Choose a [1] Loop Speed and enable [2] Auto Play:
Apply your changes:
Step 4: Copy the Design Element
Click the EasyPass tag of the Design Element:
Select the ellipsis icon:
Click Copy:
Step 5: Paste and Prepare Code
Paste the copied code into a Notepad:
Look for loop-speed=
NoteIf you are using SlideShows or Image Carousel Design Element, look for Loop Speed. If your Design Element is Ticker, look for Speed.
Change the value inside the double quotation (" ") to the amount you like in milliseconds. In this example, we are going to change the Loop Speed value to 10000 to rotate every 10 seconds:
If you would like the SlideShows/Image Carousels/Tickers Design Element to rotate every 1 minute, then you need to put (1 minute * 60 seconds * 1000 milliseconds = 60000). If you would like it to rotate every 1 hour, then you need to put (1 hour * 60 minutes * 60 seconds * 1000 milliseconds = 3600000).
Once you are done changing the Loop Speed value, copy the code again:
Step 6: Paste Code Back in SharePoint
Go back to your page and delete the existing Design Element:
Then, right-click and paste the code you prepared in Step 5:
Step 7: Save
Click the eye icon to see your page in real-time:
Save to keep your changes:
ImportantIf you update any settings in your Slideshow, Image Carousel or Ticker, the Loop Speed/Speed value will reset, and you will have to repeat these steps again. It is because ShortPoint Loop Speed/Speed dropdown menu will not recognize the numeric value inside the loop speed option you set from its code. However, editing other Design Elements you have on your page should not affect your Slideshows/Image Carousels/Tickers Design Element Loop Speed value.
There you have it! You now know how to set a specific loop speed value for the Slideshow, Image Carousel, and Ticker Design Element.
Related Articles: