list results in rotating view

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

By degreesnorth - September 15, 2013

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/

By degreesnorth - September 16, 2013

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 degreesnorth - September 17, 2013

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/

By degreesnorth - September 18, 2013

Hi Jason
I have attached the .php file.  Thanks

Attachments:

home.php 13K

By Jason - September 19, 2013

Hi,

I've taken a look at your code and create this example code.  I've had to make a number of assumptions in this code:

  • You have an event section and create a record set called $eventRecords
  • The event section has a field called date, for the date of the event
  • There is a field called time, location, and description

You may have to alter the code to fit with your current set up.

<?php
  $eventsPerSlide = 2;
  $eventCount     = 0;

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

<li>

  <?php foreach ($eventRecords as $event): ?>
    <?php
       $eventMonth = date("M", strtotime($event['date']));
       $eventDay   = date("d", strtotime($event['date']));
    ?>
<!-- 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 $eventMonth;?></div>
    <div class="event-day"><?php echo $eventDay;?></div>
   </div>

  <div class="event-entry-inner"> 
    <h4><a href="<?php echo $event['_link'];?>"><?php echo $event['title'];?></a> <span>Event Time: <i><?php echo $event['time'];?></i> / Event Location: <i><?php echo $event['location'];?></i></span></h4>
    <?php echo $event['description'];?>
  </div>
</div>

<!-- END .one-half --> 
</div>
              
   <?php if (++$eventCount % $eventsPerSlide == 0): ?>
     </li><li>
   <?php endif ?>
              
<?php endforeach ?>
        
        </li>
        
      </ul>
</div>



Give this a try and let me know if you have any questions.

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/

By degreesnorth - September 22, 2013

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/