(Since v1.5) Splider provides the option of giving any slide an ID/Hash value. What this then allows is for a particular slide (or slides) to be brought into view by passing in a hash value to the url. This can be extremely useful if you want certain content to be initially visible to certain groups of people. You can also use the functionality at page level by having a button set to move a slider (or sliders) to a particular point.
Each Splider slide type contains a text field where you can specify the desired name for any slide.
In this example we have added the value of 'designer'. If we then append '#designer' to our url in the browser (or to a button url on the page) then this Splider will navigate to this particular slide.
Tips and tricks
Add to all?: You don't need to add a hash value to every slide - in fact you are best only adding it to ones that you will potentially want to be able to navigate directly to in certain circumstances. A good example of where you might want to add a value to each slide in a slider is if you are using it for step-by-step instructions. It means you could direct people to a particular step in the process and also means that as the person works through each step, the value in the url bar is updated to match the current slide's value (which also means that they can even use the browser's back button to go back through the steps - if they so wished).
Naming convention: You should use readable / sensible values as these will be seen in the browser url bar
Shared values: Normally with these kinds of things you will want to use unique names for your slides however, by giving multiple slides (in separate sliders) the same value you can set all of these sliders to go to a particular slide at the same time.
Autoplay slides: Note: The url hash function may be affected if you have any Spliders on the page that are set to Autoplay. When these advance automatically it may affect the url and steal the focus.
Download demo (a demo of this functionality is included with the Splider Grid demo file)
Demo file is built using Splider 1 and will be updated to Splider 2 version asap. In meantime you can open with Splider 1 (included with v2) to view settings if you want to recreate. View our article about migrating a slider from Splider 1 to Splider 2.
