0

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

7
  • What is the error? Turn on debug and then post the error here. wordpress.org/support/article/debugging-in-wordpress
    – shanebp
    Aug 10, 2020 at 15:14
  • I would avoid declaring functions inside other functions, it has no benefits and can make debugging difficult. It's easily fixed by moving the function out of the functiion and keeping the same name
    – Tom J Nowell
    Aug 10, 2020 at 16:08
  • I'm already on debug mode, I have only this error "a critical error has occurred on your site, Learn more about debugging WordPress." bit.ly/3fFRC3r
    – imagIne
    Aug 10, 2020 at 16:09
  • Also, why not do this via CSS? If you use the post_class API it will output HTML classes for every tag and category that you can then pick up using CSS to set the colour. There's no need to manually insert inline CSS styling on the fly
    – Tom J Nowell
    Aug 10, 2020 at 16:10
  • Tom, I tried to use the function outside foreach but I can't get wp_get_post_categories( $post->ID ). If it's possible how can I do that?
    – imagIne
    Aug 10, 2020 at 16:14

1 Answer 1

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.

7
  • Tom. I appreciate this option but I don't imagine create a post_class for each shop. I foresee about 5 categories for each of the 220 businesses. I'm creating all categories and attribute each of them inside each post , I can't imagine to recreate all specific post_class for each business. even if it's only half of them which have the same list of categories .
    – imagIne
    Aug 10, 2020 at 16:49
  • Why not? You're only setting the background colour of 4 categories, so that's only 4 CSS rules to create. You don't have to add or create any new categories or content that isn't already there. I think you've misunderstood. I don't understand why the number of business is relevant. Your test function checks if a post is inside one of 4 categoriies, this answer also does that, but it uses CSS not PHP to do it. Instead of using an inline style applied to posts that have 1 of 4 category IDs, it uses a CSS rule to posts that have 1 of 4 HTML classes
    – Tom J Nowell
    Aug 11, 2020 at 8:28
  • I will inquire about post_class. But for the moment with this page (developer.wordpress.org/reference/functions/post_class) and your indications I do not see how to recover the categories of each article in post_class dynamically? do you have an example?
    – imagIne
    Aug 11, 2020 at 9:19
  • How I associate a class from post_class to a category ? no example shows this
    – imagIne
    Aug 11, 2020 at 9:35
  • Tom, thanks so much for your time and answer. thanks to others too. sorry to be careless and novice. the problem come from the function. I call this inside foreach loop instead of outside.
    – imagIne
    Aug 11, 2020 at 10:25

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.