-1

So I need to add a title and content from a custom post type in my WordPress site I am added the posts loop to this archive-work.php file:

<?php
/**
 * Work template file.
 *
 * This is the most generic template file in a WordPress theme and one of the
 * two required files for a theme (the other being style.css).
 * It is used to display a page when nothing more specific matches a query.
 * For example, it puts together the home page when no home.php file exists.
 *
 * Learn more: http://codex.wordpress.org/Template_Hierarchy
 *
 * @package   CMMS
 * @author    Creative MMS
* 
 * 
 * @since     1.0.0
 */

get_header(); ?>


    <div class="cmms-house">

        <div class="content-area cmms-clr">

            <main class="site-main cmms-clr">

                <?php
                // Display page header
                //get_template_part( 'partials/archives/header' ); ?>

                <?php
                // Check if posts exist
                if ( have_posts() ) : ?>

                    <div class="work-entry cmms-clr">   
                        <div class="work-col work-left">

                            <?php
                                // Get query
                                global $wp_query;

                                // Count
                                $count = 1;

                                // Loop through posts
                                while ( have_posts() ) : the_post(); 

                                //Vars
                                $tileImageRow = get_field('hovered_image_large');



                                ?>

                                <div id="<?= $count; ?>" class="item <?php if ($count == 1) : ?>active<?php endif; ?>" style="background-image: url('<?= $tileImageRow['url']; ?>');">




                                </div>


                            <?php
                                // End loop
                                $count++; endwhile;
                            ?>
                            <?php wp_reset_postdata(); ?>

                        </div><!-- .left -->

                        <div class="work-col work-right">
                            <ul>
                            <?php
                                // Get query
                                global $wp_query;

                                //Counter
                                $counter = 1;

                                // Loop through posts
                                while ( have_posts() ) : the_post(); ?>

                                    <li class="list-right" data-trigger="#<?= $counter; ?>"><?= get_the_title(); ?></li>

                            <?php
                                // End loop
                                $counter++; endwhile;
                            ?>
                            <?php wp_reset_postdata(); ?>
                            </ul>
                        </div><!-- .right -->

                    </div><!-- .work-entry -->  

                    <?php
                    // Include pagination template part
                    cmms_include_template( 'partials/global/pagination.php' ); ?>

                <?php
                // Display no posts found message
                else : ?>

                    <?php get_template_part( 'partials/entry/none' ); ?>

                <?php endif; ?>

            </main><!-- .main -->

        </div><!-- .content-area -->

<?php get_sidebar(); ?>

<?php get_footer(); ?>

When I add this code:

<?php if (have_posts()) : ?>
  <?php while(have_posts()): the_post(); ?>
    <h3><?php the_title(); ?></h3>
       <?php the_content(); ?>
  <?php endwhile; ?>
<?php endif; ?>

in between the div with id of , the page breaks, as opposed to my desired intention of displaying the title and content of my custom post type. Why?

0

You can use a single loop to achieve this by storing the title/content in your first loop and then just displaying it outside between your div. This way you do not need to loop same thing twice, which ultimately reduce your load time.

<?php
/**
 * Work template file.
 *
 * This is the most generic template file in a WordPress theme and one of the
 * two required files for a theme (the other being style.css).
 * It is used to display a page when nothing more specific matches a query.
 * For example, it puts together the home page when no home.php file exists.
 *
 * Learn more: http://codex.wordpress.org/Template_Hierarchy
 *
 * @package   CMMS
 * @author    Creative MMS
*
 *
 * @since     1.0.0
 */
get_header(); ?>
    <div class="cmms-house">
        <div class="content-area cmms-clr">
            <main class="site-main cmms-clr">
                <?php
                // Display page header
                //get_template_part( 'partials/archives/header' ); ?>
                <?php
                // Check if posts exist
                if ( have_posts() ) : ?>
                    <div class="work-entry cmms-clr">
                        <div class="work-col work-left">
                            <?php
                                // Get query
                                global $wp_query;
                                // Count
                                $li = '';
                                $count = 1;
                                // Loop through posts
                                while ( have_posts() ) : the_post();
                                //Vars
                                $tileImageRow = get_field('hovered_image_large');
                                $li .= '<li class="list-right" data-trigger="#<'.$count.'">'.get_the_title().'</li>';
                                ?>
                                <div id="<?= $count; ?>" class="item <?php if ($count == 1) : ?>active<?php endif; ?>" style="background-image: url('<?= $tileImageRow['url']; ?>');">
                                </div>
                            <?php
                                // End loop
                                $count++; endwhile;
                            ?>
                            <?php wp_reset_postdata(); ?>
                        </div><!-- .left -->
                        <div class="work-col work-right">
                            <ul>
                                <?php echo $li; ?>
                            </ul>
                        </div><!-- .right -->
                    </div><!-- .work-entry -->
                    <?php
                    // Include pagination template part
                    cmms_include_template( 'partials/global/pagination.php' ); ?>
                <?php
                // Display no posts found message
                else : ?>
                    <?php get_template_part( 'partials/entry/none' ); ?>
                <?php endif; ?>
            </main><!-- .main -->
        </div><!-- .content-area -->
<?php get_sidebar(); ?>
<?php get_footer(); ?>

Hope you understand!!

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.