Forum Support

Shape 5
May 08, 2021, 12:44:14 PM *
Welcome, Guest. Please login or register.

Login with username, password and session length
News: Shape 5 Forum
 
   Home   Help Search Login Register  
Pages: [1]
  Print  
Author Topic: Quote_Box and Team Circles  (Read 355 times)
ja1969
Jr. Member
**
Offline Offline

Posts: 30



« on: 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

Logged
mikek
Administrator
*****
Offline Offline

Posts: 28743



WWW
« Reply #1 on: 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>
Logged

Mike Knott
------------
Shape 5 Team

- Need a great host for your website? We highly recommend siteground.com!


- Put your trust in the hands of our extremely qualified staff to get your job done right!


- Firebug is the most powerful web development and debugging tool, and it will save you a lot of time, frustration and forum questions:
Install Firebug
ja1969
Jr. Member
**
Offline Offline

Posts: 30



« Reply #2 on: 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
Logged
Pages: [1]
  Print  
 
Jump to:  

Powered by MySQL Powered by PHP Powered by SMF | SMF © 2013, Simple Machines
Joomla Bridge by JoomlaHacks.com
Valid XHTML 1.0! Valid CSS!
Looking for the largest variety in template designs? Look no more. Never buy 1 theme again. Signups start at just $89 for access to all of our themes.
Send Us An Email
Please send us your questions and we will email you back as soon as we can. Product support questions should be posted in our support forums under the Help menu. Our staff will assist you from there.