I want to display ACF Flexible content in all single posts on an archive page. Currently the following code on my Archive page displays only the last posts Flexible content. I would like to display all posts using flexible content on an archive page.
Any help would be much appreciated.
<?php
if( have_rows('fabric') ):
while ( have_rows('fabric') ) : the_row();
?>
<div class="sales-wrap-info-single">
<?php if( get_sub_field('image') ): ?>
<img src="<?php the_sub_field('image'); ?>" />
<? endif ?>
</div>
<?php
endwhile;
else :
// no rows found
endif;
?>
Related
I am trying to create my own Wordpress theme with assistance of Advanced Custom Fields. I have run into an issue that I cannot find the answer for.
I am trying to create a loop of images and text where the image is a thumbnail that when clicked shows full size through the usage of magnific popup. I can get the images to display statically without the lightbox effect but not with it. From the following code it only produces the link:
<?php
if( have_rows('content') ):
while ( have_rows('content') ) : the_row(); ?>
<div class="loopcontainer">
<?php if( get_row_layout() == 'text_with_image' ): ?>
<?php
$images = the_sub_field('text_image');
if( !empty( $images ) ): ?>
<a class="post-img" href="<?php echo $images['sizes']['blog-large'];?>">
<img src="<?php echo $images['sizes']['blog-small'];?>" class="img-fluid img-thumbnail">
</a>
<?php endif; ?>
<?php endif;
endwhile;
else :
endif; ?>
How would I go around getting the lightbox effect to work within this Flexible Content solution? And where am I going wrong?
Thanks!
I'm creating a portfolio page using "WordPress posts" (this is so it spits out single.php pages nicely for me) using PHP and ACF. I'm trying to find a way to put each "category" in its own div. This would allow me to style the layout of the content within each filter. Please see the example below. Maybe I should be doing this a different way?
• Filter 1 - 1 column layout
• Filter 2 - 3 column layout
example of filter 1
example of filter 2
TLDR: Trying to put the content of each WordPress category in its own div.
<div class="work">
<?php if (has_post_thumbnail() ): ?>
<a href="<?php the_permalink(); ?>" class="blogimage">
<?php the_post_thumbnail( 'medium' ); ?>
</a>
<?php endif; ?>
<div class="work-copy">
<div class="category">
<?php echo get_the_category_list(); // Display categories as links within ul ?>
</div>
<h2 class="headline">
<?php the_title(); ?><i class="fal fa-chevron-right"></i>
</h2>
</div>
</div>
<?php endwhile; ?>
WordPress automatically adds CSS classes to different elements throughout your website. These include both the body class and the post class.
For example, if you view a category archive page and then use the Inspect Tool, you will notice category and category-name CSS classes in the body tag.
Category class added to body element by WordPress
You can use this CSS class to style each individual category differently by adding custom CSS.
You can find more details here
Quite a simple fix after doing some research, here is the answer I found useful;
<?php $category = get_the_category(); ?>
<div class="category-<?php echo $category[0]->slug ?>">
Place this within each post. In order to style each div class individually, you need to place a containing div in between the if / while statement. Then you'll the place content of each "category filter" with the div.
<?php if ( have_posts() ) : // Do we have any posts in the database that match our query? ?>
<div class="work-container">
<?php while (have_posts()) : the_post(); ?> <!-- Finds the post -->
<?php $category = get_the_category(); ?>
<div class="category-<?php echo $category[0]->slug ?>"> <!-- This calls out the Category in the WP Post -->
<div class="work-group">
<?php if (has_post_thumbnail() ): ?>
<a href="<?php the_permalink(); ?>" class="blogimage">
<?php the_post_thumbnail( 'medium' ); ?>
</a>
<?php endif; ?>
</div>
</div>
<?php endwhile; ?>
</div>
<?php endif; ?>
This was answered here and with a bit of playing I got it to work, Hope this helps someone! Get the name of the first category
I have a custom post type called 'Projects' and I have added flexible field content to my single-projects.php. I'm trying to add a hero image for each project that sits in the main header.php as I want my hero image to sit behind the navigation. I have everything working but my hero image is displaying on CPT archive pages and CPT single pages but I just want to show the hero image on each project page.
in my header.php file I have:
<?php
// check if the flexible content field has rows of data
if( have_rows('project_flexible') ):
// loop through the rows of data
while ( have_rows('project_flexible') ) : the_row();
if( get_row_layout() == 'project_hero_image'):
$hero_image = get_sub_field('image'); ?>
<div class="hero-image"><img src="<?php echo $hero_image; ?>">
</div>
<?php
endif;
endwhile;
else :
// no layouts found
endif;
?>
maybe you could try this to only display on single page:
<?php
// check if the flexible content field has rows of data
if( have_rows('project_flexible') ):
// loop through the rows of data
while ( have_rows('project_flexible') ) : the_row();
if( get_row_layout() == 'project_hero_image'):
$hero_image = get_sub_field('image'); ?>
// Added this if statement
<?php if(is_single()){ ?>
<div class="hero-image"><img src="<?php echo $hero_image; ?>"></div>
<?php } ?>
<?php
endif;
endwhile;
else :
// no layouts found
endif;
?>
I realized my website (www.inunfuturoaprile.it) with a minimal Wordpress theme that does not include the category.php template. I have created the template by me: the goal was to get pages that display a list of the posts belonging to a specific category. Unfortunately, due to my scarce knowledge of php, the code does not seem to work properly: I only see one post per category (e.g. https://www.inunfuturoaprile.it/politica/).
Here's the category.php file code:
<?php
/**
* Template di Categoria
*/
get_header(); ?>
<div id="content">
<?php
// Check if there are any posts to display
if ( have_posts() ) : ?>
<?php
// Since this template will only be used for Design category
// we can add category title and description manually.
// or even add images or change the layout
?>
<h1><strong><?php single_cat_title(); ?></strong>: Elenco Articoli</h1>
<div class="entry">
<?php
// The Loop
while ( have_posts() ) : the_post(); ?>
<?php the_title(); ?> // <small><?php the_time('j F Y') ?></small>
<?php endwhile; // End Loop
else: ?>
<h2 class="center">Not Found</h2>
<p class="center">Sorry, but you are looking for something that isn't here.</p>
<?php endif; ?>
</div>
</div>
<?php get_footer(); ?>
Someone can help me? Thank you :)
I think your posts_per_page parameter is set to 1.
You can see other posts using pagination:
https://www.inunfuturoaprile.it/politica/page/2/
https://www.inunfuturoaprile.it/politica/page/3/
Check it on Settings->Reading page ( /wp-admin/options-reading.php), parameter "Blog pages show at most"
But it also can be set up somewhere in the theme code.
Changing it may affect your main page - since the main page shows only one post too.
So you can change it only on category.php page. Add this after get_header():
get_header();
global $wp_query;
$wp_query->set('posts_per_page', 10);
// or this - if you need no pagination at all:
// $wp_query->set('nopaging', true);
$wp_query->query($wp_query->query_vars); ?>
i am having a blog page in my website... There are different posts ... on left side blog image is displayed , on right side text is written..when i click on particular blog, the main page of that post appears with image on the top and text down the image.
The issue is that on my blog page the left side images are not displayed rather default image is displayed.. bt when i click on post.. the main page of that particular post is having image...
<div class="blog-img mainimg" style="">
<?php $blogmainimg = wp_get_attachment_image_src(get_post_thumbnail_id( $post->ID ), 'single-post-thumbnail' );?>
<?php if($blogmainimg[0] == '') : ?>
<img src="<?php bloginfo('template_url')?>/images/Noimg.png" />
<?php else : ?>
<?php the_post_thumbnail(); ?>
<?php endif; ?>
</div>
only "if" is working.... else is not working
on blog page, all the posts are having NOIMG.png.. which is wrong
???
Let's try a more simplified solution. This uses the has_post_thumbnail() to check if a featured image is specified, since you really do not need to utilize the wp_get_attachment_image_src() in the provided code.
<div class="blog-img mainimg" style="">
<?php if(has_post_thumbnail($post->ID)) : ?>
<?php the_post_thumbnail(); ?>
<?php else : ?>
<img src="<?php bloginfo('template_url')?>/images/Noimg.png" />
<?php endif; ?>
</div>
This uses has_post_thumbnail() to see if the post has one specified, if it does, it will display it uses the_post_thumbnail(). If not, it will revert to the default.
If this doesn't work, than it could be an issue of using the_post_thumbnail(), this would mostly depend on your loop that's displaying the blog posts. If that is the case, try this:
<div class="blog-img mainimg" style="">
<?php if(has_post_thumbnail($post->ID)) : ?>
<?php echo get_the_post_thumbnail( $post->ID, 'single-post-thumbnail' ); ?>
<?php else : ?>
<img src="<?php bloginfo('template_url')?>/images/Noimg.png" />
<?php endif; ?>
</div>
If this still does not solve the issue, please post the loop for your page as well, and I can further troubleshoot it.