Using Pods Data to Conditionally Format Column Background

  • Resolved frankiewebs

    (@frankiewebs)


    3 years, 10 months ago

    I currently a “Room” pod, as well as a “Status” pod, with a relationship set up between the two. On the front end, I display a grid of the Rooms and their associated statuses. I would like to conditionally change the background of each column (each column contains one room) based on the the room’s status (for example, green for “running” and red for “stopped”). Thanks in advance for your help!

Viewing 2 replies - 1 through 2 (of 2 total)
  • Plugin Author Jory Hogeveen

    (@keraweb)

    3 years, 10 months ago

    @frankiewebs
    There are many ways to do this, a few ideas:

    1. Classes
    Add classes to the container where you add the status.
    Then create these CSS classes and set the background you want.

    2. Inline (Pod templates)
    Add inline CSS in the container where you check the status type.
    This could be a bit difficult if you have more than 2 status types since you’ll need several IF statements.

    2. Inline (PHP templates)
    Add inline CSS in the container where you check the status type.
    You can simply do a PHP switch statement for this.

    Cheers, Jory

    Thread Starter frankiewebs

    (@frankiewebs)

    3 years, 10 months ago

    Thank you for the reply. For posterity, I’d like to share how I resolved this. I used a Pod template as you recommended. I set my IF statement to check for the field “related_status”, and for each value, set a div class. Then I put all the content inside the div (see below). Then, finally, I used CSS on the page itself to target the div class .stoppage and set background color along with some other stuff.

    [if field=”related_status” value=”457″]
    <div class=”stoppage”>
    <h3>{@name}</h3>
    CURRENT STATUS: {@related_status}<br>
    STOPPAGE CAUSE: {@stoppage_cause}
    PRODUCT: {@related_product}
    TEAM LEADER: {@team_leader}
    TIME IN CURRENT STATUS: 52:15
    </div>
    [/if]`

    • This reply was modified 3 years, 10 months ago by frankiewebs.
    • This reply was modified 3 years, 10 months ago by frankiewebs.
Viewing 2 replies - 1 through 2 (of 2 total)

The topic ‘Using Pods Data to Conditionally Format Column Background’ is closed to new replies.