ACF snippets

ACF (Advanced Custom Fields) is a great tool for adding custom fields to your WordPress websites. I have put together some of the most useful snippets that you can use on your projects.

If you are unfamiliar with making coding adjustments to your functions, I would recommend backing your website up before making any adjustments to your themes code.

1. Hide ACF admin page

This snippet should be added to your function files and will remove the admin menu from WordPress.


add_filter('acf/settings/show_admin', '__return_false');

2. Register an options page in ACF

If you want to display some theme options on your project - you must register your options page first. Add this to your theme functions.


if( function_exists('acf_add_options_page') ) {
    acf_add_options_page();
}

3. Change ACF options page name

This snippet should be added to your function files and will change the name of the options page.


if (function_exists('acf_set_options_page_menu')){
	acf_set_options_page_menu('Your Title');
}

4. Position ACF fields above Yoast SEO Plugin

Add this to your functions and your custom fields will be positioned above Yoast.


add_filter( 'wpseo_metabox_prio', function() { return 'low';});

5. Use different sizes images in your ACF Gallery

Sometimes you don't always want to use the same image sizes in your galleries. Here is an example of how you can apply different image sizes to your gallery.


<?php 
    $images = get_field('your-field-name');
    $size = 'full';
    if( $images ): 
?>
    <ul class="cf">
        <?php foreach( $images as $index => $image ): ?>
            <li>
                <?php if ( $index == 0 ) { ?>
                    <img src="<?php echo $image['sizes']['image-grid-1']; ?>" alt="<?php echo $image['alt']; ?>" />
                <?php } elseif ( $index == 1 ) { ?>
                    <img src="<?php echo $image['sizes']['image-grid-1']; ?>" alt="<?php echo $image['alt']; ?>" />
                <?php } elseif ( $index == 2 ) { ?>
                    <img src="<?php echo $image['sizes']['image-grid-1']; ?>" alt="<?php echo $image['alt']; ?>" />
                <?php } elseif ( $index == 3 ) { ?>
                    <img src="<?php echo $image['sizes']['image-grid-2']; ?>" alt="<?php echo $image['alt']; ?>" />
                <?php } elseif ( $index == 4 ) { ?>
                    <img src="<?php echo $image['sizes']['image-grid-2']; ?>" alt="<?php echo $image['alt']; ?>" />
            </li>
        <?php } endforeach; ?>
    </ul>
<?php endif; ?>

6. Get url for a thumbnail in ACF

Sometimes you just want the url of a thumbnail so you can have more control, here is an example of how you can get the url.


// first, get the image object returned by ACF
$image_object = get_field('your-field-name');
 
// and the image size you want to return
$image_size = 'thumbnail';
 
// now, we'll exctract the image URL from $image_object
$image_url = $image_object['sizes'][$image_size];

// Then display this where you wish to display your url.
<img src="<?php echo $image_url; ?>" alt="">

8. Speed up the post edit page when using ACF

Add this snippet to your theme functions to speed up the post edit page.


add_filter('acf/settings/remove_wp_meta_box', '__return_true');

9. Create excerpts from ACF field

Firstly add this to your theme functions and change the field name to that of the field you wish to use:


function acf_excerpt() {
	global $post;
	$text = get_field('field_name');
	if ( '' != $text ) {
		$text = strip_shortcodes( $text );
		$text = apply_filters('the_content', $text);
		$text = str_replace(']]&gt;', ']]&gt;', $text);
		$excerpt_length = 20; // 20 words
		$excerpt_more = apply_filters('excerpt_more', ' ' . '[...]');
		$text = wp_trim_words( $text, $excerpt_length, $excerpt_more );
	}
	return apply_filters('the_excerpt', $text);
}

Then call the excerpt in your theme by using this snippet: