How to create whole slide with hyperlink?

If you don't have any <a> elements in a slide

Wrap slide HTML content with link element:

<a class="rsContent" href="http://example.com">
    <img src="image.jpg" class="rsImg"/>
</a>

If you have <a> tags in slide markup (lazy-loaded images)

According to HTML specification, you can not nest a elements, so markup of a slide with a link should look like this:

<div class="rsContent">
    <a class="rsImg" href="image.jpg" alt="image desc">image desc</a>
    <a class="rsLink" href="http://example.com">link desc</a>
</div> 

Make sure that you have rsLink class in royalslider.css, or add it manually:

.rsLink {
    left:0;
    top:0;
    position:absolute;
    width:100%;
    height:100%;
    display:block;  
    z-index: 20;
    background: transparent;
    -webkit-backface-visibility: hidden;
}

Additional notes:

1. Class `rsContent` is not always required, it simply stretches element to full width and height of slide. 2. The slider will automatically block `a` element during drag/swipe. 3. Sometimes it's better to use call-to-action button inside of a slide instead of linking the whole image. 4. You'll probably want to disable `navigateByClick` slider option, which makes slideshow switch slide on click.