ACF File – Preview of document

• kwibbles

• July 6, 2016 at 6:06 am

I’m unsure how to do this, but I’m trying to get a preview of a document, PDF or image. So instead of that placeholder image below, I’d like to to show the same size preview.

• John Huebner

• July 6, 2016 at 8:14 am

There isn’t any way to change the icon shown by ACF.

There are 2 hooks that might be used to alter what is displayed.

The first is acf/prepare_field https://www.advancedcustomfields.com/resources/acfprepare_field/. There isn’t much documentation on this one, but I don’t think it will let you do what you want to do. You’d need to figure that out.

The other hook is acf/render_field https://www.advancedcustomfields.com/resources/acf-render_field/. This hook also will not do what you want but it would let you add html to the field to show additional information, like a thumbnail of an image. I can’t say if you can show a PDF or other file type. You can see an example of using acf/render_field used to show and image for a URL field here https://github.com/Hube2/acf-filters-and-functions/blob/master/render-image-in-editor.php

• jonas

• September 15, 2017 at 3:55 am

Hello,

I had same issue and make this hook for it:

	function acf_change_icon_on_files ( $icon, $mime, $attachment_id ){ // Display thumbnail instead of document.png
		
		if ( strpos( $_SERVER[ 'REQUEST_URI' ], '/wp-admin/upload.php' ) === false && $mime === 'application/pdf' ){
			$get_image = wp_get_attachment_image_src ( $attachment_id, 'thumbnail' );
			if ( $get_image ) {
				$icon = $get_image[0];
			} 
		}
		return $icon;
	}
	
	add_filter( 'wp_mime_type_icon', 'acf_change_icon_on_files', 10, 3 );

• MarcGuay

• June 12, 2023 at 2:33 pm

Old one but here’s a quick way to do this:

add_filter( 'acf/load_attachment', 'custom_load_attachment', 10, 3);
function custom_load_attachment ($response, $attachment, $meta){
  if ($response['type'] == 'image'){
    $response['icon'] = $response['sizes']['thumbnail'];
  }
  return $response;
}