Using ACF on the Shop Page

• chrislemmer

• March 4, 2019 at 10:49 pm

Hey there,

I have the following snippet for building a bootstrap 4 slider on normal pages using repeater fields.

The snippet works perfectly on normal pages.

<?php if( have_rows('page_sliders') ): ?>

	<div id="carouselControls" class="carousel slide" data-ride="carousel">
		<div class="carousel-inner">
			<?php while( have_rows('page_sliders') ): the_row(); 
				// vars
				$image = get_sub_field('slide_image');
				$link = get_sub_field('slide_image_url');
				$row = get_field('page_sliders');
				$rows = count($row);
				?>
                <div class="carousel-item <?php if (get_row_index() == 1) echo "active"; ?>">
					<?php if( $link ): ?>
						<a href="<?php echo $link['url']; ?>">
					<?php endif; ?>
						<img src="<?php echo esc_url($image['url']) ?>" alt="<?php echo $image['alt'] ?>" />
					<?php if( $link ): ?>
						</a>
					<?php endif; ?>
				</div>
			<?php endwhile; ?>
			<?php if ($rows > 1): ?>
                <a class="carousel-control-prev" href="#carouselControls" role="button" data-slide="prev">
                    <span class="carousel-control-prev-icon" aria-hidden="true"></span>
                    <span class="sr-only">Previous</span>
                </a>
                <a class="carousel-control-next" href="#carouselControls" role="button" data-slide="next">
                    <span class="carousel-control-next-icon" aria-hidden="true"></span>
                    <span class="sr-only">Next</span>
                </a>
            <?php endif; ?>
		</div>
	</div>

<?php endif; ?>

I want to make this snippet work on the WooCommerce main shop page as well.

My website home page is the shop page. I’m struggling to access the variables on the archive page.

Could anyone please assist?

Kind regards
Chris

• chrislemmer

• March 4, 2019 at 10:57 pm

Never mind, solved it.

For anyone else with the same issue, here is how to do it.

<?php
	
	if ( is_shop() ){
		$page_id = get_option( 'woocommerce_shop_page_id' ); 
	}
	else {
		$page_id = get_the_ID();
	}

if( have_rows('page_sliders', $page_id) ): ?>

	<div id="carouselControls" class="carousel slide" data-ride="carousel">
		<div class="carousel-inner">
			<?php while( have_rows('page_sliders', $page_id) ): the_row(); 
				// vars
				$image = get_sub_field('slide_image', $page_id);
				$link = get_sub_field('slide_image_url', $page_id);
				$row = get_field('page_sliders', $page_id);
				$rows = count($row);
				?>
                <div class="carousel-item <?php if (get_row_index() == 1) echo "active"; ?>">
					<?php if( $link ): ?>
						<a href="<?php echo $link['url']; ?>">
					<?php endif; ?>
						<img src="<?php echo esc_url($image['url']) ?>" alt="<?php echo $image['alt'] ?>" />
					<?php if( $link ): ?>
						</a>
					<?php endif; ?>
				</div>
			<?php endwhile; ?>
			<?php if ($rows > 1): ?>
                <a class="carousel-control-prev" href="#carouselControls" role="button" data-slide="prev">
                    <span class="carousel-control-prev-icon" aria-hidden="true"></span>
                    <span class="sr-only">Previous</span>
                </a>
                <a class="carousel-control-next" href="#carouselControls" role="button" data-slide="next">
                    <span class="carousel-control-next-icon" aria-hidden="true"></span>
                    <span class="sr-only">Next</span>
                </a>
            <?php endif; ?>
		</div>
	</div>

<?php endif; ?>

Kind regards
Chris