[Resolved] Is it possible to change color of a numerical output if the result is negative?

[Author]

Posts

[dbarber]

Hi there, this question follows on the discussion I started over here: https://toolset.com/forums/topic/need-to-limit-the-number-of-digits-output-from-a-calculation/#post-173568.

And I'm wondering if there's a way to output a negative calculation with a different color (red)?

[Luo Yang Supporter Languages: English (English ) Chinese (Simplified) (简体中文 ) Timezone: Asia/Hong_Kong (GMT+08:00)]

Hi dbarber,

Could you describe more details for the question?
What is the negative calculation with a different color (red)?

[dbarber]

Hi Luoy

What I'm hoping to be able to achieve is to automatically change the color of any calculation that's less than 0.00% to red.

Please see attached image.

Cheers

Dawson

[Luo Yang Supporter Languages: English (English ) Chinese (Simplified) (简体中文 ) Timezone: Asia/Hong_Kong (GMT+08:00)]

I assume you are using such a custom shortcode in your theme/functions.php:
https://toolset.com/forums/topic/need-to-output-some-text-depending-on-the-output-of-a-calculation/#post-174033

...
add_filter('number_format_filter', 'number_format_filter_func');
function number_format_filter_func($v)
{
    return $res = number_format($v, 2);
}
 ...

Please modify it like this:

...
add_filter('number_format_filter', 'number_format_filter_func');
function number_format_filter_func($v)
{
   $class = "my-normal";
   if($v<0)$class = "my-red";
    return $res = '<div class="' . $class . '">' . number_format($v, 2) . '</div>';
}
 ...

Add CSS code in your theme/style.css

div.my-red{
color: red;
}

[dbarber]

Sorry, Luoy, I was referring to this post: https://toolset.com/forums/topic/need-to-limit-the-number-of-digits-output-from-a-calculation/

[Luo Yang Supporter Languages: English (English ) Chinese (Simplified) (简体中文 ) Timezone: Asia/Hong_Kong (GMT+08:00)]

I suggest you try refer to the thread:
https://toolset.com/forums/topic/need-to-output-some-text-depending-on-the-output-of-a-calculation/#post-174033

modify it like this:

add_shortcode('wpv-calculate', 'calculate_shortcode');
function calculate_shortcode($atts) {
    extract( shortcode_atts( array(
          'evaluate' => '',
          'format_filter' => 'number_format_filter'
     ), $atts ) );
    $res = wpv_condition($atts);
    $res = apply_filters($format_filter, $res);
    return $res;
}
 
add_filter('number_format_filter', 'number_format_filter_func');
function number_format_filter_func($v)
{
    add_filter('number_format_filter', 'number_format_filter_func');
function number_format_filter_func($v)
{
   $class = "my-normal";
   if($v<0)$class = "my-red";
    return $res = '<div class="' . $class . '">' . number_format($v, 2) . '</div>';
}
}
 
add_filter('compare_format_filter', 'compare_format_filter_func');
function compare_format_filter_func($v)
{
    $res = 'C';
    if($v<18)$res= 'A';
    if($v>18 && $v<22)$res= 'B';
    //here you can add more conditions
    return $res;
}

Add CSS code in your theme/style.css
div.my-red{
color: red;
}

[dbarber]

Hi Luoy

Thanks very much for this. Unfortunately, the modified code seems to create an issue for the theme I'm using (Pagelines DMS): the front end page editor will not allow the page to load.

I've tried deactivating all plugins (except Toolset) and get the same result. I've tried on a couple of sites using Pagelines DMS and it happened on both of them.

No sure if there's an alternative approach, but, nevertheless, I really appreciate all of your help.

Dawson

[dbarber]

Hey Luoy

How would I go about adding a second evaluation (on the same site) that functions basically the same way but uses different thresholds to determine which text is output.

So basically what I'm hoping to be able to do is have two distinct evaluations done so that I can apply them separately.

I tried to figure something out on my own (I basically just copied/pasted part of the code from above and then modified it a little), but just caused the site to go blank.

Here's what I did (it should make it clear what I need to be able to do):

add_filter('compare_firstone_format_filter', 'compare_firstone_format_filter_func');
function compare_firstone_format_filter_func($v)
{
    $res = 'A';
    if($v<18)$res= 'B';
    if($v>22)$res= 'C';
    //here you can add more conditions
    return $res;
}

add_filter('compare_secondone_format_filter', 'compare_secondone_format_filter_func');
function compare_secondone_format_filter_func($v)
{
    $res = 'A';
    if($v<14)$res= 'B';
    if($v>21)$res= 'C';
    //here you can add more conditions
    return $res;
}

And here's what I did with the shortcodes:

[wpv-calculate evaluate="[types field="detached-sales-current" id="$market-updates"][/types] / [types field="detached-active-listings-current" id="$market-updates"][/types] * 100 " format_filter="compare_firstone_format_filter"]

[wpv-calculate evaluate="[types field="detached-sales-current" id="$market-updates"][/types] / [types field="detached-active-listings-current" id="$market-updates"][/types] * 100 " format_filter="compare_secondone_format_filter"]

I'll continue to try to figure this out, but would really appreciate your help.

Many thanks

Dawson

[Luo Yang Supporter Languages: English (English ) Chinese (Simplified) (简体中文 ) Timezone: Asia/Hong_Kong (GMT+08:00)]

Dawson. sorry,
Please modify the php codes in your theme/functions.php as this:

add_shortcode('wpv-calculate', 'calculate_shortcode');
function calculate_shortcode($atts) {
    extract( shortcode_atts( array(
          'evaluate' => '',
          'format_filter' => 'number_format_filter'
     ), $atts ) );
    $res = wpv_condition($atts);
    $res = apply_filters($format_filter, $res);
    return $res;
}
  
add_filter('number_format_filter', 'number_format_filter_func');
function number_format_filter_func($v)
{
   $class = "my-normal";
   if($v<0)$class = "my-red";
    return $res = '<div class="' . $class . '">' . number_format($v, 2) . '</div>';
}
  
add_filter('compare_format_filter', 'compare_format_filter_func');
function compare_format_filter_func($v)
{
    $res = 'C';
    if($v<18)$res= 'A';
    if($v>18 && $v<22)$res= 'B';
    //here you can add more conditions
    return $res;
}

Add CSS code in your theme/style.css
div.my-red{
color: red;
}

[dbarber]

Hi Luoy

I realized that I haven't done a good job asking for help because I have a few support threads open that I realized cannot be resolved independent of one another so I decided to start a fresh thread that combines all them.

Here's the new "all in one" thread: https://toolset.com/forums/topic/need-to-perform-4-different-calculations-on-the-same-website/

I really appreciate your excellent support and apologize for having taken up your time. I should have thought this through more fully before asking for assistance.

Cheers

Dawson

[Luo Yang Supporter Languages: English (English ) Chinese (Simplified) (简体中文 ) Timezone: Asia/Hong_Kong (GMT+08:00)]

I have taken the thread you mentioned above