Clicando em um link, abre um lightbox com as informações do produto clicado, no entanto há necessidade de exibir mais de uma "página" nesse lightbox. Como inserir mais "páginas" para avançar/voltar no lightbox?

Exemplo de um link: product01

    <div class="col-md-6"><a href="#" data-toggle="modal" data-   target="#product01"><p style="float:left; transform: rotate(-90deg); transform-origin: left top 0; height:10px; white-space:nowrap; margin:165px -20px 0 -10px; width:40px; height:10px; font-weight:bold">Creme</p><img class="separator" src="img/produtos/title_separator.png"><img class="prod_link" src="img/produtos/creme.png"></a></div>

Clicando nele abre:

    <div class="modal fade" id="product01" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
    <div class="modal-dialog">
    <div class="modal-content">
    <div class="modal-body">          
    <div class="modal-cont">        
    <div class="modal-img">    
    <img src="img/produtos/oleo_peroba_zoom.png">
    </div>
    <div class="modal-text">    
    <div class="tab-title">
    <b>Creme</b> <img class="print" src="img/produtos/icon_printer.png" onclick="myFunction()">
    </div>
    <div style="clear:both"></div>
    <p>Conserva e limpa</p>
    </div>
    <div class="modal-footer">
    <button type="button" class="close" data-dismiss="modal"><img src="img/produtos/close.png"></button>
    </div>
    </div>
    </div>
    </div>

E através de setas < > nessa div acima deveria aparecer outra div dessa porém com outro produto, isso ocorrendo no lightbox.