list results in rotating view

13 posts by 2 authors in: Forums > CMS Builder
Last Post: September 26, 2013   (RSS)

Hi

I'm a bit stuck with displaying the list results in a rotating carousel (for example, the "events" here:  http://www.stpaulsburwood.org.au/home.php - with this code that should rotate / scroll to the next event if the arrow is clicked.


Here's the html code, but am at a loss to know where to insert <?php foreach ($eventsRecords as $record): ?> and "end it" with the <?php endforeach ?>

    <?php if (!$eventsRecords): ?>       No records were found!<br/><br/>     <?php endif ?>

list results so it can show 2 events, but then use the "next arrow" to progress to the next events.
 
 
<li>              
<!-- BEGIN .clearfix -->       
<div class="clearfix">            
  <!-- BEGIN .one-half -->      
  <div class="one-half blog-event-one-half">     
  <div class="event-preview">         
  <div class="event-date-wrapper">         
  <div class="event-month"><?php echo $record['month'] ?></div>         
  <div class="event-day"><?php echo $record['day'] ?></div>         
  </div>      
  <div class="event-entry-inner">          
  <h4><a href="<a href="<?php echo $record['_link'] ?>">"><?php echo htmlencode($record['title']) ?></a> <span>Event Time: <i><?php echo htmlencode($record['event_time']) ?></i> / Event Location: <i><?php echo htmlencode($record['event_location']) ?></i></span></h4>      
  <p><?php echo htmlencode($record['brief_event_summary']) ?></p>     
     </div>         
</div>      
       <!-- END .one-half -->       
  </div>        
    <!-- BEGIN .one-half -->     

   <div class="one-half last-col blog-event-one-half">       
        
 <div class="event-preview">         
  <div class="event-date-wrapper">         
  <div class="event-month"><?php echo $record['month'] ?></div>         
  <div class="event-day"><?php echo $record['day'] ?></div>         
  </div>      
  <div class="event-entry-inner">          
  <h4><a href="<a href="<?php echo $record['_link'] ?>">"><?php echo htmlencode($record['title']) ?></a> <span>Event Time: <i><?php echo htmlencode($record['event_time']) ?></i> / Event Location: <i><?php echo htmlencode($record['event_location']) ?></i></span></h4>      
  <p><?php echo htmlencode($record['brief_event_summary']) ?></p>     
     </div>         
</div>           
<!-- END .one-half -->  
       </div>

      <!-- END .clearfix -->       
</div>         
</li>

Many thanks

By Jason - September 16, 2013

Hi,

Is this the same site as your example?  Based on the HTML in the example you provided, it looks like your rotator script is looking for a format like this:

<div id="slider">
  <div class="slider">
    <ul class="slides">

      <?php foreach ($eventsRecords  as $record): ?>

        <li>

          <div class="slider-caption-wrapper">
            <div class="slider-caption">
                
               // put in slider information here
                
            </div>
          </div>

        </li>
      <?php endforeach ?>
      
   </ul>
        
  </div>
      
</div>

Does this look like what you are after?  Hope this helps

---------------------------------------------------
Jason Sauchuk - Project Manager
interactivetools.com

Hire me! Save time by getting our experts to help with your project.
http://www.interactivetools.com/consulting/

Hi Jason

The slider is at the top, the events section is below that under the heading called "events", 3/4 of the page down where you can see the "event calendar dates, etc" on this page:  http://www.stpaulsburwood.org.au/home.php

The script you have suggested doesn't work in the carousel view for the events.  Somehow the list needs to display 2 events, with the next arrows revealing more in the list.  Any ideas?

Thanks

By Jason - September 17, 2013

Hi,

Thanks.  I've taken a look at the events carousel at the bottom of the page.  Current it is displaying 2 events at a time with next/previous buttons allowing the user to scroll through the list.  Can you provide some clarification on how you would need this to work differently?

As this is working with a 3rdParty slider script, we can only offer limited support for this.  If you need us to get more involved with integrating this script for events, you can send an email to consulting@interactivetools.com and we can go over some options.

Thanks

---------------------------------------------------
Jason Sauchuk - Project Manager
interactivetools.com

Hire me! Save time by getting our experts to help with your project.
http://www.interactivetools.com/consulting/

Hi Jason

I don't need my script to work any differently, I just need to know how to insert the CMS builder list code (from my events) into this so it displays in this carosel method.  What I am asking again is how do I insert the script (using the list records) in this type of format?  Is this possible?

If not, how can I just display the two columns (without the next)?

Thanks

By Jason - September 18, 2013

Hi,

Okay, I see.  Are the event records that are currently displaying hardcoded in?  Can you attach the .php file you are currently working with?  If I can see the code that you are using, I should be able to give you a better example of how to do this.

Hope this helps,

---------------------------------------------------
Jason Sauchuk - Project Manager
interactivetools.com

Hire me! Save time by getting our experts to help with your project.
http://www.interactivetools.com/consulting/

Hi Jason
I have attached the .php file.  Thanks

Attachments:

home.php 13K

Hi Jason

Thanks for this, but it doesn't allow me to display it in 2 columns - see http://www.stpaulsburwood.org.au/home3.php

The code I have working so far is

   <!-- BEGIN .slider --> <?php   $eventsPerSlide = 2;   $eventCount     = 0;

?>    <div class="text-slider">     <ul class="slides">


     <li>         <?php foreach ($eventsRecords as $record): ?>


      <!-- BEGIN .clearfix -->       <div class="clearfix">              <!-- BEGIN .one-half -->        <div class="one-half">              <div class="event-preview">           <div class="event-date-wrapper">               <div class="event-month"><?php echo $record['month'] ?></div>                <div class="event-day"><?php echo $record['day'] ?></div>


         </div>          <div class="event-entry-inner">            <h4><a href="<?php echo $record['_link'] ?>"><?php echo htmlencode($record['title']) ?></a> <span>Event Time: <i><?php echo htmlencode($record['event_time']) ?></i> / Event Location: <i><?php echo htmlencode($record['event_location']) ?></i></span></h4>           <p><?php echo htmlencode($record['brief_event_summary']) ?></p>          </div>         </div>             <!-- END .one-half -->         </div>                            <?php if (++$eventCount % $eventsPerSlide == 0): ?>      </li><li>    <?php endif ?>               <?php endforeach ?>                 </li>               </ul> </div>                <!-- END .text-slider -->

By Jason - September 24, 2013

Hi,

It looks like we are missing a closing div tag inside the foreach loop.  Try this:

<?php
  $eventsPerSlide = 2;   
  $eventCount     = 0;
?>
<div class="text-slider">
  <ul class="slides">
    <li>
    
    <?php foreach ($eventsRecords as $record): ?>
      <div class="clearfix">
        <div class="one-half">
          <div class="event-preview">
            
            <div class="event-date-wrapper">
              
              <div class="event-month"><?php echo $record['month'] ?></div>
              <div class="event-day"><?php echo $record['day'] ?></div>
               
            </div>
            
            <div class="event-entry-inner">
              <h4><a href="<?php echo $record['_link'] ?>"><?php echo htmlencode($record['title']) ?></a> <span>Event Time: <i><?php echo htmlencode($record['event_time']) ?></i> / Event Location: <i><?php echo htmlencode($record['event_location']) ?></i></span></h4>
              <p><?php echo htmlencode($record['brief_event_summary']) ?></p>
            </div>
            
          </div>
          
        </div>

      </div>
        
        <?php if (++$eventCount % $eventsPerSlide == 0): ?>
          </li><li>
        <?php endif ?>
        
    <?php endforeach ?>
    </li>
  </ul>
</div>

Hope this helps

---------------------------------------------------
Jason Sauchuk - Project Manager
interactivetools.com

Hire me! Save time by getting our experts to help with your project.
http://www.interactivetools.com/consulting/