jQuery Image Slider For Blogger - V3

As per your requests we are glad to present yet another stunning version of Image slideshow Widget for BlogSpot blogs. This widget is different from its previous versions with regard to speed, load time, navigation and control options. You can use it to display even your Featured Posts using the Featured post title and description. This widget is again an extracted code from a WordPress template. The slider is coded such that it will appear on your homepage only. So lets first see a demo,

Live Demo

Adding the Slider To Blogger:

Kindly follow these steps:
  1. Go To Blogger > Design > Edit HTML
  2. Backup your template
  3. Search for </head>
  4. Just above it paste the jQuery code in this page -> Slider jQuery Code
  5. Then search for ]]></b:skin>
  6. Just above it paste the CSS code below,

/*-------------------- MBT jQuery Image Slider -------------*/
.featuredposts{border:1px solid #E9E7DE;width:608px;background:#FFF;margin:0 0 10px 0;height:400px;overflow:hidden;}
.fp-thumbnail{border:3px solid #dddddd; width:580px;height:266px;margin-bottom:10px;overflow:hidden;}
.fp-thumbnail:hover{border:3px solid #CAC9C9; width:580px;height:266px;margin-bottom:10px;overflow:hidden;}
.fp-title{color:#787878;font:bold 14px  Arial, Helvetica, Sans-serif;padding:0 0 4px 0;margin:0; text-transform:uppercase;}
.fp-title a{color:#000;text-decoration:none;}
.fp-title a:hover{color:#0080fF;text-decoration:none;}
.fp-label{color:#504D4D;margin:15px 15px 0 15px;padding:0;text-transform:uppercase;font:bold 16px/16px Arial,Helvetica,Sans-serif;}
.fp-post p{color:#504D4D;padding:0;margin:0;font:10px Arial,Helvetica,Sans-serif;height:32px;overflow:hidden;}
.fp-nav{width:590px;padding:0px 10px;height:14px;}
.fp-pager a{background-image:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg2d8ScPLIU8AI8zloH3LBuFLrFRMWRAcGy1C9KbPT66BB2lFPn-AjGIPfva1GYWWXqhK4ONaXzzmvPpcgxtfXnzEfVS1i0aybr7ss9hjNS3GhF4dCMUF6-ftVkomDCE24NElU_5VhCdkM/s1600/featured-pager.png);cursor:pointer;margin:3px 6px 0 0;padding:0;height:10px;width:10px;display:block;float:left;overflow:hidden;text-indent:-999px;background-position:0 0;}
.fp-pager a:hover,.fp-pager a.activeSlide{text-decoration:none;background-position:0 -110px;}
.fp-prev{float:right;margin-right:4px;width:15px;height:17px;opacity:0.7;background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjb5JEjXLGfxeCd6I-YQA0KeyYcGS30qdttIENEJr8omD3EV-A8jF1dW9MsgCOqdszp2ztc_8UD64HNTMXLXxh_T_SjsC_EeV2hbSXxOa4SPEzk71SiOIIAW0SgdZpPj8KTmjh4CYdLuWI/s1600/featured-prev.png) top left no-repeat;}
.fp-next{float:right;width:15px;height:17px;margin-left:4px;opacity:0.7;background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjpJvbzdIf0CXo9ziSOp-vO-dat44pj3foYiM4QT_5YBB8vNJYQkjgWmodR2RtgVk0RWmihRgBEk7VD1-Hj80mrR4HIwnikZ6XKP7pMBjkxgn6veRpYGRa2lFp9Wc5lUvugD-Zd4I7TPoI/s1600/featured-next.png;) top left no-repeat}

          7.   Now Search for this,
<div id='main-wrapper'>
Hint: This code is located near <div id='content-wrapper'>
PS: In this part most of you will face problems as the coding for each template differ. If you could not find this code then do not panic and simply post your Blog URL in the comments.
   8.   and just below it add the HTML code below,
<b:if cond='data:blog.pageType != &quot;static_page&quot;'>
<b:if cond='data:blog.pageType != &quot;item&quot;'>

<div class='featuredposts clearfix'>
<div class='fp-slides'>
<div class='fp-post'>
<div class='fp-thumbnail'><a href='ADD POST URL-1 HERE'><img src='ADD IMAGE-1 LINK HERE'/></a></div><h3 class='fp-title'><a href='ADD POST URL-1 HERE'>WRITE POST TITLE HERE...</a></h3> <p> WRITE POST DESCRIPTION HERE... </p>
<div class='fp-post'>
<div class='fp-thumbnail'><a href='ADD POST URL-2 HERE'><img src='ADD IMAGE-2 LINK HERE'/></a></div>
<h3 class='fp-title'><a href='ADD POST URL-2 HERE'>WRITE POST TITLE HERE...</a></h3> <p> WRITE POST DESCRIPTION HERE... </p>
<div class='fp-post'>
<div class='fp-thumbnail'><a href='ADD POST URL-3 HERE'><img src='ADD IMAGE-3 LINK HERE'/></a></div>
<h3 class='fp-title'><a href='ADD POST URL-3 HERE'>WRITE POST TITLE HERE...</a></h3> <p> WRITE POST DESCRIPTION HERE... </p>
<div class='fp-post'>
<div class='fp-thumbnail'><a href='ADD POST URL-4 HERE'><img src='ADD IMAGE-4 LINK HERE'/></a></div>
<h3 class='fp-title'><a href='ADD POST URL-4 HERE'>WRITE POST TITLE HERE...</a></h3> <p> WRITE POST DESCRIPTION HERE... </p>
<div class='fp-post'>
<div class='fp-thumbnail'><a href='ADD POST URL-5 HERE'><img src='ADD IMAGE-5 LINK HERE'/></a></div>
<h3 class='fp-title'><a href='ADD POST URL-5 HERE'>WRITE POST TITLE HERE...</a></h3> <p> WRITE POST DESCRIPTION HERE... </p>
<div class='fp-nav clearfix'>
<span class='fp-pager'/>               
<a class='fp-next' href='#fp-next'/>
<a class='fp-prev' href='#fp-prev'/>

Make these changes:
  • Replace ADD POST URL-1, 2, 3, 4, 5 HERE with the URL of your post pages one by one. These URLs will be added twice for each slide. Once for the image and second time for the Post title.
  • Replace ADD IMAGE-5 LINK HERE with the Image link of the Featured post. By default all images have width:580px; height:266px; You can edit the image size by editing the width and height in the CSS code shared in step#6. Make sure all your images must have same size
  • Replace WRITE POST TITLE HERE... with the title of your Post Page
  • Replace WRITE POST DESCRIPTION HERE with the Post Page description. You can write the first few lines of your post here and the readers can read the full post by clicking the title.
  • To Change the Overall size of the slider container then edit in step#6 the following two codes -> width:608px and height:400px
   9.   Save your template and you are done! Visit your blog and say Bingo! :>

Previous Versions:

You can also check the old versions here,
If you faced any problem implementing this tutorial then please do not hesitate to post your question. Would be a pleasure helping you. Have Fun! :>

If you don't want to get yourself into Serious Technical Trouble while editing your Blog Template then just sit back and relax and let us do the Job for you at a fairly reasonable cost. Submit your order details by Clicking Here »


We have Zero Tolerance to Spam. Chessy Comments and Comments with 'Links' will be deleted immediately upon our review.
  1. Hello,

    Gr8 one Mohammad, looking for such a slider from long time :) Thanks...

  2. There has to be an easier way right? Because every time I want to change a link I would have to go into edit html.
    I know I am complaining. Sorry.

  3. @Hetal

    My pleasure Hetal. Always welcomed :>


    Yeh HTML5 is the best alternative to FLASH.

    Brother unfortunately I am weak in programming else I would have created a programmed widget for it. But this is by far the easiest way to add a slider to blogger. :>

  4. Assalam Waalekum bhai
    very very thanks for it....!!!! I will use it on my small blog...

  5. There's a problem. I can't find these lines.
    My blog URL is : http://dark-hackerz.blogspot.com/
    Please help me..!!!!!! Thanks!!!!!!!

  6. @shahdab

    Search for this,
    <div id='headline'>

    paste the code above it. If it did not work then search for this,

    <div id='page'>

    and paste the code below it.

  7. @ Mohammad Mustafa Ahmedzai bhai
    Everything worked fine but after saving the template i get this error: " Your template could not be parsed as it is not well-formed. Please make sure all XML elements are closed properly.
    XML error message: The element type "img" must be terminated by the matching end-tag "". " Wat to do then???????

  8. @Shadab

    I have updated the code. Please check now.

  9. hi mohammad i can't find main wrapper in my HTML .

  10. @Mosti
    Find this,
    <div class='column-center-inner'>

  11. I like this slider very much. It is very impressive. But is it possible to make it work by adding the third part of the code wherever we want (i.e. as a widget or inside to a post as part of it) instead of below the div id='main-wrapper' label?

  12. @John

    Code in step number 8 can be added anywhere you like even the HTML/Javascript widget. YOu just need to adjust the width and height of the container

  13. @Mohammad Mustafa Ahmedzai
    Yes, you are absolutely right. I just did confused with the first two lines of code. Now it's clear. Thank you for your help.

  14. not working ........did same as u said ,,,,,,,,try this @ http://lovejasica.blogspot.com/p/image-slider.html

  15. Inspite of placing the correct image urls, the images are not showing. How do I rectify this?
    My blog is- http://www.ultimatepotentialblog.com

  16. @john
    No problem sir. Always welcomed :>

    Its all about plug and play. I did visit your website but could not find the codes in it. Did you added all codes?

    Where have you saved your images? If it is photobucket or imagehack or anyother service then kindly store it at blogger by reading this tutorial,

  17. I am having difficulty finding this in my templet div id='main-wrapper' could you guid me on where to look or any other code, using the new blogspot templet, also is there a way to embed more than one jquiry slider on same page.
    my blog http://www.realestatesnatch.blogspot.com

  18. @Anony

    I will suggest that you add just one slider keeping blog load speed in mind.

    Please search for this code in your template:

    <div class='column-center-inner'>

  19. I'm brazilian and don't speak english well, so if there is something wrong with my english, I apologize.
    Hi, man! First of all, a great thanks for your tutorial.
    There is a way to make the letters of the title and text of the slider bigger?
    Can I make the slider appears in all pages of my blog (in all pages with specific posts)?
    In case you need to take a look at my blog, because of the template model that I use: http://sitedobigorna.blogspot.com/

    And again, thank you very much. I've tried to put a slider in my blogger blog, which I made this year, and didn't find any tutorial that works, except this one!

  20. @Samir

    anytime friend.

    I am glad brother that you successfully installed the slider.

    1)To edit the title size kindly edit this part of the CSS code,

    .fp-title{color:#787878;font:bold 14px Arial, Helvetica, Sans-serif;padding:0 0 4px 0;margin:0; text-transform:uppercase;}
    .fp-title a{color:#000;text-decoration:none;}
    .fp-title a:hover{color:#0080fF;text-decoration:none;}

    To increase the font size increase 14px
    To change the title color change #000
    To change the title mouse hover color change #0080ff

    You can use our color Generator tool for doing this.

    To change the description or text of the slider bigger edit this code,

    .fp-post p{color:#504D4D;padding:0;margin:0;font:10px Arial,Helvetica,Sans-serif;height:32px;overflow:hidden;}

    To make it bigger increase 10px

    Hope this helps. :>

    PS: Your English is just perfect!

    1. I have tried all the versions of your slider code but none worked.....
      edited all the codes and followed all the steps , but what i got is just a black space in my blog....
      it might be helpful for others but i also wanna add it in my blog...
      please hel me out if you can....
      url:- https://realspiritscience.blogspot.in

      please, help me out if you can findthe problem....

  21. Hi! Thanks!
    Everything you told me worked perfect, except for the color of the title mouse hover; I inserted the same hex code that I put to the title and it didn't change its color (it still is orange). There is a way to fix this?
    And, thanks again, I guess you will go to Heaven for doing this without receiving money for it.

  22. @Gabriel

    this is because you have kept the title active and hover colours the same. I have created a clor combination for you. Just use the codes below without changing them in place of the code I sent earlier.

    .fp-title a{color:#2288BB;text-decoration:none;}
    .fp-title a:hover{color:#33AAFF;text-decoration:none;}

    Thanks for the kind comment.

  23. Hi! I would like to know is there a way to stop the slide effect or slow it down even more? Thanks!

  24. Hi, Mohammad! I didn't understand where should I put this code.


  25. @Funn
    Yes you can do that by adjusting the slide rate in the javascript. Inside the javascript find this timeout: 4000, and replace it with this timeout: 500,

    You should add it in the CSS code mentioned in step#6
    You will find these lines at line number 11 and 12

  26. this is my adres a problem on iquery 7 point please code

  27. Hi!
    I replaced the codes that were at lines 11 and 12 by the codes you sent me; it still didn't work. I've got the title in blue, but the hover is still in orange (I wish to put it in blue too).


  28. This comment has been removed by the author.

  29. i cant find 2nd line in my template can you help me pleaee
    my blog is this wwww.cricketsupernews.blogspot.com

  30. hello..i have a problem where i cant find the code in no.7
    my blog is: http://mzsite.blogspot.com/

    i hope u can solve my problem..thanks a lot!

  31. I was waiting for this slider for some time :)

    But now I have problems installing on my blog. I have a test blog here: http://nova-templ.blogspot.com/

    As you can see I changed some sizes and now the "next/prev" buttons are hidden and I can't make them appear.

    Also the dots are more than the images, I only have 4 but the dots are 6, and if we click them they act strange :S

    Hope you understand my problem and can help me !

    Thanks Mohammad

  32. @Batistuta

    Find this code in your template and paste the slideshow code juts below it.

    <div class='column-center-inner'>

    Then your template needs thorough code scan. You will have to ask your designer which code is overriding the slideshows code. I do it at premier basis only.

    Please mention the step#?

    Please find this code and paste the slideshow code juts below it,
    <div class='column-center-inner'>

    This is because you have added 4 images but the slideshow contains 6 Div sections. Please remove an un-used code like this one twice,

    <div class='fp-post'>
    <div class='fp-thumbnail'><a href='ADD POST URL-5 HERE'><img src='ADD IMAGE-5 LINK HERE'/></a></div>
    <h3 class='fp-title'><a href='ADD POST URL-5 HERE'>WRITE POST TITLE HERE...</a></h3> <p> WRITE POST DESCRIPTION HERE... </p>

    For those Next/previous buttons kindly adjust the height of the container.

    You can try this all in MBT HTML Editor

  33. Mohammad-- Thanks again for this. I think this is the best slider I've seen. Great work. Question - how do I change the borders for a uniform look. If you go to my site, you'll see what I'm referring to. Thanks


  34. Mohammad, this is not my first jQuery installation, so I already deleted the div that wasn't necessary.

    But as I understand now is that this happens when I add the set 8 code as html/widget on page elements!

    But I can't paste it directly on the HTML editor because I get the error that some div is not closed :S

    I want to put the slyder on div id='meio-wrapper' and here is my test blog http://nova-templ.blogspot.com/

    Please help me, I really like this slide and want it to run on my blog :)

  35. @MS Maria
    To change the border thickness or color edit these lines,

    .fp-thumbnail{border:3px solid #dddddd; width:580px;height:266px;margin-bottom:10px;overflow:hidden;}
    .fp-thumbnail:hover{border:3px solid #CAC9C9; width:580px;height:266px;margin-bottom:10px;overflow:hidden;}

    The first border is for active mode and the second for Mouse hover. Hope this helps :>

    Oh man of course you should not add it to HTML/JavaScript widget. The Slideshow uses Jquery effect which works perfect only when the code is added inside the template. I viewed your template. You need to add the slideshow below this code,

    <div id='main-wrapper'>

  36. http://allmytutorials.blogspot.com/

    plzz help me i cant find wrapper in this too :( (and i m also nt able to find content wrapped in multi tab widget and waiting for ur reply there ).

  37. This comment has been removed by the author.

  38. Looks like I can't use it on my blog, my intention was to put it on "div id='meio-wrapper'" but if we can't use it on page elements ther's no way to do it


  39. aslam o alaykum
    this is my blog http://sadeestyleblog.blogspot.com/ slider is installed but the problem is i cant see the arrows on my slider donno where i have done mistake :S http://i56.tinypic.com/8wmyo3.png

  40. hi brother. thanks for the great tutorial. but im having problem embedding this code to my blogspot static page.

    please refer:


  41. I cant find the wrapper. here is my blog ( http://photoshopph.blogspot.com/ ) And Can i request ? If you visit my blog, you can see a facebook like box on the homepage. I want to replace it by the slideshow. Can i do it ? Thanks.

  42. Can you message me for the answer on my facebook ? facebook.com/ManuelGarciaPH because i wont notice if you reply here. IM always using my facebook account thanks. I almost visited all of your tutorials. Maybe 10 more. hehe

  43. Hello, I am pretty confused myself. Have been trying to edit the width of my blog, but all the tips use 'main-wrapper' etc. and that code just does not exist in my HTML! I would really appreciate it if you could have a look and let me know what I need to change.


  44. @Manuel

    Instead of searching for that main-wrapper code search for this code,
    <div id='content'>
    Paste your Slideshow code just below it.

    Yes you can remove your LikeBox by finding and deleting the like box code. This post will help you remove it ->


    If you needed more help let me know pal.


    No problem pal. Instead search for this code,

    <div class="date-outer">

    and paste the slide show code just below it.

    There is a shortcut also
    You can directly add the Slideshow code in step#8 to a HTML/JavaScript Widget.

  45. Can't find the line you mentioned....

    Blog: http://www.xiaolinsblog.blogspot.com/

    Thanks in Advance

  46. hii bro .... i ve used ur above slider n it seems 2 work fine , the only problem i have is adjusting the width i have tried on many width parameters to get a perfect view (since i have set a smaller area where i put my post u can chk it @ www.vellapen.blogspot.com ) , now the major problem is

    1) each time on hovering the mouse ..the frame width inc too much on d right side
    2)sumhow i just cant fit d image in a proper ratio with the frame

    otherwise i think everything is working great ... thnx n hoping for a reply as early as possible ... thnx bro :)

  47. http://thousandnews.blogspot.com

  48. Mohammad, how does one go about making the slide show, any slide show, show on the home page only? Thank you for your time.

  49. hello,this is abdul wahab khan from india,i have jsut put the slider u shown in this post i have done everything rigt but i want to adjust the size of my slider please let me know and this is my website www.hadsonimpex.com please have a look and let me what more changes i have to do please its a request and u can send mail to me if you do't mind thanxs a lot

  50. this is my url
    I have the 7th step problem

  51. Assalamu'alaikum Mohammad.

    Nice to know you. :)

    Hey i already installed the jquery, and I'm happy coz it worked! :)

    But there's is some question related to the jquery:
    1. How to make the image slider ONLY displayed on hompage/mainpage?
    Yes, it's not appear on post page, but it did appear on LABEL page. Take a look for example:


    2. Is there's a way to change the 'DOTS' & 'ARROW' color (active-nonactive)? What codes should I change to make this happen?

    THX for your answer Mohammad. Sorry for my bad english.
    Oh btw, Happy Fasting!

  52. i was not able to fine this"<div id='content-wrapper'>
    please help me

  53. Assalam o Alaikum.. Mohammad Mustafa bhai
    i have made a blog related to wallpapers ..
    but first of all i want to add a slider just like you made..
    but is there any way that i can use this slider in any post in want..? i dont want to add it in that section where it appears..
    thanx and Happy Ramadan

  54. Great look a tis in my Blog:

  55. Brother, do we have to edit in EDIT HTML each time to change the contents in the slider?

  56. This comment has been removed by the author.

  57. oops., there is an error after I install. in my blog there is no button"orange" to push next slide.


  58. This comment has been removed by the author.

  59. @ihsanhow did i resolve this.,

    just look at http://ihsansaidi.blogspot.com/

    thanks soo much..

  60. This one is not a demo one. Can I get the code for the actual demo kind of slideshow..

  61. This comment has been removed by the author.

  62. hi. huge problem. downloaded a custom template with the jquery slideshow for my blog. unfortunately the code seems to be broken - the slide on works properly after you go and click on "older posts" 3 times. it basically does not work on the home itself, you need to go back and back before it works. basically my "next/prev" slide option does not work. help please!
    btw, i posted my entire code to a friends blog and it works fine. it just does not seem to work on my site.

  63. This comment has been removed by the author.

  64. Assalam
    Not working on My Blog
    Sometimes it just works then stops have a look at here

  65. could i change the color of the orange ball below?

  66. I got the rest but photo was not displayed

  67. i have successfully incorporated the slider but somehow the images won't show up. i have made sure the image links are correct. will try again.

  68. Assalamuallaikum
    i can't find <div id='main-wrapper... code please help
    THX :)

  69. Thank you for the excellent tips! works perfect everytime--except I have trouble with the slideshow:-!cant seem to find the div- wrapper but love your blog!Keep up the fantastic work!

  70. This comment has been removed by the author.

  71. Hi.
    Brother I follow your instruction . But did not Work it in my blog.
    But I need this . Please help me. What can i do?
    My Blog: sportsitnet.tk

  72. Hi
    Thanks for a great gadget !
    But I want to display small post thumnail images instead of the dots as navigation. Is it possible? And how to do it?
    Thanks a lot !

  73. Hi Mohammed,
    Thanks for this great widget. I really like it but I'm having a
    problem with the images and the source of them because they are not showing in the content slider. Even if this is an image from the post on blogger, it won't appear in the content slider. What should I do?


  74. my blog url is techdarbar.blogspot.com and i am unale to find the main-wrapper part.

  75. Mr Mohammed, nice work you done here, it's really helpful, keep the flag rolling.

  76. really great job you've done by mistake my blog slider was deleted and after i followed your instructions so now i feel that this is better then my old one ... thumbs up !!

  77. CAn u help

    Blog - gamezone-kunal.blogspot.com

    thx in advance

  78. aslam meri site ye ha webfg.blogspot.com muj se ye lines find ni horhi ha

  79. hey there.
    Great work you are doing dude.
    I have this one query. I want to use your code for multiple sliders on a single page in my blog.That means I want to instantiate more than one such Image sliders on a static page.
    Please let me know how to do it.


  80. How do i make this slider appear on my home page alone???

  81. This comment has been removed by the author.

  82. This comment has been removed by the author.

  83. i have inserted the slider here http://testblog1150.blogspot.com/
    i want to know that is there any way to add more than four posts

  84. hi mohammad can you just help me that i followed every steps to install this slider. but only showing 1 post & its not sliding.my side address is www.4ddigital.co.cc/

  85. How do i remove a slide on the slider?

  86. Hi there - I had a problem finding the main-wrapper code. My blog url is http://furyvw.blogspot.com.

  87. @timslatter.com

    Your blog is not open for public so just not able to help you.

  88. @timslatter.com
    Try finding this:

    <div class='main-outer'>
    <div class='main-cap-top cap-top'>

    Paste the code below it.

  89. Hello Mohamed,
    I have a Brazilian blog where I teach several features to the blogger.
    I would like to translate some of your posts on my blog to teach bloggers in my country to make your blog more fun.
    Allows you to translate and teach in my blog that teaches the resources here?
    I will always citing the source.
    Thank you,


  90. I have a slider installed at http://www.indian-share-tips.com/ and I want to block slider slides from appearing in specific pages. My code is installed in template. Please tell me how to do it. Thanx for your awesome tutorials. Regards

  91. Hi There!

    It's almost perfect! I have added it to my homepage on blogger.
    But it also shows up in labelled pages/categories. Is there anything I can do to the code to fix that?

    Otherwise, it is perfect!

    This is what I am talking about: http://guiltlust.blogspot.com/search/label/fragrance

    THANKS!!! :D

  92. This comment has been removed by the author.

  93. Nice blog bro...

    thx for tutor

  94. Hi Mohammad. I've followed the steps and it turned out so good like what i want. Thanks a lot for that. But I have a few problems. Is it possible to align the pictures to center? As my pic size are different from each other. Please reply me ASAP. I really need your guidance. TQ

    My Blog : http://bigbanglovers-only.blogspot.com

  95. very cool master..
    I like it

  96. This is awesome! but what if i want the slider to only appear on one specific static page?

  97. @Mohammad Mustafa Ahmedzai : excuse me mohammad, please help me, how to all slides show on all pages, not only in home.

  98. Hi! I`m having problems with the images size. Is there a way to add images without the URL image? Here's what it looks like now:

  99. Hi,
    is it possible to put the slideshow under the links and title?
    Our blog: 6rexperimental.blogspot.com

  100. hi Mohammed the image slider is not working in Chrome...can u plz help...my site www.techalert.in i need to solve this urgently..

  101. It looks like I might not get an answer on this, lots of UN-answered questions, here!

    I got it to work... but it seems to show the top frame twice, once in the right place, as a boarder to the slider and the second, after the widget. Did I do something wrong?


    Thanks, I hope to be able to fix this - other than having to update the code in the template (some sliders do it in a widget) this is the nicest slider I've seen so I'd love to get it working!



  102. This is really useful for blogs , I will consider this for blog creation.

  103. Hi, great tutorial, really need this one.
    I have a question: Is it possible to show slider in every post or page?


  104. nice tips. i really like your post. thanks.

  105. Hi

    I am having trouble with finding the following code:
    <div id='main-wrapper'>

    Please help.

    My url is http://crackeduniverse.blogspot.com

  106. assalamo alaykom,,brod mohammad,i need your help i didn't find this code ]]> to my blog,my account is from weebly.com,,,this my site url...www.pfcofwloveradio.com hope u can help me to solve my problem,,,,shukran brother mohammad.

  107. this is the code what i mean brod mohammad,]]></b:skin> i didnot see it inside the template html of blog,,,www.pfcofwloveradio.com my account from weebly.com,,,hope you can help me,,shukran

  108. www.all4masti.com/p/chat-room.html
    Chat Rooms, Best Pakistani Girls Chat Rooms, Best Indian Girls Chat Rooms, Chat With Pakistani Girls And Boys, Chat With Indian Girls And Boys.

  109. please help me
    how to use multiple jquery function on single Jquery.min.js
    please help me

  110. hi,
    thanks for your brilliant slider.
    the images slide are left; how do i center them?
    where do i change the code to center the images?
    thank you

  111. I cannot find div id='main-wrapper'. My blog url is soumyacyberworld.blogspot.com

  112. Amazing. . thank you very much. Had been looking for this since long time.

  113. Hello,
    I am starting to make my first move in making my dreams come true. I am making this blog but I can not complete the process I can find the div id 'main-wrapper' code in my blog. As mentioned above I'll just put my blog here.

    Please help me.

    This blog is always my best resource.

    Best Regards,

  114. Hello, I am working on adding this slider to a blog: http://e-morgaine.blogspot.com and the slides do not change... how do I fix it?

  115. This comment has been removed by the author.

  116. Mohammad, Very nice tutorial. But I Can't find this code on my template. <div id='main-wrapper'> Please help me to find it. really need this slideshow for my blog. http://kristianoblog.blogspot.com/

    Thank you so much. I'll wait for your reply.

  117. i can not find the code

    my website is http://qazihabib.blogspot.com/

  118. hi,

    Please help me..something went wrong..only the caption appear but no pictures.


    Thank you in advance.

  119. www.padakantilakshmikantham.blogspot.com

    pls help me to keep sldeshow

    advance tqu :)

  120. what does this error mean?

    Error parsing XML, line 1140, column 127: The value of attribute "href" associated with an element type "null" must not contain the '<' character.

  121. Seems I need help as my template differs. My blog is http://www.ncooltips.com/

    Thanks in advance. I really enjoy your articles at no cost.

  122. Perfect, it worked in chrome, but not in IE. seems something is wrong. but not sure where it is ?

    anyways, once again thanks from http://www.ncooltips.com/

  123. Thank you for this code. Still loading the pics, but so far it works beautifully.

  124. Hi Mohammad Mustafa Ahmedzai,

    I can't find the main wrapper, tried your other suggestions as well. Please help? :(

    Thank you.

  125. I got stuck on step 7 because my html didn't have that tag.

    My url is alllovebooks.com/

  126. hi, thanks for answering most of queries, updating above i am getting below error message, just for information i hv saved it without replacing url being short of time. ls advice
    Error parsing XML, line 4, column 82: The reference to entity "d" must end with the ';' delimiter.