Display record information in a card

This article will explain how to display record detail information in a nice card using the HTML component.

First, we'll add an HTML component to a details page.

Next, we'll select the field we want to display in the card component as shown in the image below.

Now in the following HTML code replace "{Job Name}" with your Field Variable.

<div class="af-card-component shadow-1x">
    <div class="card-inner">
        <div class="header ng-hide">Header</div>
        <div class="con">{Job Name}</div>
        <div class="footer ng-hide">Footer</div>
    </div>
</div>

If you'd like to use the Header and Footer options as well feel free to remove the "ng-hide" class from the code