Wordpress | ACF | Foundation - Social Media Links using Advanced Custom Fields and FontAwesome 4.7

readme.md

The ACF Field Group could be added to an Options pages, so that its entries can be used anywhere on the site.

My variables are prepended with "footer_social" but that could be changed to suit your needs.

acf.json

[
    {
        "key": "group_5a821be5c1b91",
        "title": "Social Media",
        "fields": [
            {
                "key": "field_5a7cba5f6d07a",
                "label": "Social Media",
                "name": "footer_social_icons",
                "type": "repeater",
                "instructions": "",
                "required": 0,
                "conditional_logic": 0,
                "wrapper": {
                    "width": "",
                    "class": "",
                    "id": ""
                },
                "collapsed": "",
                "min": 0,
                "max": 0,
                "layout": "table",
                "button_label": "",
                "sub_fields": [
                    {
                        "key": "field_5a7cba886d07b",
                        "label": "Platform",
                        "name": "footer_social_icons_platform",
                        "type": "select",
                        "instructions": "",
                        "required": 1,
                        "conditional_logic": 0,
                        "wrapper": {
                            "width": "",
                            "class": "",
                            "id": ""
                        },
                        "choices": {
                            "facebook": "Facebook",
                            "flickr": "Flickr",
                            "google-plus": "Google+",
                            "instagram": "Instagram",
                            "linkedin": "LinkedIn",
                            "pinterest": "Pinterest",
                            "snapchat": "Snapchat",
                            "skype": "Skype",
                            "tumblr": "Tumblr",
                            "twitter": "Twitter",
                            "vimeo": "Vimeo",
                            "youtube": "YouTube"
                        },
                        "default_value": [],
                        "allow_null": 0,
                        "multiple": 0,
                        "ui": 0,
                        "ajax": 0,
                        "return_format": "array",
                        "placeholder": ""
                    },
                    {
                        "key": "field_5a7cbc506d07c",
                        "label": "URL",
                        "name": "footer_social_icons_url",
                        "type": "url",
                        "instructions": "",
                        "required": 1,
                        "conditional_logic": 0,
                        "wrapper": {
                            "width": "",
                            "class": "",
                            "id": ""
                        },
                        "default_value": "",
                        "placeholder": ""
                    }
                ]
            }
        ],
        "location": [
            [
                {
                    "param": "post_type",
                    "operator": "==",
                    "value": "post"
                }
            ]
        ],
        "menu_order": 0,
        "position": "normal",
        "style": "default",
        "label_placement": "top",
        "instruction_placement": "label",
        "hide_on_screen": "",
        "active": 1,
        "description": ""
    }
]

social.php

<?php if( have_rows('footer_social_icons', 'option') ): ?>
    <p class="site-footer__social">
    <?php while ( have_rows('footer_social_icons', 'option') ) : the_row();
            // vars
            $social_platform_url = get_sub_field('footer_social_icons_url');
            $social_platform = get_sub_field('footer_social_icons_platform');
            $social_platform_value = $social_platform['value'];
            $social_platform_label = $social_platform['label'];

            if ( $social_platform_value == 'flickr' ||
                $social_platform_value == 'instagram' ||
                $social_platform_value == 'skype' ) {
                // do nothing
            } else {
                $social_platform_value .= '-square';
            }
        ?><!-- REMOVING SPACING FROM HTML
        --><a href="<?php echo $social_platform_url; ?>" target="_blank"><i class="fa fa-<?php echo $social_platform_value; ?>" aria-hidden="true"><span class="show-for-sr"><?php echo $social_platform_label; ?></span></i></a><!-- REMOVING SPACING FROM HTML
        --><?php endwhile; ?>
</p>
<?php endif; ?>