issue with if/elseif in_array inside foreach loop display only one post

Question

I try to attribute a specific background-color to each post if one of categories of post corresponding to one category. My function works but is restricted to display only one post in result. If I delete this function, all post are displayed.

More informations :

On my page I have buttons to filter posts by category. if I click on once I display all post for this category. But each post contains several categories. I have selected some categories to attribute a background colors for each posts, but theses categories are different of the filters buttons.

Wordpress display this error "a critical error has occurred on your site, Learn more about debugging WordPress." after the first post displayed.

here is my entire code :

<?php

add_action('wp_ajax_nopriv_filter', 'filter_ajax');
add_action('wp_ajax_filter','filter_ajax');

function filter_ajax(){

$category = $_POST['category'];

$argsf = array(
    'post_type' => 'post',
    'posts_per_page' => -1,
    'order' => 'ASC'
);

if(isset($category)){
    $argsf['category__in'] = array($category);
}

$postsf = get_posts($argsf);    

if (!empty($postsf)) {
    foreach ($postsf as $post) {
        
        $link_post = get_permalink( $post->ID );
        $image_post = get_the_post_thumbnail_url( $post->ID, $size = 'large' );
        $item1 = get_post_meta($post->ID, 'item1', true);
        $item2 = get_post_meta($post->ID, 'item2', true);
        $item3 = get_post_meta($post->ID, 'item3', true);
        $item4 = get_post_meta($post->ID, 'item4', true);
        $title = get_the_title($post->ID); 
        $post_slug = $post->post_name;
        $cats_post = wp_get_post_categories( $post->ID );
        
        function test($cats_post){
            if (in_array("14", $cats_post)){ echo'#710000';}
            elseif(in_array("5", $cats_post)){ echo'#0a005d';}
            elseif(in_array("16", $cats_post)){ echo'#65a0e8';}
            elseif(in_array("13", $cats_post)){ echo'#90744b';}
        }
    
?>  
<div class="shop w-24 pb-1" style="height:320px; min-width:320px;">
    <div class="w-100 h-100 p-2">
            
        <div class=" " style="background-color:<?php test($cats_post); ?>">
            <div class="">
                <!--<div class="" title="Locer">
                <a href="<?= $item2; ?>"><i class="icofont-opposite "></i></a>
                </div>-->
                <div class="" title="something">
                    <a href="tel:<?= $item3; ?>"><i class="im im-phone"></i> </a>
                </div>
                <div class="">
                    <span><?= $item1; ?></span>
                </div> 
            </div>
            <span class="text-uppercase col-white tsh332 fwlr text-center" style="font-size:2rem;">
                <?= $title; ?>
            </span>
            <?php if ( metadata_exists( 'post', $post->ID , 'item4' ) ){ ?> 
                <div class="">
                    <div class="b-yellow b-100">
                        <span><?= $item4; ?> </span>
                    </div>
                </div>
            <?php } ?>
        </div>
                
    </div>
</div>
<?php  }  /* fin foreach */
    }  /* fin if  */
wp_reset_postdata();
die();
}

?>

I tried that but it doesn't work :

• get_the_category instead of wp_get_post_categories
• has_item instead of in_array

I don't know If I must use an other foreach loop and how !

thanks

Answer 1

There are several fatal assumptions here, and, a far better way to do it.

1. Declaring Functions inside Functions

This will cause a fatal error in a future version of PHP, makes it super difficult to debug. But worst, it's completely unnecessary.

This:

function foo () { 
    function bar () {
        //
    }
    bar();
}

Should just be this:

function bar() {
    //
}
function foo() {
    bar();
}

2. Comparing strings and numbers, with a fuzzy in_array

1 is not "1", but because the 3rd parameter was never set to true, 1 is "1". It's also true, and lots of other "truthy" values.

3. Relying on hardcoded magic values

Don't hardcode the category ID. If you delete it by accident and recreate it, the ID will change. If you migrate to a new site the ID will change. It's very easy to break.

If you can't let the user pick a term, at least use a known slug/name so it can be recreated/set.

4. Assuming the functions would return category IDs

wp_get_post_categories does not return category IDs or category names. It returns term objects. These objects contain names, descriptions, IDs, etc. I expect your code to be generating PHP warnings.

5. Hardcoding Inline Styles

You shouldn't use inline styles. Use HTML classes

The Correct Way To Do It

Use post_class to print out the posts html classes:

<div id="post-<?php the_ID(); ?>" <?php post_class(); ?>>

This gives you classes you can target with CSS for post type, tags, categories, ID, etc etc. It does this automatically, so you doon't have to tell it to add the class.

Here's an example from my own site:

<article id="post-931" class="post-931 post type-post status-publish format-standard has-post-thumbnail hentry category-development category-gutenberg tag-block-editor tag-comments tag-gutenberg tag-javascript tag-plugins tag-react tag-releases tag-wordpress">

post_class automatically generated those HTML classes for me, andif I added that post to a category named test, then category-test would appear on the frontend as a HTML class too.

So now you can target all posts in a category with a CSS file, resulting in nicer styling, smaller HTML, and easier to understand code, e.g.

.category-development { 
    background: red;
}

Now all posts I write in the development category have a red background.

Don't forget the body_class function too. It adds HTML classes for the template used, archives, etc

---

A final note, don't end your PHP files in ?>. It's not necessary and can actually cause an easily missed mistake with stray spaces aftering the closing tag breaking sites on older PHP versions.