mantismamita
8/20/2015 - 9:05 PM

acf module for row of CTA boxes with icons and links

acf module for row of CTA boxes with icons and links

function kc_do_cta_row() {

    if (have_rows('cta_box_row')):
        $rows= get_field('cta_box_row');
        $count= count($rows);


        if ($count == 1 ){
            $class = "full-width";
        } elseif ( $count == 2 ) {
            $class = "one-half";
        } elseif ( $count == 3) {
            $class = "one-third";
        } elseif ( $count == 4) {
            $class = "one-fourth";
        } else {
            $class = "one-fifth";
        }

        ?>
        <div class="cta-box-row">

        <?php while (have_rows('cta_box_row')):
        the_row();


        $class_field = (get_sub_field('cta_box_class')) ? get_sub_field('cta_box_class') : '';
        $cta_box_icon = get_sub_field('cta_box_icon');
        $cta_box_background_image = (get_sub_field('cta_box_background_image')) ? get_sub_field('cta_box_background_image') : '';

        if (!$cta_box_background_image=='') {
            if( $count > 4 ) {
            $bg_img= '; background-image: url(' . $cta_box_background_image['sizes'][ 'large' ] . ');     background-position: center center; background-size: cover;';
            } else {
            $bg_img= '; background-image: url(' . $cta_box_background_image['sizes'][ 'x-large' ] . ');     background-position: center center; background-size: cover;';
            }
        } else {
        $bg_img= '';
        }

        ?>

        <div class="<?php echo $class . ' ' . $class_field; ?>">
        <div class="panel" style="background-color: <?php the_sub_field('cta_box_colour'); ?> <?php echo $bg_img ?>; ">
                <?php
                if( $cta_box_icon ) {
                ?>
                <div class="cameo">
                    <img class="style-svg" alt="<?php echo $cta_box_icon['alt'] ?>"
                         src="<?php echo $cta_box_icon['url']; ?>"/>
                </div>

                <?php } ?>

                <?php
                if(get_sub_field('cta_box_title')) {
                ?>
            <h5 class="cta_box_title"><?php the_sub_field('cta_box_title'); ?></h5>
                <?php } ?>

                <?php
                if(get_sub_field('cta_box_description')) {
                ?>
            <h6 class="cta_box_description"><?php the_sub_field('cta_box_description'); ?></h6>
                <?php } ?>

                <?php
                if(get_sub_field('cta_box_link') && get_sub_field('cta_box_link_text')) {
                ?>
            <a href="<?php the_sub_field('cta_box_link'); ?>"
               class="button secondary"><?php the_sub_field('cta_box_link_text'); ?></a>
                <?php } ?>
        </div>
        </div>

        <?php

    endwhile; ?>


        </div>
        <?php endif; ?>
        <?php
    }
[
    {
        "key": "group_55490c0964f25",
        "title": "CTA-boxes",
        "fields": [
            {
                "key": "field_55490d5e86a78",
                "label": "CTA Box Row",
                "name": "cta_box_row",
                "type": "repeater",
                "instructions": "",
                "required": 0,
                "conditional_logic": 0,
                "wrapper": {
                    "width": "",
                    "class": "",
                    "id": ""
                },
                "min": 1,
                "max": 5,
                "layout": "block",
                "button_label": "Add CTA box",
                "sub_fields": [
                    {
                        "key": "field_55490dc786a79",
                        "label": "CTA box colour",
                        "name": "cta_box_colour",
                        "type": "color_picker",
                        "instructions": "choose a background colour for this box",
                        "required": 1,
                        "conditional_logic": 0,
                        "wrapper": {
                            "width": 50,
                            "class": "",
                            "id": ""
                        },
                        "default_value": ""
                    },
                    {
                        "key": "field_55490eb686a7c",
                        "label": "CTA box icon",
                        "name": "cta_box_icon",
                        "type": "image",
                        "instructions": "",
                        "required": 0,
                        "conditional_logic": 0,
                        "wrapper": {
                            "width": 50,
                            "class": "",
                            "id": ""
                        },
                        "return_format": "array",
                        "preview_size": "thumbnail",
                        "library": "all",
                        "min_width": "",
                        "min_height": "",
                        "min_size": "",
                        "max_width": "",
                        "max_height": "",
                        "max_size": "",
                        "mime_types": ""
                    },
                    {
                        "key": "field_55490e3b86a7a",
                        "label": "CTA box title",
                        "name": "cta_box_title",
                        "type": "text",
                        "instructions": "",
                        "required": 0,
                        "conditional_logic": 0,
                        "wrapper": {
                            "width": "",
                            "class": "",
                            "id": ""
                        },
                        "default_value": "",
                        "placeholder": "",
                        "prepend": "",
                        "append": "",
                        "maxlength": "",
                        "readonly": 0,
                        "disabled": 0
                    },
                    {
                        "key": "field_55490e9c86a7b",
                        "label": "CTA box description",
                        "name": "cta_box_description",
                        "type": "text",
                        "instructions": "",
                        "required": 0,
                        "conditional_logic": 0,
                        "wrapper": {
                            "width": "",
                            "class": "",
                            "id": ""
                        },
                        "default_value": "",
                        "placeholder": "",
                        "prepend": "",
                        "append": "",
                        "maxlength": "",
                        "readonly": 0,
                        "disabled": 0
                    },
                    {
                        "key": "field_5549110086a7d",
                        "label": "CTA box link text",
                        "name": "cta_box_link_text",
                        "type": "text",
                        "instructions": "",
                        "required": 0,
                        "conditional_logic": 0,
                        "wrapper": {
                            "width": 50,
                            "class": "",
                            "id": ""
                        },
                        "default_value": "",
                        "placeholder": "",
                        "prepend": "",
                        "append": "",
                        "maxlength": 20,
                        "readonly": 0,
                        "disabled": 0
                    },
                    {
                        "key": "field_5549114886a7e",
                        "label": "CTA box link",
                        "name": "cta_box_link",
                        "type": "page_link",
                        "instructions": "",
                        "required": 0,
                        "conditional_logic": 0,
                        "wrapper": {
                            "width": "50%",
                            "class": "",
                            "id": ""
                        },
                        "post_type": [

                        ],
                        "taxonomy": [

                        ],
                        "allow_null": 0,
                        "multiple": 0
                    }
                ]
            }
        ],
        "location": [
            [
                {
                    "param": "page",
                    "operator": "==",
                    "value": "4619"
                }
            ]
        ],
        "menu_order": 0,
        "position": "acf_after_title",
        "style": "default",
        "label_placement": "top",
        "instruction_placement": "label",
        "hide_on_screen": "",
        "active": 1,
        "description": ""
    }
]