Viewing 2 posts - 1 through 2 (of 2 total)
  • Author
    Posts
  • dignacio Friend
    #157929

    I want to change the navigation from circle navigation shown below

    To this navigation button taken from the template JA Portfolio.

    Also, how can i move the navigation to be on the right hand side of the slideshow?

    Any help would be greatly appreciated.

    Thanks!

    Phan Gam Friend
    #369072

    You can try it as follows:
    #1. Open file default.php under templatesja_kyanite_iihtmlmod_jaslideshow2 folder.
    #2. Goto about line 46, after
    <?php endif; ?>
    line change the code block :

    <?php if ($navigation): ?>
    <div class="ja-slide-mask">
    </div>
    <div class="ja-slide-thumbs-wrap">
    <div class="ja-slide-thumbs">
    <?php for ($i=0;$i<count($images); $i++) {?>
    <div class="ja-slide-thumb">
    <?php if ($navigation=='thumbs'){?><img src="<?php echo $thumbArray[$i]?>" alt="Photo Thumb" />
    <?php }else{?><span><?php echo ($i+1);?></span><?php } ?>
    </div>
    <?php }?>
    </div>

    <div class="ja-slide-thumbs-mask"><span class="ja-slide-thumbs-mask-left"> </span><span class="ja-slide-thumbs-mask-center"> </span><span class="ja-slide-thumbs-mask-right"> </span></div>

    <p class="ja-slide-thumbs-handles">
    <?php for ($i=0;$i<count($images); $i++) {?>
    <span> </span>
    <?php }?>
    </p>
    </div>
    <?php endif; ?>

    Change to : <?php if ($navigation): ?>
    <div class=”ja-slide-mask”>
    </div>
    <div class=”ja-slide-thumbs-wrap”>
    <div class=”ja-slide-thumbs”>
    <?php for ($i=0;$i<count($images); $i++) {?>
    <div class=”ja-slide-thumb”>
    <?php if ($navigation==’thumbs’){?><img src=”<?php echo $thumbArray[$i]?>” alt=”Photo Thumb” />
    <?php }else{?><span><?php echo ($i+1);?></span><?php } ?>
    </div>
    <?php }?>
    </div>

    <div class=”ja-slide-thumbs-mask”><span class=”ja-slide-thumbs-mask-left”> </span><span class=”ja-slide-thumbs-mask-center”> </span><span class=”ja-slide-thumbs-mask-right”> </span></div>

    <p class=”ja-slide-thumbs-handles”>
    <?php for ($i=0;$i<count($images); $i++) {?>
    <span> </span>
    <?php }?>
    </p>
    </div>
    <?php else: ?>
    <div class=”ja-slide-buttons clearfix”>
    <span class=”ja-slide-prev”>« <?php echo JText::_(‘PREVIOUS’);?></span>
    <span class=”ja-slide-next”><?php echo JText::_(‘NEXT’);?> »</span>
    </div>
    <?php endif;?>
    #3. Goto JA Slideshow2 in backend, set Navigation Show params to “No”

    After finishing, clear all cache data, and check again, you can see 2 button Previous and Next on right hand side of the slideshow. To get the same style for 2 button like JA Social, you can get image, and make style for ja-slide-prev and ja-slide-next class as Social.
    Hope that helps

Viewing 2 posts - 1 through 2 (of 2 total)

This topic contains 2 replies, has 2 voices, and was last updated by  Phan Gam 13 years, 10 months ago.

We moved to new unified forum. Please post all new support queries in our New Forum