Thanks! Thanks for your help!
That worked! Thank you! My code may not be as elegant as it should be. Here is what I did:
<?php if( have_rows('slider') ): ?>
<?php while( have_rows('slider') ): the_row();
$image = get_sub_field('slide');
$rows = get_field('slider', false, false); // get all the rows
$first_row = $rows[0]; // get the first row
$first_row_image = $first_row['slide']; // get the sub field value
?>
<div class="mobile-bg visible-xs" style="background-image:<?php echo $image['url']; ?>"></div><!-- end mobile-bg -->
<?php break; ?>
<?php endwhile; ?>
<?php endif; ?>
I am open to suggestions to make my code better.
Thanks again!
Thanks! I am not quite following how to integrate this with the demo code for finding the first row of a repeater field found here:
This is the code I have so far but I am not getting the image url to echo into the inline style for background-image on the mobile-bg div.
<?php
$rows = get_field('slider'); // get all the rows
$first_row = $rows[0]; // get the first row
$first_row_image = $first_row['slide']; // get the sub field value
// Note
// $first_row_image = 123 (image ID)
$image = wp_get_attachment_image_src( $first_row_image, 'full' );
// url = $image[0];
// width = $image[1];
// height = $image[2];
?>
<div class="mobile-bg visible-xs" style="background-image:<?php echo $image[0]; ?>"></div><!-- end mobile-bg -->
I don’t think I need this code $image = wp_get_attachment_image_src( $first_row_image, 'full' ); but I don’t know what to put in its place.
Thanks!
I was afraid that was the answer. Thanks!
I am not sure that it is any certain custom fields causing the issue because it is happening on multiple sites which have different field groups. I don’t know what other information to give you. I would love to help but I don’t know what else to tell you at this moment.
Thanks!
Sorry the code didn’t show up correctly.
<?php
// args
$args = array(
'numberposts' => -1,
'posts_per_page' => -1,
'post_type' => 'staffinfo',
'meta_query' => array(
'relation' => 'AND',
array(
'meta_key' => 'class_level',
'meta_value' => 'administration',
'compare' => '='
),
array(
'meta_key' => 'class_level',
'meta_value' => 'high',
'compare' => '='
)
)
);
// get results
$the_query = new WP_Query( $args );
$i = 1;
// The Loop
?>
<?php if( $the_query->have_posts() ): ?>
<?php while ( $the_query->have_posts() ) : $the_query->the_post(); ?>
<div class="staff-member">
<img src="<?php echo get_field('staff_photo'); ?>" alt="<?php echo get_field('staff_member_name'); ?>" />
<div class="staff-info">
<span class="teacher-name"><?php echo get_field('staff_member_name'); ?></span><br />
<span class="duties"><?php echo get_field('classes_taught'); ?></span><br />
<?php if (get_field('email_address')) {?>
<a href="mailto:<?php echo get_field('email_address'); ?>"><?php echo get_field('email_address'); ?></a><br />
<?php } ?>
<?php echo $phone ?>
<?php if ( get_field('phone_extension')) {?>
- Ext. #<?php echo get_field('phone_extension'); ?>
<?php } ?>
</div><!--end staff-info -->
</div><!-- end staff-member -->
<?php if ($i % 5 == 0) { echo "<div class='clearboth'></div>"; } $i++; ?>
<?php endwhile; ?>
<?php endif; ?>
<?php wp_reset_query(); // Restore global post data stomped by the_post(). ?>
I was able to fix it!
I changed my code to:
<?php $args = array( 'posts_per_page' => -1, 'post_type' => 'siteinfo' );
$myposts = get_posts( $args );
foreach ( $myposts as $post ) : setup_postdata( $post );
$phone = get_field('phone_number'); ?>
<div class="phone">
<p><img class="phone-img" src="<?php bloginfo('template_directory'); ?>/images/phone.png" alt="<?php bloginfo('name'); ?>" /><span><?php echo $phone; ?></span></p>
</div><!--end.phone-->
<?php endforeach;
wp_reset_postdata();?>
Thanks for your help!
I fixed that but I am still getting this error:
Fatal error: Call to a member function have_posts() on a non-object in /home/senroctech/public_html/wp-content/themes/Senroc/banner-cat.php on line 66
line 66 is this line of code:
if ( $posts->have_posts() ) : while ( $posts->have_posts() ) : $posts->the_post(); ?>
Yes, the page breaks after the navigation at the top of the page.
Now I have this error showing up where the page breaks:
“Fatal error: Call to a member function have_posts() on a non-object in /home/senroctech/public_html/wp-content/themes/Senroc/banner-cat.php on line 66”
Here is my code where the page breaks:
<?php $posts = get_posts(array(
'post_type' => 'siteinfo',
'posts_per_page' => -1
));
$phone = get_field('phone_number');
if ( $posts->have_posts() ) : while ( $posts->have_posts() ) : $posts->the_post();
<div class="phone">
<p><img class="phone-img" src="<?php bloginfo('template_directory'); ?>/images/phone.png" alt="<?php bloginfo('name'); ?>" /><span><?php echo $phone; ?></span></p>
</div><!--end.phone-->
<?php endwhile;
endif; ?>
I tried a couple of things but neither worked. First I just removed the setup_postdata($post); from the code but in doing that the page looked the same.
Next I tried the following code:
<header>
<!--logo/nav/social-->
<div class="container">
<!--logo-->
<a class="logo" href="<?php bloginfo('url'); ?>">
<img class="logo" src="<?php bloginfo('template_directory'); ?>/images/logo.png" alt="<?php bloginfo('name'); ?>" />
</a>
<?php include(TEMPLATEPATH . '/nav.php'); ?>
<div class="social">
<a class="facebook" href="#" target="_blank"><img src="<?php bloginfo('template_directory'); ?>/images/facebook.png" alt="<?php bloginfo('name'); ?>" /></a>
<a class="twitter" href="#" target="_blank"><img src="<?php bloginfo('template_directory'); ?>/images/twitter.png" alt="<?php bloginfo('name'); ?>" /></a>
<a class="youtube" href="#" target="_blank"><img src="<?php bloginfo('template_directory'); ?>/images/youtube.png" alt="<?php bloginfo('name'); ?>" /></a>
<a class="linkedin" href="#" target="_blank"><img src="<?php bloginfo('template_directory'); ?>/images/linkedin.png" alt="<?php bloginfo('name'); ?>" /></a>
</div><!--end.social-->
<div class="clear"></div>
<!--mobile header-->
<div class="phone-nav visible-phone visible-tablet">
<div class="mobile-phone visible-phone visible-tablet">
<?php $posts = get_posts(array(
'post_type' => 'siteinfo',
'posts_per_page' => -1,
'orderby'=> 'ID',
'order' => 'ASC'
));
if ( $posts->have_posts() ) : while ( $posts->have_posts() ) : $posts->the_post();
$phone = get_field('phone_number'); ?>
<a class="phone-btn" href="tel:1-<?php echo $phone; ?>"><img class="phone-icon" src="<?php bloginfo('template_directory'); ?>/images/white-phone.png" alt="menu" /><?php echo $phone; ?></a>
</div>
<div class="mobile-menu visible-phone visible-tablet"><a id="responsive-menu-button" href="#sidr-main"><img class="menu-icon" src="<?php bloginfo('template_directory'); ?>/images/menu-icon.png" alt="menu" />Main Menu</a></div>
</div>
</div><!--end.container-->
<div class="mobile-back"></div>
</header>
<div class="phone-google">
<div class="container">
<div class="phone">
<p><img class="phone-img" src="<?php bloginfo('template_directory'); ?>/images/phone.png" alt="<?php bloginfo('name'); ?>" />
<span><?php echo $phone; ?></span></p>
</div><!--end.phone-->
<?php endwhile; // end of the loop.
endif; ?>
<div class="g-plusone" data-size="large"></div>
<!-- Place this tag after the last +1 button tag. -->
<script type="text/javascript">
(function() {
var po = document.createElement('script'); po.type = 'text/javascript'; po.async = true;
po.src = 'https://apis.google.com/js/plusone.js';
var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(po, s);
})();
</script>
</div><!--end.container-->
</div><!--end.phone-google-->
But that made everything below the navigation disappear.
Can you see anything else I may be doing wrong?
Thanks!
Hi @elliot,
I have checked the documentation and am unable to get my images to show up. The code in my template looks like this:
<div id="homeslide" class="flexslider">
<ul class="slides">
<?php
$args = array(
'post_type' => 'homeslider',
'posts_per_page' => -1,
'orderby'=> 'ID',
'order' => 'ASC'
);
$loop = new WP_Query( $args );
if( $loop->have_posts() ):
while ( $loop->have_posts() ) : $loop->the_post();
$size = "full"; // (thumbnail, medium, large, full or custom size)
$image = wp_get_attachment_image_src( $attachment_id, $size );
// url = $image[0];
// width = $image[1];
// height = $image[2];
// while(has_sub_field('slide_image')): ?>
<?php //$post_objects = get_sub_field('items'); ?>
<li>
<div class="slidetext">
<div class="headline"><h2><?php the_field('header_text'); ?></h2></div><!-- end headline -->
<div class="phototext"><?php the_field('small_text_under_header'); ?></div><!-- end phototext -->
</div><!-- end slidetext -->
<?php $attachment_id = get_field('slide_image'); ?>
<img class="image-class" alt="" src="<?php echo $image[0]; ?>" />
</li>
<?php endwhile; ?>
<?php endif; ?>
<?php wp_reset_query(); ?>
</ul>
</div>
When looking at the source code on the page it looks like this:
<div id="homeslide" class="flexslider">
<ul class="slides">
<li>
<div class="slidetext">
<div class="headline"><h2></h2></div><!-- end headline -->
<div class="phototext"></div><!-- end phototext -->
</div><!-- end slidetext -->
<img class="image-class" alt="" src="" />
</li>
<li>
<div class="slidetext">
<div class="headline"><h2></h2></div><!-- end headline -->
<div class="phototext"></div><!-- end phototext -->
</div><!-- end slidetext -->
<img class="image-class" alt="" src="" />
</li>
</ul>
</div>
I have 2 images added and I see in the source that there are 2 rows but nothing is populating the rows.
Here are screenshots showing how I have the custom fields set up:
Any idea what I am doing wrong?
Hi @elliot,
If I use an advanced image field or sub field how do I get the correct image size to be pulled in? I wanted to have the ability to select a pre-set size because my client is very computer illiterate and I need to make this as simple as possible.
This shows what my media uploader looks like when using it with my custom post type:
This is what I want it to look like:
This is what is missing:
