Instruksi untuk Slider template ini

Below are instructions to post images into the slider for this template - Gadgets For Blogger:



To add content to image slider -- Click on Edit in the slider widget


Add this code to the body of the gadget:

<div class="fp-slides-items" >
<div class="fp-thumbnail">
<a href="post url"><img src="image url for slider" /></a>
</div>
<div class="fp-content-wrap">
<div class="fp-content">
<h3 class="fp-title">
<a href="post url">post title</a>
</h3>
<p>
Post description snippet
</p>
</div>
<div class="fp-prev-next-wrap clearfix">
<a href="#fp-next" class="fp-next"></a>
<a href="#fp-prev" class="fp-prev"></a>
</div>
</div>
</div>

Change the areas indicated in bold to your desired targets. This code is good for one image in the slider.  If you want more than one image, just duplicate this code. For example:

<div class="fp-slides-items" >
<div class="fp-thumbnail">
<a href="post url"><img src="image url for slider" /></a>
</div>
<div class="fp-content-wrap">
<div class="fp-content">
<h3 class="fp-title">
<a href="post url">post title</a>
</h3>
<p>
Post description snippet
</p>
</div>
<div class="fp-prev-next-wrap clearfix">
<a href="#fp-next" class="fp-next"></a>
<a href="#fp-prev" class="fp-prev"></a>
</div>
</div>
</div>
<div class="fp-slides-items" >
<div class="fp-thumbnail">
<a href="post url"><img src="image url for slider" /></a>
</div>
<div class="fp-content-wrap">
<div class="fp-content">
<h3 class="fp-title">
<a href="post url">post title</a>
</h3>
<p>
Post description snippet
</p>
</div>
<div class="fp-prev-next-wrap clearfix">
<a href="#fp-next" class="fp-next"></a>
<a href="#fp-prev" class="fp-prev"></a>
</div>
</div>
</div>

The code above is for two images.  Just repeat the code for how many images/posts you wish to appear in the slider.

What Next?

Related Articles