Nivo Slider Auto Thumbs with TimThumb


/ Published in: HTML

Just a quick and painless way to add thumbnail support to the Nivo Slider with TimThumb.


Copy this code and paste it in your HTML
  1. Get yourself the TimThumb source and put it in the root of your site.
  2.  
  3. Create a folder in the root of your site named cache and set the permissions to 777.
  4.  
  5. Now open your nivo slider js file. Im using jquery.nivo.slider.pack.js, search for the first nivo-control.
  6.  
  7. <a rel="'+k+'"><img src="'+f.attr("rel")+'" alt="" /></a>
  8.  
  9. Now replace that with
  10.  
  11. <a rel="'+k+'"><img src="timthumb.php?src='+f.attr("src")+'&h=19&w=35" alt="" /></a>
  12.  
  13. The changes made are the timthumb.php addition to the image src and the attr change to src.
  14.  
  15. timthumb.php?src='+f.attr("src")+'&h=19&w=35
  16.  
  17. adjust the h= and w= to your liking.
  18.  
  19. Save the file and your good to go, no need to make thumbnails or anything else to the img tag in your nivo slider.
  20.  
  21. If you would like installation help just contact me via skype: blueicestudios

URL: http://www.blueicestudios.com/nivo-slider-auto-thumbs-with-timthumb/

Report this snippet


Comments

RSS Icon Subscribe to comments

You need to login to post a comment.