Birthday

July 14, 2012 is TipRicks's Birthday, Please Prepare and Send Good Wishes to its team!

UnderStood
TipRicks is under maintenance! If you found any error please let us know. Contact Us ×

Hello!

Click one of our representatives below to chat on WhatsApp

Support Customer Service Center
+923084774257
You can also send us an email to support@tipricks.com
Hello! What can I do for you?
×
How can I help you?

Add a Responsive Testimonial Slider in Your Blog/Website

SHARE:

A Simple Responsive and Eye Catching Testimonial Slider for a Blogger Blog or Website.

Today after a long time I am going to share a new responsive testimonial slider with you guys with lots of love. Most of the websites add this widget to show their new readers or customers that what people says about them or about their products. So that the new customers can imagine about theires services they are god for them or not.

Features

  • Responsive Design
  • Auto Slider
  • Slide Buttons
  • SEO Friendly
  • Eye catching Colors
  • Fully Customizeable
  • Support all browsers: Firefox, Chrome, IE, Safari etc.

How to Add this to Your Blog?

   1. First of all go to to your blogger blog dashboard.
   2. Then choose the blog in which you want to add this widget.
   3. Goto theme, edit HTML and search for </head> tag by pressing Ctrl+F.
   4. Then paste the below code after the </head> tag.
    [<script type='text/javascript'>
            //<![CDATA[
            $(document).ready(function() {
              // BxSlider
              $(window).load(function() {
                $('.flexslider').flexslider({
                  pauseOnHover: true,
                  controlNav: false,
                  prevText: '<i class="fa fa-chevron-left"></i>',
                  nextText: '<i class="fa fa-chevron-right"></i>',
                });
              });
            });
            //]]>
    </script>]

       5. Now search for ]]></b:skin> and paste the below code just above this tag.

    [/* Section Testimonials by TipRicks
    ----------------------------------------------- */
    #section-testimonials {
    height: 350px;
    overflow: hidden;
    position: relative;
    }
    #section-testimonials .slides {
    margin: 0;
    padding: 0;
    list-style: outside none none;
    display: block;
    width: 100%;
    height: 350px;
    overflow: hidden;
    }
    #section-testimonials .slides li {
    padding: 0;
    margin: 0;
    display: block;
    width: 100%;
    height: 350px;
    }
    .left-testi, .right-testi {
    width: 50%;
    height: 100%;
    display: block;
    float: left;
    position: relative;
    }
    .right-testi {
    float: right;
    }
    .left-testi {
    background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiMRxQd9Z2tyofq1ZmilWJIrbZRbr1SXLcogjSuBbaURLpSIIp2pzTLHvcc8h8dxYAVe9BPctjY8KyhnA5qSX7v_RELGEjzYabupUhNtjnVYE4P8ViwuRK5ZGBbg2oHd-moda9t6tOJVLpm/s1600/bg.png);
    }
    .left-testi p {
    color: #FFF;
    text-align: center;
    font-weight: 400;
    font-size: 1.5em;
    padding: 51px 80px;
    }
    .bar {
    display: block;
    margin: 40px auto 30px;
    width: 80px;
    height: 4px;
    background-color: #fff;
    }
    .testi-1 .left-testi {
    background-color: #FF5500;
    }
    .testi-1 .right-testi {
    background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgbdgSocxR8ewnFeYO_7GiR5s8uTNzOALkobBBksbV24QUFvarEALl71C7Z91WXYP8mnAO93zEohWHslQhGcQHpCHK9o6eIWrH7jvUGMdrqv0-7xI8w0bLKdX4m8zpqe5qo_OTbDqL_tuqh/s1600/ar-themes_1.jpg);
    }
    .testi-2 .left-testi {
    background-color: #1E8AD2;
    }
    .testi-2 .right-testi {
    background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEht8e3BrxUWA1JOu5MeZIeSnlfJBij9YHtKI2NawpETsgxfYsAOmFI7Uwc4NGrpjJ22qmT-Wskf3NtwIawECl8QRsfX36Rc9CYIzeqykHcOZ-0WiPJTYMIakawBZy8HIwaLtJTfID4Oawhp/s1600/ar-themes_2.jpg);
    }
    .testi-3 .left-testi {
    background-color: #198C58;
    }
    .testi-3 .right-testi {
    background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiISPr6feM3A8ACq3pIE5Zs5J0PcAXzc-I-jxgptUAW_s158g4XgdCOEK7NmZKTR4yvMhg_JXUoAXPxyyee2d4xOHT2nW0J1-6asvhnxzB8Ys2FxetpVrKARBF8a3hg1GDs9Dh04Gx4UczP/s1600/ar-themes_3.jpg);
    }
    .right-testi img {
    height: 150px;
    width: 150px;
    border-radius: 100%;
    padding: 5px;
    background-color: #444;
    box-shadow: 0 0 2px #000;
    vertical-align: middle;
    display: block;
    margin: 60px auto 10px;
    position: relative;
    z-index: 3;
    }
    .right-testi span {
    color: #fff;
    text-align: center;
    display: block;
    margin: 20px 0;
    font-size: 3em;
    text-shadow: 0 0 2px #000;
    position: relative;
    z-index: 3;
    }
    .flex-direction-nav {
    list-style: none outside none;
    padding: 0;
    margin: 0;
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    display: block;
    }
    .flex-direction-nav a {
    height: 50px;
    display: block;
    width: 50px;
    left: 30px;
    top: 165px;
    position: absolute;
    text-align: center;
    line-height: 50px;
    background-color: rgba(68, 68, 68, 0.53);
    opacity: 0;
    visibility: hidden;
    font-size: 2em;
    border-radius: 2px;
    padding-right: 5px;
    z-index: 3;
    -webkit-transition: all 0.4s ease 0s;
    -moz-transition: all 0.4s ease 0s;
    -o-transition: all 0.4s ease 0s;
    transition: all 0.4s ease 0s;
    }
    .flex-direction-nav .flex-next {
    right: 30px;
    left: auto;
    padding-right: 0;
    padding-left: 5px;
    }
    #section-testimonials:hover .flex-direction-nav a {
    opacity: 1;
    visibility: visible;
    }
    .flex-direction-nav a:hover {
    background-color: #1e8ad2;
    color: #fff;
    }
    @media screen and (max-width:960px) {
    #section-testimonials{display:none!important}
    }]

       6. Then Add the piece of code where you want to show your Slider, generally it is added just above the <footer> tag.

    [<div class='flexslider' id='section-testimonials'>
    <ul class='slides'>
    <li class='testi-1 clearfix'>
    <div class='left-testi'>
    <p>
                      &#8220; Thank you man! I was hoping that i will wait for a day.. This is really helpful. Recommended to everyone. &#8221;
                      <span class='bar'/>
                      - Muhammad Tahir Habib
                    </p>
    </div>
    <div class='right-testi'>
    <img alt='wigwamwigwam testimonial' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjOKeEu8HfgJ8iEo7gWaSZJYVcNpo_GZCM26e4xT8XlcfMkJHPJEWhsmS11THNS6zLynlLx2zJV8Ucc4B6spU3dn6Mag32vxpLC6ly58VtddUxATQlIdDjSmYd40AZ1NPyS0gUUbVjZoK91/s1600/wigwamwigwam+.jpg'/><span>Nikkolai Fernadnez</span><div class='oveload'/>
    </div>
    </li>
    <li class='testi-2 clearfix'>
    <div class='left-testi'>
    <p>
                      &#8220; Great work, Very professional and developed a good template, 5 Stars Recommended &#8221;
                      <span class='bar'/>
                      - Adeel Ahmad
                    </p>
    </div>
    <div class='right-testi'>
    <img alt='amceo testimonial' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiYUy9BjcqhLSv6hSKMVPa7hWRZdVOXTx4L3nkUqyf_SxLC4dsVPGQozvVS2O-eIY0T8R3j1bio0cTA-1bOdTQNCPxR5VlP7uT3Non-tFHqquvtqKaHDpLajNu_hEeZuvBL9S9zK86Pzie8/s1600/amceo.jpg'/><span>Amceo</span><div class='oveload'/>
    </div>
    </li>
    <li class='testi-3 clearfix'>
    <div class='left-testi'>
    <p>
                      &#8220; One of the perfect work i have received well documented with perfect timings, Recommended to everyone &#8221;
                      <span class='bar'/>
                      - Muhammad Waqar Aslam
                    </p>
    </div>
    <div class='right-testi'>
    <img alt='mohmmr testimonial' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEieO5hahgj29zYyzt1pAMl9O5yDKKA2Mra2jqN23q9O35IEOKT-h6s35iYw8DIa_xuPE-J9lUKL0jpoZ9Xtlc1ieKwyuffvTenKz06M6WrF7_kIAaQ1pgABLbAJoxUje2Ol5uZvyZ_B6it3/s1600/12417947_1552251291760430_3273097279744412486_n.jpg'/><span>Muhammad Waqar Aslam</span><div class='oveload'/>
    </div>
    </li>
    </ul>
    </div>]

       7. Then add the following script before </body> tag.

    [<!--================================== Testimonial Widget Script ==================================-->
    <script async='' type='text/javascript'>
            //<![CDATA[
            /*
     * jQuery FlexSlider v2.4.0
     * tipricks.blogspot.com
     * Author: Muhammad Tahir Habib
     * TipRicks Inc.
     * Copyright 2017
     */!function($){$.flexslider=function(e,t){var a=$(e);a.vars=$.extend({},$.flexslider.defaults,t);var n=a.vars.namespace,i=window.navigator&&window.navigator.msPointerEnabled&&window.MSGesture,s=("ontouchstart"in window||i||window.DocumentTouch&&document instanceof DocumentTouch)&&a.vars.touch,r="click touchend MSPointerUp keyup",o="",l,c="vertical"===a.vars.direction,d=a.vars.reverse,u=a.vars.itemWidth>0,v="fade"===a.vars.animation,p=""!==a.vars.asNavFor,m={},f=!0;$.data(e,"flexslider",a),m={init:function(){a.animating=!1,a.currentSlide=parseInt(a.vars.startAt?a.vars.startAt:0,10),isNaN(a.currentSlide)&&(a.currentSlide=0),a.animatingTo=a.currentSlide,a.atEnd=0===a.currentSlide||a.currentSlide===a.last,a.containerSelector=a.vars.selector.substr(0,a.vars.selector.search(" ")),a.slides=$(a.vars.selector,a),a.container=$(a.containerSelector,a),a.count=a.slides.length,a.syncExists=$(a.vars.sync).length>0,"slide"===a.vars.animation&&(a.vars.animation="swing"),a.prop=c?"top":"marginLeft",a.args={},a.manualPause=!1,a.stopped=!1,a.started=!1,a.startTimeout=null,a.transitions=!a.vars.video&&!v&&a.vars.useCSS&&function(){var e=document.createElement("div"),t=["perspectiveProperty","WebkitPerspective","MozPerspective","OPerspective","msPerspective"];for(var n in t)if(void 0!==e.style[t[n]])return a.pfx=t[n].replace("Perspective","").toLowerCase(),a.prop="-"+a.pfx+"-transform",!0;return!1}(),a.ensureAnimationEnd="",""!==a.vars.controlsContainer&&(a.controlsContainer=$(a.vars.controlsContainer).length>0&&$(a.vars.controlsContainer)),""!==a.vars.manualControls&&(a.manualControls=$(a.vars.manualControls).length>0&&$(a.vars.manualControls)),a.vars.randomize&&(a.slides.sort(function(){return Math.round(Math.random())-.5}),a.container.empty().append(a.slides)),a.doMath(),a.setup("init"),a.vars.controlNav&&m.controlNav.setup(),a.vars.directionNav&&m.directionNav.setup(),a.vars.keyboard&&(1===$(a.containerSelector).length||a.vars.multipleKeyboard)&&$(document).bind("keyup",function(e){var t=e.keyCode;if(!a.animating&&(39===t||37===t)){var n=39===t?a.getTarget("next"):37===t?a.getTarget("prev"):!1;a.flexAnimate(n,a.vars.pauseOnAction)}}),a.vars.mousewheel&&a.bind("mousewheel",function(e,t,n,i){e.preventDefault();var s=a.getTarget(0>t?"next":"prev");a.flexAnimate(s,a.vars.pauseOnAction)}),a.vars.pausePlay&&m.pausePlay.setup(),a.vars.slideshow&&a.vars.pauseInvisible&&m.pauseInvisible.init(),a.vars.slideshow&&(a.vars.pauseOnHover&&a.hover(function(){a.manualPlay||a.manualPause||a.pause()},function(){a.manualPause||a.manualPlay||a.stopped||a.play()}),a.vars.pauseInvisible&&m.pauseInvisible.isHidden()||(a.vars.initDelay>0?a.startTimeout=setTimeout(a.play,a.vars.initDelay):a.play())),p&&m.asNav.setup(),s&&a.vars.touch&&m.touch(),(!v||v&&a.vars.smoothHeight)&&$(window).bind("resize orientationchange focus",m.resize),a.find("img").attr("draggable","false"),setTimeout(function(){a.vars.start(a)},200)},asNav:{setup:function(){a.asNav=!0,a.animatingTo=Math.floor(a.currentSlide/a.move),a.currentItem=a.currentSlide,a.slides.removeClass(n+"active-slide").eq(a.currentItem).addClass(n+"active-slide"),i?(e._slider=a,a.slides.each(function(){var e=this;e._gesture=new MSGesture,e._gesture.target=e,e.addEventListener("MSPointerDown",function(e){e.preventDefault(),e.currentTarget._gesture&&e.currentTarget._gesture.addPointer(e.pointerId)},!1),e.addEventListener("MSGestureTap",function(e){e.preventDefault();var t=$(this),n=t.index();$(a.vars.asNavFor).data("flexslider").animating||t.hasClass("active")||(a.direction=a.currentItem<n?"next":"prev",a.flexAnimate(n,a.vars.pauseOnAction,!1,!0,!0))})})):a.slides.on(r,function(e){e.preventDefault();var t=$(this),i=t.index(),s=t.offset().left-$(a).scrollLeft();0>=s&&t.hasClass(n+"active-slide")?a.flexAnimate(a.getTarget("prev"),!0):$(a.vars.asNavFor).data("flexslider").animating||t.hasClass(n+"active-slide")||(a.direction=a.currentItem<i?"next":"prev",a.flexAnimate(i,a.vars.pauseOnAction,!1,!0,!0))})}},controlNav:{setup:function(){a.manualControls?m.controlNav.setupManual():m.controlNav.setupPaging()},setupPaging:function(){var e="thumbnails"===a.vars.controlNav?"control-thumbs":"control-paging",t=1,i,s;if(a.controlNavScaffold=$('<ol class="'+n+"control-nav "+n+e+'"></ol>'),a.pagingCount>1)for(var l=0;l<a.pagingCount;l++){if(s=a.slides.eq(l),i="thumbnails"===a.vars.controlNav?'<img src="'+s.attr("data-thumb")+'"/>':"<a>"+t+"</a>","thumbnails"===a.vars.controlNav&&!0===a.vars.thumbCaptions){var c=s.attr("data-thumbcaption");""!=c&&void 0!=c&&(i+='<span class="'+n+'caption">'+c+"</span>")}a.controlNavScaffold.append("<li>"+i+"</li>"),t++}a.controlsContainer?$(a.controlsContainer).append(a.controlNavScaffold):a.append(a.controlNavScaffold),m.controlNav.set(),m.controlNav.active(),a.controlNavScaffold.delegate("a, img",r,function(e){if(e.preventDefault(),""===o||o===e.type){var t=$(this),i=a.controlNav.index(t);t.hasClass(n+"active")||(a.direction=i>a.currentSlide?"next":"prev",a.flexAnimate(i,a.vars.pauseOnAction))}""===o&&(o=e.type),m.setToClearWatchedEvent()})},setupManual:function(){a.controlNav=a.manualControls,m.controlNav.active(),a.controlNav.bind(r,function(e){if(e.preventDefault(),""===o||o===e.type){var t=$(this),i=a.controlNav.index(t);t.hasClass(n+"active")||(a.direction=i>a.currentSlide?"next":"prev",a.flexAnimate(i,a.vars.pauseOnAction))}""===o&&(o=e.type),m.setToClearWatchedEvent()})},set:function(){var e="thumbnails"===a.vars.controlNav?"img":"a";a.controlNav=$("."+n+"control-nav li "+e,a.controlsContainer?a.controlsContainer:a)},active:function(){a.controlNav.removeClass(n+"active").eq(a.animatingTo).addClass(n+"active")},update:function(e,t){a.pagingCount>1&&"add"===e?a.controlNavScaffold.append($("<li><a>"+a.count+"</a></li>")):1===a.pagingCount?a.controlNavScaffold.find("li").remove():a.controlNav.eq(t).closest("li").remove(),m.controlNav.set(),a.pagingCount>1&&a.pagingCount!==a.controlNav.length?a.update(t,e):m.controlNav.active()}},directionNav:{setup:function(){var e=$('<ul class="'+n+'direction-nav"><li class="'+n+'nav-prev"><a class="'+n+'prev" href="#">'+a.vars.prevText+'</a></li><li class="'+n+'nav-next"><a class="'+n+'next" href="#">'+a.vars.nextText+"</a></li></ul>");a.controlsContainer?($(a.controlsContainer).append(e),a.directionNav=$("."+n+"direction-nav li a",a.controlsContainer)):(a.append(e),a.directionNav=$("."+n+"direction-nav li a",a)),m.directionNav.update(),a.directionNav.bind(r,function(e){e.preventDefault();var t;(""===o||o===e.type)&&(t=a.getTarget($(this).hasClass(n+"next")?"next":"prev"),a.flexAnimate(t,a.vars.pauseOnAction)),""===o&&(o=e.type),m.setToClearWatchedEvent()})},update:function(){var e=n+"disabled";1===a.pagingCount?a.directionNav.addClass(e).attr("tabindex","-1"):a.vars.animationLoop?a.directionNav.removeClass(e).removeAttr("tabindex"):0===a.animatingTo?a.directionNav.removeClass(e).filter("."+n+"prev").addClass(e).attr("tabindex","-1"):a.animatingTo===a.last?a.directionNav.removeClass(e).filter("."+n+"next").addClass(e).attr("tabindex","-1"):a.directionNav.removeClass(e).removeAttr("tabindex")}},pausePlay:{setup:function(){var e=$('<div class="'+n+'pauseplay"><a></a></div>');a.controlsContainer?(a.controlsContainer.append(e),a.pausePlay=$("."+n+"pauseplay a",a.controlsContainer)):(a.append(e),a.pausePlay=$("."+n+"pauseplay a",a)),m.pausePlay.update(a.vars.slideshow?n+"pause":n+"play"),a.pausePlay.bind(r,function(e){e.preventDefault(),(""===o||o===e.type)&&($(this).hasClass(n+"pause")?(a.manualPause=!0,a.manualPlay=!1,a.pause()):(a.manualPause=!1,a.manualPlay=!0,a.play())),""===o&&(o=e.type),m.setToClearWatchedEvent()})},update:function(e){"play"===e?a.pausePlay.removeClass(n+"pause").addClass(n+"play").html(a.vars.playText):a.pausePlay.removeClass(n+"play").addClass(n+"pause").html(a.vars.pauseText)}},touch:function(){function t(t){a.animating?t.preventDefault():(window.navigator.msPointerEnabled||1===t.touches.length)&&(a.pause(),g=c?a.h:a.w,S=Number(new Date),x=t.touches[0].pageX,b=t.touches[0].pageY,f=u&&d&&a.animatingTo===a.last?0:u&&d?a.limit-(a.itemW+a.vars.itemMargin)*a.move*a.animatingTo:u&&a.currentSlide===a.last?a.limit:u?(a.itemW+a.vars.itemMargin)*a.move*a.currentSlide:d?(a.last-a.currentSlide+a.cloneOffset)*g:(a.currentSlide+a.cloneOffset)*g,p=c?b:x,m=c?x:b,e.addEventListener("touchmove",n,!1),e.addEventListener("touchend",s,!1))}function n(e){x=e.touches[0].pageX,b=e.touches[0].pageY,h=c?p-b:p-x,y=c?Math.abs(h)<Math.abs(x-m):Math.abs(h)<Math.abs(b-m);var t=500;(!y||Number(new Date)-S>t)&&(e.preventDefault(),!v&&a.transitions&&(a.vars.animationLoop||(h/=0===a.currentSlide&&0>h||a.currentSlide===a.last&&h>0?Math.abs(h)/g+2:1),a.setProps(f+h,"setTouch")))}function s(t){if(e.removeEventListener("touchmove",n,!1),a.animatingTo===a.currentSlide&&!y&&null!==h){var i=d?-h:h,r=a.getTarget(i>0?"next":"prev");a.canAdvance(r)&&(Number(new Date)-S<550&&Math.abs(i)>50||Math.abs(i)>g/2)?a.flexAnimate(r,a.vars.pauseOnAction):v||a.flexAnimate(a.currentSlide,a.vars.pauseOnAction,!0)}e.removeEventListener("touchend",s,!1),p=null,m=null,h=null,f=null}function r(t){t.stopPropagation(),a.animating?t.preventDefault():(a.pause(),e._gesture.addPointer(t.pointerId),w=0,g=c?a.h:a.w,S=Number(new Date),f=u&&d&&a.animatingTo===a.last?0:u&&d?a.limit-(a.itemW+a.vars.itemMargin)*a.move*a.animatingTo:u&&a.currentSlide===a.last?a.limit:u?(a.itemW+a.vars.itemMargin)*a.move*a.currentSlide:d?(a.last-a.currentSlide+a.cloneOffset)*g:(a.currentSlide+a.cloneOffset)*g)}function o(t){t.stopPropagation();var a=t.target._slider;if(a){var n=-t.translationX,i=-t.translationY;return w+=c?i:n,h=w,y=c?Math.abs(w)<Math.abs(-n):Math.abs(w)<Math.abs(-i),t.detail===t.MSGESTURE_FLAG_INERTIA?void setImmediate(function(){e._gesture.stop()}):void((!y||Number(new Date)-S>500)&&(t.preventDefault(),!v&&a.transitions&&(a.vars.animationLoop||(h=w/(0===a.currentSlide&&0>w||a.currentSlide===a.last&&w>0?Math.abs(w)/g+2:1)),a.setProps(f+h,"setTouch"))))}}function l(e){e.stopPropagation();var t=e.target._slider;if(t){if(t.animatingTo===t.currentSlide&&!y&&null!==h){var a=d?-h:h,n=t.getTarget(a>0?"next":"prev");t.canAdvance(n)&&(Number(new Date)-S<550&&Math.abs(a)>50||Math.abs(a)>g/2)?t.flexAnimate(n,t.vars.pauseOnAction):v||t.flexAnimate(t.currentSlide,t.vars.pauseOnAction,!0)}p=null,m=null,h=null,f=null,w=0}}var p,m,f,g,h,S,y=!1,x=0,b=0,w=0;i?(e.style.msTouchAction="none",e._gesture=new MSGesture,e._gesture.target=e,e.addEventListener("MSPointerDown",r,!1),e._slider=a,e.addEventListener("MSGestureChange",o,!1),e.addEventListener("MSGestureEnd",l,!1)):e.addEventListener("touchstart",t,!1)},resize:function(){!a.animating&&a.is(":visible")&&(u||a.doMath(),v?m.smoothHeight():u?(a.slides.width(a.computedW),a.update(a.pagingCount),a.setProps()):c?(a.viewport.height(a.h),a.setProps(a.h,"setTotal")):(a.vars.smoothHeight&&m.smoothHeight(),a.newSlides.width(a.computedW),a.setProps(a.computedW,"setTotal")))},smoothHeight:function(e){if(!c||v){var t=v?a:a.viewport;e?t.animate({height:a.slides.eq(a.animatingTo).height()},e):t.height(a.slides.eq(a.animatingTo).height())}},sync:function(e){var t=$(a.vars.sync).data("flexslider"),n=a.animatingTo;switch(e){case"animate":t.flexAnimate(n,a.vars.pauseOnAction,!1,!0);break;case"play":t.playing||t.asNav||t.play();break;case"pause":t.pause()}},uniqueID:function(e){return e.filter("[id]").add(e.find("[id]")).each(function(){var e=$(this);e.attr("id",e.attr("id")+"_clone")}),e},pauseInvisible:{visProp:null,init:function(){var e=m.pauseInvisible.getHiddenProp();if(e){var t=e.replace(/[H|h]idden/,"")+"visibilitychange";document.addEventListener(t,function(){m.pauseInvisible.isHidden()?a.startTimeout?clearTimeout(a.startTimeout):a.pause():a.started?a.play():a.vars.initDelay>0?setTimeout(a.play,a.vars.initDelay):a.play()})}},isHidden:function(){var e=m.pauseInvisible.getHiddenProp();return e?document[e]:!1},getHiddenProp:function(){var e=["webkit","moz","ms","o"];if("hidden"in document)return"hidden";for(var t=0;t<e.length;t++)if(e[t]+"Hidden"in document)return e[t]+"Hidden";return null}},setToClearWatchedEvent:function(){clearTimeout(l),l=setTimeout(function(){o=""},3e3)}},a.flexAnimate=function(e,t,i,r,o){if(a.vars.animationLoop||e===a.currentSlide||(a.direction=e>a.currentSlide?"next":"prev"),p&&1===a.pagingCount&&(a.direction=a.currentItem<e?"next":"prev"),!a.animating&&(a.canAdvance(e,o)||i)&&a.is(":visible")){if(p&&r){var l=$(a.vars.asNavFor).data("flexslider");if(a.atEnd=0===e||e===a.count-1,l.flexAnimate(e,!0,!1,!0,o),a.direction=a.currentItem<e?"next":"prev",l.direction=a.direction,Math.ceil((e+1)/a.visible)-1===a.currentSlide||0===e)return a.currentItem=e,a.slides.removeClass(n+"active-slide").eq(e).addClass(n+"active-slide"),!1;a.currentItem=e,a.slides.removeClass(n+"active-slide").eq(e).addClass(n+"active-slide"),e=Math.floor(e/a.visible)}if(a.animating=!0,a.animatingTo=e,t&&a.pause(),a.vars.before(a),a.syncExists&&!o&&m.sync("animate"),a.vars.controlNav&&m.controlNav.active(),u||a.slides.removeClass(n+"active-slide").eq(e).addClass(n+"active-slide"),a.atEnd=0===e||e===a.last,a.vars.directionNav&&m.directionNav.update(),e===a.last&&(a.vars.end(a),a.vars.animationLoop||a.pause()),v)s?(a.slides.eq(a.currentSlide).css({opacity:0,zIndex:1}),a.slides.eq(e).css({opacity:1,zIndex:2}),a.wrapup(f)):(a.slides.eq(a.currentSlide).css({zIndex:1}).animate({opacity:0},a.vars.animationSpeed,a.vars.easing),a.slides.eq(e).css({zIndex:2}).animate({opacity:1},a.vars.animationSpeed,a.vars.easing,a.wrapup));else{var f=c?a.slides.filter(":first").height():a.computedW,g,h,S;u?(g=a.vars.itemMargin,S=(a.itemW+g)*a.move*a.animatingTo,h=S>a.limit&&1!==a.visible?a.limit:S):h=0===a.currentSlide&&e===a.count-1&&a.vars.animationLoop&&"next"!==a.direction?d?(a.count+a.cloneOffset)*f:0:a.currentSlide===a.last&&0===e&&a.vars.animationLoop&&"prev"!==a.direction?d?0:(a.count+1)*f:d?(a.count-1-e+a.cloneOffset)*f:(e+a.cloneOffset)*f,a.setProps(h,"",a.vars.animationSpeed),a.transitions?(a.vars.animationLoop&&a.atEnd||(a.animating=!1,a.currentSlide=a.animatingTo),a.container.unbind("webkitTransitionEnd transitionend"),a.container.bind("webkitTransitionEnd transitionend",function(){clearTimeout(a.ensureAnimationEnd),a.wrapup(f)}),clearTimeout(a.ensureAnimationEnd),a.ensureAnimationEnd=setTimeout(function(){a.wrapup(f)},a.vars.animationSpeed+100)):a.container.animate(a.args,a.vars.animationSpeed,a.vars.easing,function(){a.wrapup(f)})}a.vars.smoothHeight&&m.smoothHeight(a.vars.animationSpeed)}},a.wrapup=function(e){v||u||(0===a.currentSlide&&a.animatingTo===a.last&&a.vars.animationLoop?a.setProps(e,"jumpEnd"):a.currentSlide===a.last&&0===a.animatingTo&&a.vars.animationLoop&&a.setProps(e,"jumpStart")),a.animating=!1,a.currentSlide=a.animatingTo,a.vars.after(a)},a.animateSlides=function(){!a.animating&&f&&a.flexAnimate(a.getTarget("next"))},a.pause=function(){clearInterval(a.animatedSlides),a.animatedSlides=null,a.playing=!1,a.vars.pausePlay&&m.pausePlay.update("play"),a.syncExists&&m.sync("pause")},a.play=function(){a.playing&&clearInterval(a.animatedSlides),a.animatedSlides=a.animatedSlides||setInterval(a.animateSlides,a.vars.slideshowSpeed),a.started=a.playing=!0,a.vars.pausePlay&&m.pausePlay.update("pause"),a.syncExists&&m.sync("play")},a.stop=function(){a.pause(),a.stopped=!0},a.canAdvance=function(e,t){var n=p?a.pagingCount-1:a.last;return t?!0:p&&a.currentItem===a.count-1&&0===e&&"prev"===a.direction?!0:p&&0===a.currentItem&&e===a.pagingCount-1&&"next"!==a.direction?!1:e!==a.currentSlide||p?a.vars.animationLoop?!0:a.atEnd&&0===a.currentSlide&&e===n&&"next"!==a.direction?!1:a.atEnd&&a.currentSlide===n&&0===e&&"next"===a.direction?!1:!0:!1},a.getTarget=function(e){return a.direction=e,"next"===e?a.currentSlide===a.last?0:a.currentSlide+1:0===a.currentSlide?a.last:a.currentSlide-1},a.setProps=function(e,t,n){var i=function(){var n=e?e:(a.itemW+a.vars.itemMargin)*a.move*a.animatingTo,i=function(){if(u)return"setTouch"===t?e:d&&a.animatingTo===a.last?0:d?a.limit-(a.itemW+a.vars.itemMargin)*a.move*a.animatingTo:a.animatingTo===a.last?a.limit:n;switch(t){case"setTotal":return d?(a.count-1-a.currentSlide+a.cloneOffset)*e:(a.currentSlide+a.cloneOffset)*e;case"setTouch":return d?e:e;case"jumpEnd":return d?e:a.count*e;case"jumpStart":return d?a.count*e:e;default:return e}}();return-1*i+"px"}();a.transitions&&(i=c?"translate3d(0,"+i+",0)":"translate3d("+i+",0,0)",n=void 0!==n?n/1e3+"s":"0s",a.container.css("-"+a.pfx+"-transition-duration",n),a.container.css("transition-duration",n)),a.args[a.prop]=i,(a.transitions||void 0===n)&&a.container.css(a.args),a.container.css("transform",i)},a.setup=function(e){if(v)a.slides.css({width:"100%","float":"left",marginRight:"-100%",position:"relative"}),"init"===e&&(s?a.slides.css({opacity:0,display:"block",webkitTransition:"opacity "+a.vars.animationSpeed/1e3+"s ease",zIndex:1}).eq(a.currentSlide).css({opacity:1,zIndex:2}):0==a.vars.fadeFirstSlide?a.slides.css({opacity:0,display:"block",zIndex:1}).eq(a.currentSlide).css({zIndex:2}).css({opacity:1}):a.slides.css({opacity:0,display:"block",zIndex:1}).eq(a.currentSlide).css({zIndex:2}).animate({opacity:1},a.vars.animationSpeed,a.vars.easing)),a.vars.smoothHeight&&m.smoothHeight();else{var t,i;"init"===e&&(a.viewport=$('<div class="'+n+'viewport"></div>').css({overflow:"hidden",position:"relative"}).appendTo(a).append(a.container),a.cloneCount=0,a.cloneOffset=0,d&&(i=$.makeArray(a.slides).reverse(),a.slides=$(i),a.container.empty().append(a.slides))),a.vars.animationLoop&&!u&&(a.cloneCount=2,a.cloneOffset=1,"init"!==e&&a.container.find(".clone").remove(),a.container.append(m.uniqueID(a.slides.first().clone().addClass("clone")).attr("aria-hidden","true")).prepend(m.uniqueID(a.slides.last().clone().addClass("clone")).attr("aria-hidden","true"))),a.newSlides=$(a.vars.selector,a),t=d?a.count-1-a.currentSlide+a.cloneOffset:a.currentSlide+a.cloneOffset,c&&!u?(a.container.height(200*(a.count+a.cloneCount)+"%").css("position","absolute").width("100%"),setTimeout(function(){a.newSlides.css({display:"block"}),a.doMath(),a.viewport.height(a.h),a.setProps(t*a.h,"init")},"init"===e?100:0)):(a.container.width(200*(a.count+a.cloneCount)+"%"),a.setProps(t*a.computedW,"init"),setTimeout(function(){a.doMath(),a.newSlides.css({width:a.computedW,"float":"left",display:"block"}),a.vars.smoothHeight&&m.smoothHeight()},"init"===e?100:0))}u||a.slides.removeClass(n+"active-slide").eq(a.currentSlide).addClass(n+"active-slide"),a.vars.init(a)},a.doMath=function(){var e=a.slides.first(),t=a.vars.itemMargin,n=a.vars.minItems,i=a.vars.maxItems;a.w=void 0===a.viewport?a.width():a.viewport.width(),a.h=e.height(),a.boxPadding=e.outerWidth()-e.width(),u?(a.itemT=a.vars.itemWidth+t,a.minW=n?n*a.itemT:a.w,a.maxW=i?i*a.itemT-t:a.w,a.itemW=a.minW>a.w?(a.w-t*(n-1))/n:a.maxW<a.w?(a.w-t*(i-1))/i:a.vars.itemWidth>a.w?a.w:a.vars.itemWidth,a.visible=Math.floor(a.w/a.itemW),a.move=a.vars.move>0&&a.vars.move<a.visible?a.vars.move:a.visible,a.pagingCount=Math.ceil((a.count-a.visible)/a.move+1),a.last=a.pagingCount-1,a.limit=1===a.pagingCount?0:a.vars.itemWidth>a.w?a.itemW*(a.count-1)+t*(a.count-1):(a.itemW+t)*a.count-a.w-t):(a.itemW=a.w,a.pagingCount=a.count,a.last=a.count-1),a.computedW=a.itemW-a.boxPadding},a.update=function(e,t){a.doMath(),u||(e<a.currentSlide?a.currentSlide+=1:e<=a.currentSlide&&0!==e&&(a.currentSlide-=1),a.animatingTo=a.currentSlide),a.vars.controlNav&&!a.manualControls&&("add"===t&&!u||a.pagingCount>a.controlNav.length?m.controlNav.update("add"):("remove"===t&&!u||a.pagingCount<a.controlNav.length)&&(u&&a.currentSlide>a.last&&(a.currentSlide-=1,a.animatingTo-=1),m.controlNav.update("remove",a.last))),a.vars.directionNav&&m.directionNav.update()},a.addSlide=function(e,t){var n=$(e);a.count+=1,a.last=a.count-1,c&&d?void 0!==t?a.slides.eq(a.count-t).after(n):a.container.prepend(n):void 0!==t?a.slides.eq(t).before(n):a.container.append(n),a.update(t,"add"),a.slides=$(a.vars.selector+":not(.clone)",a),a.setup(),a.vars.added(a)},a.removeSlide=function(e){var t=isNaN(e)?a.slides.index($(e)):e;a.count-=1,a.last=a.count-1,isNaN(e)?$(e,a.slides).remove():c&&d?a.slides.eq(a.last).remove():a.slides.eq(e).remove(),a.doMath(),a.update(t,"remove"),a.slides=$(a.vars.selector+":not(.clone)",a),a.setup(),a.vars.removed(a)},m.init()},$(window).blur(function(e){focused=!1}).focus(function(e){focused=!0}),$.flexslider.defaults={namespace:"flex-",selector:".slides > li",animation:"fade",easing:"swing",direction:"horizontal",reverse:!1,animationLoop:!0,smoothHeight:!1,startAt:0,slideshow:!0,slideshowSpeed:7e3,animationSpeed:600,initDelay:0,randomize:!1,fadeFirstSlide:!0,thumbCaptions:!1,pauseOnAction:!0,pauseOnHover:!1,pauseInvisible:!0,useCSS:!0,touch:!0,video:!1,controlNav:!0,directionNav:!0,prevText:"Previous",nextText:"Next",keyboard:!0,multipleKeyboard:!1,mousewheel:!1,pausePlay:!1,pauseText:"Pause",playText:"Play",controlsContainer:"",manualControls:"",sync:"",asNavFor:"",itemWidth:0,itemMargin:0,minItems:1,maxItems:0,move:0,allowOneSlide:!0,start:function(){},before:function(){},after:function(){},end:function(){},added:function(){},removed:function(){},init:function(){}},$.fn.flexslider=function(e){if(void 0===e&&(e={}),"object"==typeof e)return this.each(function(){var t=$(this),a=e.selector?e.selector:".slides > li",n=t.find(a);1===n.length&&e.allowOneSlide===!0||0===n.length?(n.fadeIn(400),e.start&&e.start(t)):void 0===t.data("flexslider")&&new $.flexslider(this,e)});var t=$(this).data("flexslider");switch(e){case"play":t.play();break;case"pause":t.pause();break;case"stop":t.stop();break;case"next":t.flexAnimate(t.getTarget("next"),!0);break;case"prev":case"previous":t.flexAnimate(t.getTarget("prev"),!0);break;default:"number"==typeof e&&t.flexAnimate(e,!0)}}}(jQuery);
            //]]>
    </script>
    <!--================================== Testimonial Widget Script ==================================-->]

       8. Congratulations! You are done. 

    Copyrights

    Creative Commons License

    © 2012-2017 TipRicks Inc.
    Version: 2.0 2017/04/16

    This Plugin by TipRicks (TR) is licensed under a Creative Commons Attribution-NonCommercial-ShareAlike 4.0 International License.

    You are most welcomed to share the plugin with your readership as long as you attach credit link back to this page. You are most welcomed to use the plugin in your commercial products as long as you keep the source credits intact.

    Feedback

    Would love to hear your thoughts on this widget. Let me know if it lived up to your expectations. 

    I have tried my best to create SEO friendly codes and eye catching colors. So If you like this widget please give me your feedback's so that I can improve my abilities.

    This article "Add a Responsive Testimonial Slider in Your Blog/Website " is protected by




    Was this article helpful?

    Thanks! Your feedback will help us to improve our Services.

    COMMENTS

    BLOGGER
    Need help? Contact to our support center at +92 308 477 4257
    Name

    Agriculture PPT Templates,2,AI Tools,1,Amazon,1,AskTipRicks,9,Blogger,48,Blogger-SEO,6,Blogger-Templates,1,Blogger-Tutorials,32,Blogger-Widgets,11,Blogging-Tips,7,Books,1,Business,1,Computer PPT Templates,1,Computer-Tutorials,1,Creative-PowerPoint-Templates,2,Digital Marketing,1,Domain,1,Ecommerce,1,Facebook,4,Free-Mobile-Data,1,Freenom,1,General,7,Google-Adsense,4,Google-Analytics,2,Google-Classroom,3,Instagram,2,Internet,1,Interviews,1,Islamic PPT Templates,1,jQuery,1,Marketing,1,Medical PPT Templates,1,Microsoft-Word,3,Mobile-Marketing,1,Motivation,1,MS Word,1,News,25,News-Updates,26,Oppo-Mobile-Features,1,PDF,1,PowerPoint-Templates,7,Resume-Templates,2,Reviews,3,SEO,8,Social-Media,6,Tech-News,15,TrueCaller,1,Twitter,1,Videos,24,Vlogging,1,Web-Hosting,1,Whatsapp,3,WordPress,8,WordPress-SEO,1,WordPress-Themes,1,WordPress-Tutorials,4,Youtube,5,
    ltr
    item
    TipRicks Blog: Add a Responsive Testimonial Slider in Your Blog/Website
    Add a Responsive Testimonial Slider in Your Blog/Website
    A Simple Responsive and Eye Catching Testimonial Slider for a Blogger Blog or Website.
    https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiZLSPnsu7SUEKv86NGFEwe0S8de39JLgYS8kBvIfEokf6QJWCdmqosNYu8AMDLAt9btAuXXppfg-3S1wXFjJ0C-h7dUew2sLTBBjyakc0kEBQTNsFuG5M-yEtF9ae2yf-7RZfBGCdvf29X/s320/add-responsive-testimonial-slider-in-your-blogger-blog-website.jpg
    https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiZLSPnsu7SUEKv86NGFEwe0S8de39JLgYS8kBvIfEokf6QJWCdmqosNYu8AMDLAt9btAuXXppfg-3S1wXFjJ0C-h7dUew2sLTBBjyakc0kEBQTNsFuG5M-yEtF9ae2yf-7RZfBGCdvf29X/s72-c/add-responsive-testimonial-slider-in-your-blogger-blog-website.jpg
    TipRicks Blog
    https://blog.tipricks.com/2017/04/add-responsive-testimonial-slider-in-your-blogger-blog-website.html
    https://blog.tipricks.com/
    https://blog.tipricks.com/
    https://blog.tipricks.com/2017/04/add-responsive-testimonial-slider-in-your-blogger-blog-website.html
    true
    7070217950916442682
    UTF-8
    Loaded All Posts Not found any posts VIEW ALL Readmore Reply Cancel reply Delete By Home PAGES POSTS View All RECOMMENDED FOR YOU LABEL ARCHIVE SEARCH ALL POSTS Not found any post match with your request Back Home Sunday Monday Tuesday Wednesday Thursday Friday Saturday Sun Mon Tue Wed Thu Fri Sat January February March April May June July August September October November December Jan Feb Mar Apr May Jun Jul Aug Sep Oct Nov Dec just now 1 minute ago $$1$$ minutes ago 1 hour ago $$1$$ hours ago Yesterday $$1$$ days ago $$1$$ weeks ago more than 5 weeks ago Followers Follow THIS PREMIUM CONTENT IS LOCKED STEP 1: Share to a social network STEP 2: Click the link on your social network Copy All Code Select All Code All codes were copied to your clipboard Can not copy the codes / texts, please press [CTRL]+[C] (or CMD+C with Mac) to copy