Add the hex value as background color in a custom column

• mikemikelle07

• November 12, 2021 at 2:43 pm

Hello there, I want to include the value of hex color as background in a custom column.

my code.

add_filter( 'manage_pages_columns', 'background_add_custom_column' );
add_filter( 'manage_posts_columns', 'background_add_custom_column' );
function background_add_custom_column( $columns ) {
    $columns['colors'] = 'Colors';
    return $columns;
}

add_action( 'manage_pages_custom_column' , 'background_add_custom_column_data', 10, 2);
add_action( 'manage_posts_custom_column' , 'background_add_custom_column_data', 10, 2);
function background_add_custom_column_data( $column, $post_id ) {
    switch ( $column ) {
        case 'colors' :
           if( have_rows('colors') ):
                while ( have_rows('colors') ) : the_row();
            $hex_color = get_sub_field('hex_color'); ?>
        <p style="background-color:"><?php echo $hex_color;?></p>
<?php endwhile; endif;
break;
    }
}

This function print the value of hex color ex #172d9b but I want exactly to make it fill out as a background color, instead of printing out the value of hex. The inspect show me that the background color is an invalid properly data.

I wonder what I am doing wrong. 🙁

Kind regards,
Mike

• mikemikelle07

• November 12, 2021 at 3:10 pm

I play a lot with the code and I feel that I had the results that I want.

add_action( 'manage_pages_custom_column' , 'background_add_custom_column_data', 10, 2 );
add_action( 'manage_posts_custom_column' , 'background_add_custom_column_data', 10, 2 );
function background_add_custom_column_data( $column, $post_id ) {
    switch ( $column ) {
        case 'colors' :
           if( have_rows('colors') ):
            while ( have_rows('colors') ) : the_row(); ?>
        <div style="background-color:<?php the_sub_field('hex_color');?>;">
        <div style="width:80px;height:80px;"></div>
<?php
    endwhile;
    endif;
    break;
    }

}