Dsiplay icons (or images) with field information on frontend

Support Meta Box AIO Dsiplay icons (or images) with field information on frontendResolved

Viewing 5 posts - 1 through 5 (of 5 total)
  • Author
    Posts
  • #32389
    guerre64guerre64
    Participant

    Not quite sure how to go about doing this on a Client website:

    https://woocommerce-538177-2177082.cloudwaysapps.com/category/bamboo-specifications/

    For each Bamboo plan type there are a number of custom fields that are filled on the backend for the post type and most are consistent from plant to plant, such as Maximum Height, Culm Diameter, Min. Temperature, etc.

    However, there are some fields that are radio button or checkbox choices, such as Collectibles, Ornamental, Frost Tolerant, etc.

    I want to be able to display icons or images on the frontend that are associated with the text content, so that if the value of Frost Tolerant, for instance, is YES, then a little icon representing that (probably a snowflake) will display on the specification card for that plant. This could be either next to the text for Frost Tolerant or elsewhere on the card.

    How do I go about doing that in Metabox??

    #32420
    Long NguyenLong Nguyen
    Moderator

    Hi,

    You can use the extension MB Conditional Logic to show/hide a field based on another field value. Please read more on the documentation https://docs.metabox.io/extensions/meta-box-conditional-logic/

    #32535
    guerre64guerre64
    Participant

    Do you have any examples of how to do this - the documentation just really doesn't help to get an idea of what to do for someone who is relatively inexperienced?!

    #32546
    Long NguyenLong Nguyen
    Moderator

    Hi,

    You can use the field switch or checkbox on the backend to ask for show/hide the image field. Then on the frontend, use the code to check the value of the field and show the image. Just like this

    $value = rwmb_meta( $field_id );
    // If field is on.
    if ( $value ) {
        echo 'Slider goes here';
        // Do something.
        echo '<img src="#123" alt="your image here">';
    }
    // If field is off.
    else {
        echo 'No slider';
        // Do something else.
    }
    

    Refer to the documentation
    https://docs.metabox.io/fields/switch/#template-usage
    https://docs.metabox.io/fields/checkbox/#template-usage
    https://docs.metabox.io/fields/single-image/

    #32558
    guerre64guerre64
    Participant

    Thanks for that extra info - I'll take a look.

    Cheers 🙂

Viewing 5 posts - 1 through 5 (of 5 total)
  • You must be logged in to reply to this topic.