Testimonials - Single | Presence Resources

This feature consists of a header and two containers: one for the image and another for the rich text area (paragraph by default). There is a pager generated by JavaScript to navigate through the testimonials.

For a complete list of best practices, visit the main portlet page: Features

HTML Structure


<div class="featureWrapper testimonialsSingle">
           <div class="carousel">
             <div class="feature clearfix">
                <div class="wrapper">
			         <div class="image">
                         <span>
			               <img src="theme/testimonials/testimonial1.jpg" alt="" />
			             </span>
                     </div>
				
                    <div class="text">
                   	      <h2>Feature Title</h2>
			              <!-- Rich text. This is the ONLY area where text elements may be added/edited. --> 
                    	  <p>Feature content</p>
                    </div>
                </div>
              </div><!-- End feature -->
	  <!-- Copy/paste div.feature and contents for more features of the same type --> 
          </div>
</div><!-- End featureWrapper -->


<!-- The following are part of the render template therefore cannot be altered. Include these files in the <head> OR at the bottom just before </body>) -->
<link rel="stylesheet" type="text/css" href="//cdn.jsdelivr.net/jquery.slick/1.6.0/slick.css"/> 
<script type="text/javascript" src="//cdn.jsdelivr.net/jquery.slick/1.6.0/slick.min.js">//</script> 

<script>
    $('.testimonialsSingle .carousel').slick({
		cssEase: 'linear',
		infinite: true,
        slidesToShow: 1,
        slidesToScroll: 1,
		speed: 500,
		dots: true,
		arrows: true,
		appendArrows: $("<div></div>").addClass("controls").insertAfter(".testimonialsSingle .carousel"),
		accessibility: true,
		
	});  
</script>

Default Styling

Testimonial Title

Consectetur adipiscing elit pellentesque laoreet sapien molestie consectetur. Mauris purus odio, auctor suscipit elit non.

Testimonial Title

Consectetur adipiscing elit pellentesque laoreet sapien molestie consectetur. Mauris purus odio, auctor suscipit elit non.

Testimonial Title

Consectetur adipiscing elit pellentesque laoreet sapien molestie consectetur. Mauris purus odio, auctor suscipit elit non.

Custom Styling Example

Excellent Work

"Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus euismod at magna dapibus aliquam. Phasellus ac congue velit. Suspendisse ligula ante, luctus sit amet volutpat lobortis, consequat ac metus."

Patient A.

I Can See Clearly Now

"Vivamus euismod at magna dapibus aliquam. Phasellus ac congue velit. Suspendisse ligula ante, luctus sit amet volutpat lobortis, consequat ac metus."

Patient B.

Smooth Sailing

"Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus euismod at magna dapibus aliquam. Phasellus ac congue velit."

Patient C.

Custom Styling Example

Patient C.

"Ut egestas diam a sem molestie, vitae ornare lectus facilisis."

Patient A.

"Ut viverra dui nec nulla vehicula, ut semper nunc rhoncus. Fusce egestas diam mollis sem sit amet."

Patient B.

"Class aptent taciti sociosqu ad litora torquent per conubia nostra."