Finding and editing a loop

I’m trying to intergrate woocommerce with my wordpress theme:

the problem being this: http://www.muslimahwebdesign.co.uk/dage_boutique/?post_type=product as you can see it needs to be centred to following instructions it says to find the loop:

<?php if ( have_posts() ) :

and usually ends with:

<?php endif; ?>

what I found was this:

<?php if (have_posts()) : while (have_posts()) : the_post(); ?>

and I need to replace the first with this:

<?php woocommerce_content(); ?>

so I placed this: <?php if (have_posts()) : while (have_posts()) : the_post(); ?> with the woocommerce one but I couldn’e see any endif? I think i’ve done it wrong, how would it properly be done?

Here is the instruction http://docs.woothemes.com/document/third-party-custom-theme-compatibility/

and here’s the original php

<?php if (have_posts()) : while (have_posts()) : the_post(); ?>

								<div class="et_pt_blogentry clearfix">
									<h2 class="et_pt_title"><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></h2>

									<p class="et_pt_blogmeta"><?php esc_html_e('Posted','Nexus'); ?> <?php esc_html_e('by','Nexus'); ?> <?php the_author_posts_link(); ?> <?php esc_html_e('on','Nexus'); ?> <?php the_time(get_option('nexus_date_format')) ?> <?php esc_html_e('in','Nexus'); ?> <?php the_category(', ') ?> | <?php comments_popup_link(esc_html__('0 comments','Nexus'), esc_html__('1 comment','Nexus'), '% '.esc_html__('comments','Nexus')); ?>

and here’s what I changed it to:

<?php woocommerce_content(); ?>

								<div class="et_pt_blogentry clearfix">
									<h2 class="et_pt_title"><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></h2>

									<p class="et_pt_blogmeta"><?php esc_html_e('Posted','Nexus'); ?> <?php esc_html_e('by','Nexus'); ?> <?php the_author_posts_link(); ?> <?php esc_html_e('on','Nexus'); ?> <?php the_time(get_option('nexus_date_format')) ?> <?php esc_html_e('in','Nexus'); ?> <?php the_category(', ') ?> | <?php comments_popup_link(esc_html__('0 comments','Nexus'), esc_html__('1 comment','Nexus'), '% '.esc_html__('comments','Nexus')); ?></p>

I believe their instructions mean to replace that “if” line, the “endif” line, and everything in between. You will have to find the end of this if statement. Is that really all there was in the original file? Keep looking down the file for the endIf.

thanks for your reply. here’s all the code from <?php if (have_posts()) : while (have_posts()) : the_post(); ?>, I can’t see and endif:

<?php if (have_posts()) : while (have_posts()) : the_post(); ?>

								<div class="et_pt_blogentry clearfix">
									<h2 class="et_pt_title"><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></h2>

									<p class="et_pt_blogmeta"><?php esc_html_e('Posted','Nexus'); ?> <?php esc_html_e('by','Nexus'); ?> <?php the_author_posts_link(); ?> <?php esc_html_e('on','Nexus'); ?> <?php the_time(get_option('nexus_date_format')) ?> <?php esc_html_e('in','Nexus'); ?> <?php the_category(', ') ?> | <?php comments_popup_link(esc_html__('0 comments','Nexus'), esc_html__('1 comment','Nexus'), '% '.esc_html__('comments','Nexus')); ?></p>

									<?php $thumb = '';
									$width = 184;
									$height = 184;
									$classtext = '';
									$titletext = get_the_title();

									$thumbnail = get_thumbnail($width,$height,$classtext,$titletext,$titletext);
									$thumb = $thumbnail["thumb"]; ?>

									<?php if ( $thumb <> '' && !$et_ptemplate_showthumb ) { ?>
										<div class="et_pt_thumb alignleft">
											<?php print_thumbnail($thumb, $thumbnail["use_timthumb"], $titletext, $width, $height, $classtext); ?>
											<a href="<?php the_permalink(); ?>"><span class="overlay"></span></a>
										</div> <!-- end .thumb -->
									<?php }; ?>

									<?php if (!$et_ptemplate_blogstyle) { ?>
										<p><?php truncate_post(550);?></p>
										<a href="<?php the_permalink(); ?>" class="readmore"><span><?php esc_html_e('read more','Nexus'); ?></span></a>
									<?php } else { ?>
										<?php
											global $more;
											$more = 0;
										?>
										<?php the_content(); ?>
									<?php } ?>
								</div> <!-- end .et_pt_blogentry -->

							<?php endwhile; ?>
								<div class="page-nav clearfix">
									<?php if(function_exists('wp_pagenavi')) { wp_pagenavi(); }
									else { ?>
										 <?php get_template_part('includes/navigation'); ?>
									<?php } ?>
								</div> <!-- end .entry -->
							<?php else : ?>
								<?php get_template_part('includes/no-results'); ?>
							<?php endif; wp_reset_query(); ?>
						</div> <!-- end #et_pt_blog -->
					</article> <!-- .entry -->

				<?php endwhile; ?>

				</div> 	<!-- end #left-area -->
			</div> <!-- #content -->

			<?php if ( ! $fullwidth ) get_sidebar(); ?>
		</div> <!-- .main-content-wrap -->

		<?php get_template_part( 'includes/footer-banner', 'page' ); ?>
	</div> <!-- #main-content -->

<?php get_footer(); ?>

and do you mean I should delete the endif also or just everything inbetween?

Following those instructions you should have this. Try it out. No guarantees! :slight_smile:



<?php woocommerce_content(); wp_reset_query(); ?> 
						</div> <!-- end #et_pt_blog -->
 
					</article> <!-- .entry -->
 
 
 
				<?php endwhile; ?>
 
 
 
				</div> 	<!-- end #left-area -->
 
			</div> <!-- #content -->
 
 
 
			<?php if ( ! $fullwidth ) get_sidebar(); ?>
 
		</div> <!-- .main-content-wrap -->
 
 
 
		<?php get_template_part( 'includes/footer-banner', 'page' ); ?>
 
	</div> <!-- #main-content -->
 
 
 
<?php get_footer(); ?>

It looks as though the code from (and including) the line <?php if (have_posts()) : while (have_posts()) : the_post(); ?>, down to the bottom of the file should be replaced with this:


                                <?php woocommerce_content(); ?>

								<div class="page-nav clearfix">
									<?php if(function_exists('wp_pagenavi')) { wp_pagenavi(); }
									else { ?>
										 <?php get_template_part('includes/navigation'); ?>
									<?php } ?>
								</div> <!-- end .entry -->
							<?php else : ?>
								<?php get_template_part('includes/no-results'); ?>
							<?php endif; wp_reset_query(); ?>
						</div> <!-- end #et_pt_blog -->
					</article> <!-- .entry -->

				<?php endwhile; ?>

				</div> 	<!-- end #left-area -->
			</div> <!-- #content -->

			<?php if ( ! $fullwidth ) get_sidebar(); ?>
		</div> <!-- .main-content-wrap -->

		<?php get_template_part( 'includes/footer-banner', 'page' ); ?>
	</div> <!-- #main-content -->

<?php get_footer(); ?>

hey rthanks

I tried that but no difference. Here’s all the code:

<?php
/*
Template Name: Blog Page
*/
?>
<?php
$et_ptemplate_settings = array();
$et_ptemplate_settings = maybe_unserialize( get_post_meta( get_the_ID(), 'et_ptemplate_settings', true ) );

$fullwidth = isset( $et_ptemplate_settings['et_fullwidthpage'] ) ? (bool) $et_ptemplate_settings['et_fullwidthpage'] : false;

$et_ptemplate_blogstyle = isset( $et_ptemplate_settings['et_ptemplate_blogstyle'] ) ? (bool) $et_ptemplate_settings['et_ptemplate_blogstyle'] : false;

$et_ptemplate_showthumb = isset( $et_ptemplate_settings['et_ptemplate_showthumb'] ) ? (bool) $et_ptemplate_settings['et_ptemplate_showthumb'] : false;

$blog_cats = isset( $et_ptemplate_settings['et_ptemplate_blogcats'] ) ? (array) array_map( 'intval', $et_ptemplate_settings['et_ptemplate_blogcats'] ) : array();
$et_ptemplate_blog_perpage = isset( $et_ptemplate_settings['et_ptemplate_blog_perpage'] ) ? (int) $et_ptemplate_settings['et_ptemplate_blog_perpage'] : 10;
?>
<?php get_header(); ?>

<?php
$featured_image = false;

if ( '' != get_the_post_thumbnail() ) :
	$featured_image = true;
?>
<div class="post-thumbnail">
	<div class="container">
		<h1 class="post-heading"><?php the_title(); ?></h1>
	</div> <!-- .container -->
</div> <!-- .post-thumbnail -->
<?php endif; ?>

<div class="page-wrap container<?php if ( $fullwidth ) echo ' fullwidth'; ?>">
	<div id="main-content">
		<div class="main-content-wrap clearfix">
			<div id="content">
				<?php get_template_part( 'includes/breadcrumbs', 'index' ); ?>

				<div id="left-area">

				<?php while ( have_posts() ) : the_post(); ?>

					<article class="entry-content clearfix">
					<?php if ( ! $featured_image ) : ?>
						<h1 class="main-title"><?php the_title(); ?></h1>
					<?php endif; ?>
					<?php
						the_content();

						wp_link_pages( array( 'before' => '<div class="page-links">' . __( 'Pages:', 'Nexus' ), 'after' => '</div>' ) );
					?>

						<div id="et_pt_blog" class="responsive clearfix">
							<?php $cat_query = '';
							if ( !empty($blog_cats) ) $cat_query = '&cat=' . implode(",", $blog_cats);
							else echo '<!-- blog category is not selected -->'; ?>
							<?php
								$et_paged = is_front_page() ? get_query_var( 'page' ) : get_query_var( 'paged' );
							?>
							<?php query_posts("posts_per_page=$et_ptemplate_blog_perpage&paged=" . $et_paged . $cat_query); ?>
							   <?php woocommerce_content(); ?>
                            
                                <div class="page-nav clearfix">
                                    <?php if(function_exists('wp_pagenavi')) { wp_pagenavi(); }
                                    else { ?>
                                         <?php get_template_part('includes/navigation'); ?>
                                    <?php } ?>
                                </div> <!-- end .entry -->
                            <?php else : ?>
                                <?php get_template_part('includes/no-results'); ?>
                            <?php endif; wp_reset_query(); ?>
                        </div> <!-- end #et_pt_blog -->
                    </article> <!-- .entry -->

                <?php endwhile; ?>

                </div>     <!-- end #left-area -->
            </div> <!-- #content -->

            <?php if ( ! $fullwidth ) get_sidebar(); ?>
        </div> <!-- .main-content-wrap -->

        <?php get_template_part( 'includes/footer-banner', 'page' ); ?>
    </div> <!-- #main-content -->

<?php get_footer(); ?>

Am I doing anything wrong?
btw here the page it should be making a difference to again: http://www.muslimahwebdesign.co.uk/dage_boutique/?post_type=product

This code is different from what you posted previously - is this a different page? In any case, according to the instructions, you should replace the contents of the div#left-area with the call to woocommerce_content, like this:


<div id="left-area">

    <?php woocommerce_content(); ?> // All code inside the div replaced with this line

</div>     <!-- end #left-area -->

it’s the same page but I only pasted the code that cam after the if have posts part at first then posted the whole page incase I got something else wrong.

So what your saying above and having a look at the code it seem that the left area div comes before a " while " instead of " if " like this:

<div id="left-area">

				<?php while ( have_posts() ) : the_post(); ?>

so should I be long at this one instead of the <?php if ( have_posts() ) :

Looking at the code you posted, it seems the right place to put it, as I’m guessing the idea is to keep the template (header, footer, sidebar etc) and just replace the main content with the output from woocommerce. I’d give it a try and see if it gets you the result you’re after.

ahh I see, so I replaced it all up till the ending div but everything is still the same.

Here’s my code:

<?php
/*
Template Name: Blog Page
*/
?>
<?php
$et_ptemplate_settings = array();
$et_ptemplate_settings = maybe_unserialize( get_post_meta( get_the_ID(), 'et_ptemplate_settings', true ) );

$fullwidth = isset( $et_ptemplate_settings['et_fullwidthpage'] ) ? (bool) $et_ptemplate_settings['et_fullwidthpage'] : false;

$et_ptemplate_blogstyle = isset( $et_ptemplate_settings['et_ptemplate_blogstyle'] ) ? (bool) $et_ptemplate_settings['et_ptemplate_blogstyle'] : false;

$et_ptemplate_showthumb = isset( $et_ptemplate_settings['et_ptemplate_showthumb'] ) ? (bool) $et_ptemplate_settings['et_ptemplate_showthumb'] : false;

$blog_cats = isset( $et_ptemplate_settings['et_ptemplate_blogcats'] ) ? (array) array_map( 'intval', $et_ptemplate_settings['et_ptemplate_blogcats'] ) : array();
$et_ptemplate_blog_perpage = isset( $et_ptemplate_settings['et_ptemplate_blog_perpage'] ) ? (int) $et_ptemplate_settings['et_ptemplate_blog_perpage'] : 10;
?>
<?php get_header(); ?>

<?php
$featured_image = false;

if ( '' != get_the_post_thumbnail() ) :
	$featured_image = true;
?>
<div class="post-thumbnail">
	<div class="container">
		<h1 class="post-heading"><?php the_title(); ?></h1>
	</div> <!-- .container -->
</div> <!-- .post-thumbnail -->
<?php endif; ?>

<div class="page-wrap container<?php if ( $fullwidth ) echo ' fullwidth'; ?>">
	<div id="main-content">
		<div class="main-content-wrap clearfix">
			<div id="content">
				<?php get_template_part( 'includes/breadcrumbs', 'index' ); ?>

				<div id="left-area">

				<?php while ( have_posts() ) : the_post(); ?>

					<article class="entry-content clearfix">
					<?php if ( ! $featured_image ) : ?>
						<h1 class="main-title"><?php the_title(); ?></h1>
					<?php endif; ?>
					<?php
						the_content();

						wp_link_pages( array( 'before' => '<div class="page-links">' . __( 'Pages:', 'Nexus' ), 'after' => '</div>' ) );
					?>

						<div id="et_pt_blog" class="responsive clearfix">
							<?php $cat_query = '';
							if ( !empty($blog_cats) ) $cat_query = '&cat=' . implode(",", $blog_cats);
							else echo '<!-- blog category is not selected -->'; ?>
							<?php
								$et_paged = is_front_page() ? get_query_var( 'page' ) : get_query_var( 'paged' );
							?>
							<?php query_posts("posts_per_page=$et_ptemplate_blog_perpage&paged=" . $et_paged . $cat_query); ?>
							   <?php woocommerce_content(); ?>

                </div>     <!-- end #left-area -->
            </div> <!-- #content -->

            <?php if ( ! $fullwidth ) get_sidebar(); ?>
        </div> <!-- .main-content-wrap -->

        <?php get_template_part( 'includes/footer-banner', 'page' ); ?>
    </div> <!-- #main-content -->

<?php get_footer(); ?>

Sorry, I guess I didn’t explain very well… what I think your file should look like is this:


<?php
/*
Template Name: Blog Page
*/
$et_ptemplate_settings = array();
$et_ptemplate_settings = maybe_unserialize( get_post_meta( get_the_ID(), 'et_ptemplate_settings', true ) );

$fullwidth = isset( $et_ptemplate_settings['et_fullwidthpage'] ) ? (bool) $et_ptemplate_settings['et_fullwidthpage'] : false;

$et_ptemplate_blogstyle = isset( $et_ptemplate_settings['et_ptemplate_blogstyle'] ) ? (bool) $et_ptemplate_settings['et_ptemplate_blogstyle'] : false;

$et_ptemplate_showthumb = isset( $et_ptemplate_settings['et_ptemplate_showthumb'] ) ? (bool) $et_ptemplate_settings['et_ptemplate_showthumb'] : false;

$blog_cats = isset( $et_ptemplate_settings['et_ptemplate_blogcats'] ) ? (array) array_map( 'intval', $et_ptemplate_settings['et_ptemplate_blogcats'] ) : array();
$et_ptemplate_blog_perpage = isset( $et_ptemplate_settings['et_ptemplate_blog_perpage'] ) ? (int) $et_ptemplate_settings['et_ptemplate_blog_perpage'] : 10;

get_header();

$featured_image = false;

if ( '' != get_the_post_thumbnail() ) :
	$featured_image = true;
?>
<div class="post-thumbnail">
	<div class="container">
		<h1 class="post-heading"><?php the_title(); ?></h1>
	</div> <!-- .container -->
</div> <!-- .post-thumbnail -->
<?php endif; ?>

<div class="page-wrap container<?php if ( $fullwidth ) echo ' fullwidth'; ?>">
	<div id="main-content">
		<div class="main-content-wrap clearfix">
			<div id="content">
				<?php get_template_part( 'includes/breadcrumbs', 'index' ); ?>

				<div id="left-area">

                    <?php woocommerce_content(); ?>

                </div>     <!-- end #left-area -->
            </div> <!-- #content -->

            <?php if ( ! $fullwidth ) get_sidebar(); ?>
        </div> <!-- .main-content-wrap -->

        <?php get_template_part( 'includes/footer-banner', 'page' ); ?>
    </div> <!-- #main-content -->

<?php get_footer(); ?>

Ah I see what you mean, so I tried that but no change still.

Are you saying you edit that file but the page doesn’t change at all? Maybe you’re editing the wrong file, or a plugin isn’t activated.