In order to create a viewer using this configuration with a vertical side bar, the code would look like this:
In order to place the thumbnail bar on the right of the viewer, the parameter vertical needs to be set to true in the FSI ThumbBar tag. Furthermore, the div that is set around the viewer needs to include a padding that matches the width of the FSI Thumbbar instance, in this case 200px, so the padding of the div is set to padding-right:200px.
If you would like to use FullScreen, it is important to include fullScreenElement and set the parameter to the ID of the div that surrounds the FSI ThumbBar and the FSI Viewer in order to ensure that everything is included in FullScreen mode.
In this example, elementWidth sets the thumnail width to 20%. The parameter autoElementSpacing ensures an even spacing between the thumbnails. This automatically adapts if the size of the viewport changes, e.g. in FullScreen mode.