Shape 5

Joomla Templates => Lime Light - Club => : ja1969 June 16, 2013, 09:01:44 AM



: Quote_Box and Team Circles
: ja1969 June 16, 2013, 09:01:44 AM
How can I use the "Quote_Box" and the moving Team "Circles" with Faces like in the Demo?
Seems to be included in the template (checking with firebug), but there is no documentation about this.

thanx in advance for your support.

Best regards
Joachim



: Re: Quote_Box and Team Circles
: mikek June 17, 2013, 06:46:34 AM
Hello,

They are both custom html modules. The content is included in the site shaper, and I will paste it below for you as well. You just need to swap out the content and images for your own:

Quotes:

<div class="quote_box quote_box_left">
   <div class="quote_box_inner">

   <img src="images/quote1.png" alt="" />

   <div class="quote_text">
   Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi nec enim a mauris ornare pellentesque. Mauris vel ullamcorper urna. Duis lacinia mauris a magna bibendum lorem ipsum.
   

   <span class="highlight1">Jason Reynolds</span>
   </div>
   
   <div style="clear:both"></div>

   </div>
</div>

<div class="quote_box quote_box_right">
   <div class="quote_box_inner">

   <img src="images/quote2.png" alt="" />

   <div class="quote_text">
   Suspendisse venenatis lobortis ante, et rhoncus ipsum eleifend venenatis. Pellentesque sodales sem lectus, vulputate posuere mauris dignissim at. Quisque ante ipsum, fermentu.
   

   <span class="highlight1">Michelle Meyers</span>
   </div>
   
   <div style="clear:both"></div>

   </div>
</div>

<div style="text-align:center">

   Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi nec enim a mauris ornare pellentesque. Mauris vel ullamcorper urna. Duis lacinia mauris a magna bibendum at sollicitudin tellus suscipit. Maecenas in blandit felis. Vivamus convallis suscipit hendrerit. Cum sociis natoque penatibus et magnis dis.

   



   <a href="" class="readon">Read More Testimonials[/url]

</div>

<div style="clear:both"></div>



Circles:


<div style="text-align:center">
Phasellus ultricies vestibulum sollicitudin. Donec sed tortor purus. Nam varius mi dui, vel dapibus lectus ullamcorper vitae. Quisque varius laoreet nunc eget iaculis. Donec placerat magna massa, nec fermentum orci dignissim id. In gravida, turpis eget semper placerat, tortor quam vehicula turpis, eget semper justo enim non nisl.
</div>


<div class="circles">
<div class="circles_inner">
   <div class="circle">
      <div class="circle_img">
         <a href="">
         <img alt="" src="images/circle1.jpg" />
         [/url]
      </div>
      <div class="circle_text">
         Brian Roberts

         <span class="highlight2">CEO and Owner</span>
      </div>
   </div>
   <div class="circle">
      <div class="circle_img">
         <a href="">
         <img alt="" src="images/circle2.jpg" />
         [/url]
      </div>
      <div class="circle_text">
         Christy Leland

         <span class="highlight2">Customer Support</span>
      </div>
   </div>
   <div class="circle">
      <div class="circle_img">
         <a href="">
         <img alt="" src="images/circle3.jpg" />
         [/url]
      </div>
      <div class="circle_text">
         Matthew Kline

         <span class="highlight2">Lead Developer</span>
      </div>
   </div>
   <div class="circle">
      <div class="circle_img">
         <a href="">
         <img alt="" src="images/circle4.jpg" />
         [/url]
      </div>
      <div class="circle_text">
         Brittany Lance

         <span class="highlight2">Human Resources</span>
      </div>
   </div>
   <div class="circle">
      <div class="circle_img">
         <a href="">
         <img alt="" src="images/circle5.jpg" />
         [/url]
      </div>
      <div class="circle_text">
         Josh Emerald

         <span class="highlight2">Sales and Support</span>
      </div>
   </div>
   <div style="clear:both"></div>
</div>
</div>


: Re: Quote_Box and Team Circles
: ja1969 June 18, 2013, 12:38:33 AM
Hi Mike,

I understand.
As I found out with firebug, the CLASSES are defined in template.css.
So copying those settings to custom.css would give me the opportunity to use it in other s5 templates, with the need to customize it.

Thanx
Joachim