Hello!
I have a masonry grid nearly complete for a client, you can see an example of it here: http://branchind.com/proofs/schmidtmankato/product/example-product/
I created a repeater field for the gallery and inside this repeater field I have two sub-fields: “Gallery Item” and “Wide Image”. The gallery item is a simple image field. Wide image is a true/false field. My intention is to give the user the ability to “tick” any of the photos of the gallery they’ve uploaded to designate them as a “wide” photo in the gallery (like this).
In my code I tried using a simple if/else statement, saying something like if “Wide Image” is selected, then display the photo in a div with a wide
class, if not then display it in the default way.
Despite this, the wrapping div never changes, so when I tell an image to be wide in the WP Admin area, it doesn’t get reflected in the template.
Here’s my code:
<!-- Masonry Gallery -->
<div class="well--gray">
<div class="row column">
<h3>Example Product Gallery</h3>
<div id="gallery-grid">
<?php if ( have_rows('prod_gallery') ): ?>
<div class="grid-sizer"></div>
<?php while ( have_rows('prod_gallery') ) : the_row(); ?>
<?php if ( get_field('prod_gallery_wide_image') ): ?>
<div class="gallery-grid-item-width2">
<img src="<?php the_sub_field('prod_gallery_item');?>" />
</div>
<?php else: ?>
<div class="gallery-grid-item">
<img src="<?php the_sub_field('prod_gallery_item');?>" />
</div>
<?php endif; ?>
<?php endwhile; ?>
<?php endif; ?>
</div> <!-- gallery grid -->
</div> <!-- row column -->
</div> <!-- gray well -->
I feel like my code is logical and should work. Am I missing something?
Here’s my CSS, too:
.grid-sizer { width: 33%; }
.gallery-grid-item {
width: 33%;
padding: 20px; }
.gallery-grid-item-width2 { width: 66%; }
Thanks!
You are using get_field and you should be using get_sub_field
<?php if ( get_sub_field('prod_gallery_wide_image') ): ?>
<div class="gallery-grid-item-width2">
<img src="<?php the_sub_field('prod_gallery_item');?>" />
</div>
<?php else: ?>
<div class="gallery-grid-item">
<img src="<?php the_sub_field('prod_gallery_item');?>" />
</div>
<?php endif; ?>
Sorry John, forgot to respond!
Yes, that was the error. Sometimes you just need a second pair of eyes π
Thanks!
You must be logged in to reply to this topic.
Welcome to the Advanced Custom Fields community forum.
Browse through ideas, snippets of code, questions and answers between fellow ACF users
Helping others is a great way to earn karma, gain badges and help ACF development!
βEver wondered when and why ACF uses JSON instead of the database? Check out our summary of the most recent session of ACF Chat Friday for the answer, and make sure to register for the next session.
— Advanced Custom Fields (@wp_acf) February 23, 2023
π https://t.co/3UtvQbDwNmhttps://t.co/wfFEVcXVKc
© 2023 Advanced Custom Fields.
We use cookies to offer you a better browsing experience, analyze site traffic and personalize content. Read about how we use cookies and how you can control them in our Cookie Policy. If you continue to use this site, you consent to our use of cookies.