Unleashing the Power of Advanced Custom Fields (ACF) in WordPress

Advanced Custom Fields (ACF)

WordPress is renowned for its flexibility and customization capabilities. One powerful tool in the arsenal of WordPress developers is Advanced Custom Fields (ACF). ACF empowers developers to add custom fields to content types effortlessly, providing enhanced control over the data displayed on a WordPress website.

In this blog post, we'll delve into the ins and outs of ACF, specifically focusing on retrieving data, working with repeater fields, and creating a shortcode to display ACF data dynamically.

Retrieving Data from ACF

ACF simplifies the process of adding and managing custom fields, making it a popular choice among developers. Retrieving data from ACF is a straightforward process, as demonstrated in the following code snippets.

Basic Field Retrieval

$downloads = get_field( "product_downloads" );
$type = get_sub_field('download_type');

Here, get_field is used to retrieve the value of a custom field named "product_downloads." Similarly, get_sub_field is employed to fetch the value of a sub-field called "download_type."

ACF Repeater Fields

Repeater fields are handy when dealing with repetitive data structures. The following code illustrates how to handle ACF repeater fields:

$downloads = get_field( "product_downloads" );

if( have_rows('product_downloads') ):
	while ( have_rows('product_downloads') ) : the_row();
		$type = get_sub_field('download_type');
		$title = get_sub_field('download_title');
		$file = get_sub_field('download_file');
		$fileURL = wp_get_attachment_url($file);
		$pdfIcon = plugins_url('/img/pdf-logo.png', __FILE__);
		$AiIcon = plugins_url('/img/adobe-illustrator-logo.png', __FILE__);
		$IdIcon = plugins_url('/img/indesign-logo.png', __FILE__);
			
			if ($type === 'pdf') { ?>
			<div class="download-item">
				<img src="<?php echo $pdfIcon ?>" width="35" class="downloadsLogo"><a href="<?php echo $fileURL ?>" download>Download <?php echo $title?></a>
			</div><?php
			} elseif ($type === 'adobe-illustrator') { ?>
			<div class="download-item">
				<img src="<?php echo $AiIcon ?>" width="35" class="downloadsLogo"><a href="<?php echo $fileURL ?>" download>Download <?php echo $title?></a>
			</div><?php
			} elseif ($type === 'adobe-indesign') { ?>
			<div class="download-item">
				<img src="<?php echo $IdIcon ?>" width="35" class="downloadsLogo"><a href="<?php echo $fileURL ?>" download>Download <?php echo $title?></a>					
			</div><?php
			}
		endwhile;
	else :
		echo 'No Templates Available';
	endif;

This code iterates through the repeater field and retrieves sub-field values such as type, title, file, and file URL. It then displays the data based on the type of download, incorporating conditional statements.

Creating a Shortcode with ACF Data

Shortcodes are a powerful tool in WordPress for embedding dynamic content. Below is an example of creating a shortcode that utilizes ACF data:

<?php //<-- Do not copy
function product_downloads_repeater_shortcode(){
	$downloads = get_field( "product_downloads" );

	if( have_rows('product_downloads') ):
		while ( have_rows('product_downloads') ) : the_row();
			$type = get_sub_field('download_type');
			$title = get_sub_field('download_title');
			$file = get_sub_field('download_file');
			$fileURL = wp_get_attachment_url($file);
			$pdfIcon = plugins_url('/img/pdf-logo.png', __FILE__);
			$AiIcon = plugins_url('/img/adobe-illustrator-logo.png', __FILE__);
			$IdIcon = plugins_url('/img/indesign-logo.png', __FILE__);
			
			if ($type === 'pdf') { ?>
			<div class="download-item">
				<img src="<?php echo $pdfIcon ?>" width="35" class="downloadsLogo"><a href="<?php echo $fileURL ?>" download>Download <?php echo $title?></a>
			</div><?php
			} elseif ($type === 'adobe-illustrator') { ?>
			<div class="download-item">
				<img src="<?php echo $AiIcon ?>" width="35" class="downloadsLogo"><a href="<?php echo $fileURL ?>" download>Download <?php echo $title?></a>
			</div><?php
			} elseif ($type === 'adobe-indesign') { ?>
			<div class="download-item">
				<img src="<?php echo $IdIcon ?>" width="35" class="downloadsLogo"><a href="<?php echo $fileURL ?>" download>Download <?php echo $title?></a>					
			</div><?php
			}
		endwhile;
	else :
		echo 'No Templates Available';
	endif;
}
add_shortcode('productDownloadsRepeater', 'product_downloads_repeater_shortcode');

In this example, the product_downloads_repeater_shortcode function fetches ACF data and dynamically generates content based on the retrieved values. The shortcode [productDownloadsRepeater] can be used to insert this dynamic content into any post or page.

ACF opens up a world of possibilities for WordPress developers, enabling them to create highly customized and dynamic websites. Whether you're dealing with basic field values, repeater fields, or creating shortcodes, ACF provides the tools needed to take WordPress customization to the next level.