{"id":1898,"date":"2017-02-01T07:48:36","date_gmt":"2017-02-01T07:48:36","guid":{"rendered":"http:\/\/docs.contentviewspro.com\/?p=1898"},"modified":"2023-12-28T08:41:42","modified_gmt":"2023-12-28T08:41:42","password":"","slug":"show-custom-field-as-thumbnail-of-post","status":"publish","type":"docs","link":"https:\/\/contentviewspro.com\/documentation\/article\/show-custom-field-as-thumbnail-of-post\/","title":{"rendered":"Show an image custom field as thumbnail"},"content":{"rendered":"<h2>Content Views Pro version 5.5.0 and higher<\/h2>\n<p>Since Content Views Pro version 5.5.0, you can easily show image custom field as thumbnail without coding.<\/p>\n<p>Here is the configuration in Display Settings &gt;&gt; Fields Settings &gt;&gt; Thumbnail of the View to show any image custom field as thumbnail:<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-3562\" src=\"https:\/\/contentviewspro.com\/documentation\/wp-content\/uploads\/2017\/02\/Content-Views-Pro-Show-image-custom-field-as-thumbnail.png\" alt=\"\" width=\"581\" height=\"138\" srcset=\"https:\/\/contentviewspro.com\/documentation\/wp-content\/uploads\/2017\/02\/Content-Views-Pro-Show-image-custom-field-as-thumbnail.png 581w, https:\/\/contentviewspro.com\/documentation\/wp-content\/uploads\/2017\/02\/Content-Views-Pro-Show-image-custom-field-as-thumbnail-300x71.png 300w\" sizes=\"auto, (max-width: 581px) 100vw, 581px\" \/><\/p>\n<h2>Content Views Pro version 5.4.1 and prior<\/h2>\n<p>For previous Pro versions, to show the custom field as thumbnail, please follow steps below:<\/p>\n<ul>\n<li>In the View where you want to show the custom field as thumbnail, select the <strong>Show Thumbnail<\/strong> checkbox in Display Settings &gt;&gt; Fields settings.<\/li>\n<li>Under Display Settings &gt;&gt; Fields settings &gt;&gt; Thumbnail &gt;&gt; Substitute, please configure as below:<br \/>\n<img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-2776\" src=\"https:\/\/contentviewspro.com\/documentation\/wp-content\/uploads\/2017\/02\/CVP-show-custom-field-as-thumbnail.png\" alt=\"CVP - show custom field as thumbnail\" width=\"540\" height=\"145\" srcset=\"https:\/\/contentviewspro.com\/documentation\/wp-content\/uploads\/2017\/02\/CVP-show-custom-field-as-thumbnail.png 540w, https:\/\/contentviewspro.com\/documentation\/wp-content\/uploads\/2017\/02\/CVP-show-custom-field-as-thumbnail-300x81.png 300w\" sizes=\"auto, (max-width: 540px) 100vw, 540px\" \/><\/li>\n<li id=\"code\">Add this code to file <strong>functions.php<\/strong> of your active theme:\n<pre style=\"font-size: 13px;\">\n\/\/ Content Views Pro - Use custom field as thumbnail\nadd_filter( 'pt_cv_field_content_excerpt', 'cvp_theme_custom_field_as_thumbnail', 999, 3 );\nfunction cvp_theme_custom_field_as_thumbnail( $args, $fargs, $post ) {\n\tif ( empty( $fargs ) ) {\n\t\t$custom_field = 'CUSTOM_FIELD';\n\n\t\t$fval = null;\n\t\tif ( class_exists( 'CVP_CTF' ) ) {\n\t\t\t$ctf  = new CVP_CTF( $custom_field, $post, true, '' );\n\t\t\t$fval = isset( $ctf->field_value ) ? $ctf->field_value : $fval;\n\t\t}\n\n\t\tif ( empty( $fval ) ) {\n\t\t\t$meta = get_post_meta( $post->ID );\n\t\t\t$fval = !empty( $meta[ $custom_field ][ 0 ] ) ? $meta[ $custom_field ][ 0 ] : $fval;\n\t\t}\n\n\t\t$args = $fval ? sprintf( \"&lt;img src='%s'&gt;\", esc_url( $fval ) ) : $args;\n\t}\n\n\treturn $args;\n}\n<\/pre>\n<p>(replace <strong>CUSTOM_FIELD<\/strong> with name\/key of your custom field).<\/li>\n<\/ul>\n<p style=\"display: none;\">Notice: If you created custom field with Toolset plugin, you may need to add prefix <code>wpcf-<\/code>. For example, you created a custom field <code>post-image<\/code> with Toolset plugin, then the value of <strong>CUSTOM_FIELD<\/strong> should be <code>wpcf-post-image<\/code>.<\/p>\n<p>Thank you,<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Content Views Pro version 5.5.0 and higher Since Content Views Pro version 5.5.0, you can easily show image custom field as thumbnail without coding. Here is the configuration in Display Settings &gt;&gt; Fields Settings &gt;&gt; Thumbnail of the View to show any image custom field as thumbnail: Content Views Pro version 5.4.1 and prior For &hellip;<\/p>\n<p class=\"read-more\"> <a class=\"\" href=\"https:\/\/contentviewspro.com\/documentation\/article\/show-custom-field-as-thumbnail-of-post\/\"> <span class=\"screen-reader-text\">Show an image custom field as thumbnail<\/span> Read More &raquo;<\/a><\/p>\n","protected":false},"author":2,"featured_media":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"site-sidebar-layout":"default","site-content-layout":"default","ast-global-header-display":"","ast-banner-title-visibility":"","ast-main-header-display":"","ast-hfb-above-header-display":"","ast-hfb-below-header-display":"","ast-hfb-mobile-header-display":"","site-post-title":"","ast-breadcrumbs-content":"","ast-featured-img":"","footer-sml-layout":"","theme-transparent-header-meta":"","adv-header-id-meta":"","stick-header-meta":"","header-above-stick-meta":"","header-main-stick-meta":"","header-below-stick-meta":"","footnotes":""},"doc_category":[52],"doc_tag":[13,21,16],"class_list":["post-1898","docs","type-docs","status-publish","hentry","doc_category-custom-field","doc_tag-custom-field","doc_tag-custom-code","doc_tag-thumbnail"],"year_month":"2026-09","word_count":266,"total_views":"7","reactions":{"happy":"0","normal":"0","sad":"0"},"author_info":{"name":"CVP","author_nicename":"cvp","author_url":"https:\/\/contentviewspro.com\/documentation\/author\/cvp\/"},"doc_category_info":[{"term_name":"Custom Field (core, ACF, Metabox, etc.)","term_url":"https:\/\/contentviewspro.com\/documentation\/cats\/custom-field\/"}],"doc_tag_info":[{"term_name":"custom field","term_url":"https:\/\/contentviewspro.com\/documentation\/tags\/custom-field\/"},{"term_name":"custom PHP code","term_url":"https:\/\/contentviewspro.com\/documentation\/tags\/custom-code\/"},{"term_name":"thumbnail","term_url":"https:\/\/contentviewspro.com\/documentation\/tags\/thumbnail\/"}],"_links":{"self":[{"href":"https:\/\/contentviewspro.com\/documentation\/wp-json\/wp\/v2\/docs\/1898","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/contentviewspro.com\/documentation\/wp-json\/wp\/v2\/docs"}],"about":[{"href":"https:\/\/contentviewspro.com\/documentation\/wp-json\/wp\/v2\/types\/docs"}],"author":[{"embeddable":true,"href":"https:\/\/contentviewspro.com\/documentation\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/contentviewspro.com\/documentation\/wp-json\/wp\/v2\/comments?post=1898"}],"version-history":[{"count":3,"href":"https:\/\/contentviewspro.com\/documentation\/wp-json\/wp\/v2\/docs\/1898\/revisions"}],"predecessor-version":[{"id":5153,"href":"https:\/\/contentviewspro.com\/documentation\/wp-json\/wp\/v2\/docs\/1898\/revisions\/5153"}],"wp:attachment":[{"href":"https:\/\/contentviewspro.com\/documentation\/wp-json\/wp\/v2\/media?parent=1898"}],"wp:term":[{"taxonomy":"doc_category","embeddable":true,"href":"https:\/\/contentviewspro.com\/documentation\/wp-json\/wp\/v2\/doc_category?post=1898"},{"taxonomy":"doc_tag","embeddable":true,"href":"https:\/\/contentviewspro.com\/documentation\/wp-json\/wp\/v2\/doc_tag?post=1898"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}