Problem with showing 2 div class in single PHP loop code

Collapse
X
  • Filter
  • Time
  • Show
Clear All
new posts

  • help Problem with showing 2 div class in single PHP loop code

    Hello,
    I'm converting a theme from HTML Template to Dynamic for WordPress theme.

    I've created several custom post type like, Services, Slides, Team etc.
    Now, my problem is I can't design the services like the HTML template. Because, the template use 2 DIV class. One of them is "service wow fadeInUp" and another one is "service wow fadeInDown".

    Example:
    Text 1 = service wow fadeInUp
    Text 2 = service wow fadeInDown
    Text 3 = service wow fadeInUp
    Text 4 = service wow fadeInDown
    continue.........

    But when, I use PHP code for showing Services (custom post type) in my index.php it comes with only one DIV class. I don't know how to use 2 DIV class in single PHP code for showing my Custom Post Type.
    I'm newbie in PHP language. It will be very helpful for me if anyone solve this problem for me and give me some description about how to do it.
    My codes are given below:

    functions.php
    Code:
    // add services
    
        register_post_type ('tservices', array(
            'labels' => array(
                'name' => 'Services',
                'add_new_item' => 'Add New Service'
                ),
            'public' => true,
            'supports' => array('title', 'editor',)
        ));

    index.php
    Code:
    <div class="col-sm-3">
                        
                        <?php
                            $thservices = new WP_Query(array(
                                'post_type' => 'tservices',
                                'order'   => 'ASC'
                            ));
                        ?>
                        <?php while($thservices->have_posts()) : $thservices->the_post(); ?>
                        
                        
                            <div class="service wow fadeInUp">
                                <div class="service-icon"><?php echo get_post_meta($post->ID, 'faicon', true); ?></i></div>
                                <h3><?php the_title(); ?></h3>
                                <?php the_content(); ?>...
    
                                <a class="big-link-1" href="services.html">Read more</a>
                            </div>
                        
                        <?php endwhile; ?>
                        
    
                        </div>
    If you notice, you will find only one div class available there. How can I add the 2nd div class in it ?
    Help me please !

  • #2
    Something on the lines of:

    Code:
    <div class="col-sm-3">
                        
                        <?php
                            $thservices = new WP_Query(array(
                                'post_type' => 'tservices',
                                'order'   => 'ASC'
                            ));
    
                            $i = 0;
                            while($thservices->have_posts()) : $thservices->the_post(); 
                            
                            if($i%2==0)    $div = "service wow fadeInUp";
                            else         $div = "service wow fadeInDown";
    
                            $i++;
                            
                        ?>
                        
                        
                            <div class="<?=$div?>">
                                <div class="service-icon"><?php echo get_post_meta($post->ID, 'faicon', true); ?></i></div>
                                <h3><?php the_title(); ?></h3>
                                <?php the_content(); ?>...
    
                                <a class="big-link-1" href="services.html">Read more</a>
                            </div>
                        
                        <?php endwhile; ?>
                        
    
                        </div>

    Comment


    • #3
      Originally posted by something else View Post
      Something on the lines of:

      Code:
      <div class="col-sm-3">
      
      <?php
      $thservices = new WP_Query(array(
      'post_type' => 'tservices',
      'order' => 'ASC'
      ));
      
      $i = 0;
      while($thservices->have_posts()) : $thservices->the_post();
      
      if($i%2==0) $div = "service wow fadeInUp";
      else $div = "service wow fadeInDown";
      
      $i++;
      
      ?>
      
      
      <div class="<?=$div?>">
      <div class="service-icon"><?php echo get_post_meta($post->ID, 'faicon', true); ?></i></div>
      <h3><?php the_title(); ?></h3>
      <?php the_content(); ?>...
      
      <a class="big-link-1" href="services.html">Read more</a>
      </div>
      
      <?php endwhile; ?>
      
      
      </div>
      yup, that should work. Great job!

      Comment

      Working...
      X