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": ""
}
]