{"id":994,"date":"2016-10-25T11:37:18","date_gmt":"2016-10-25T11:37:18","guid":{"rendered":"http:\/\/docs.contentviewspro.com\/?p=994"},"modified":"2023-12-28T11:19:44","modified_gmt":"2023-12-28T11:19:44","password":"","slug":"overlay-thumbnail-text","status":"publish","type":"docs","link":"https:\/\/contentviewspro.com\/documentation\/article\/overlay-thumbnail-text\/","title":{"rendered":"Overlay thumbnail with (or without) text"},"content":{"rendered":"<p>Since CVP 3.9.9, it is easy to overlay thumbnail with text.<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/contentviewspro.com\/documentation\/wp-content\/uploads\/2016\/10\/Overlay-CVP-3.9.9.png\" alt=\"Overlay setting CVP 3.9.9\" width=\"616\" height=\"212\" class=\"aligncenter size-full wp-image-995\" srcset=\"https:\/\/contentviewspro.com\/documentation\/wp-content\/uploads\/2016\/10\/Overlay-CVP-3.9.9.png 616w, https:\/\/contentviewspro.com\/documentation\/wp-content\/uploads\/2016\/10\/Overlay-CVP-3.9.9-300x103.png 300w\" sizes=\"auto, (max-width: 616px) 100vw, 616px\" \/><\/p>\n<p>You can show overlay always, on hover or disable it.<br \/>\nAlso, you can change position of overlay text as top, middle, bottom of thumbnail.<\/p>\n<h2>Requirement<\/h2>\n<p>Please ensure to select the <code>Show Title<\/code> or <code>Show Content<\/code> checkbox in Display Settings >> Fields Settings. Otherwise, there is nothing to show in the overlay.<\/p>\n<h2 id=\"wotext\">Overlay without text<\/h2>\n<p>For now, overlay always require text. The workaround to show overlay without text is setting transparent color for the text in the overlay:<\/p>\n<ul>\n<li>select only 2 checkboxes: <code>Show Thumbnail<\/code> and <code>Show Title<\/code> in Display Settings >> Fields Settings<\/li>\n<li>use this text<br \/>\n<code>transparent<\/code><br \/>\nas value of Style Settings > Title > Text Color<\/li>\n<\/ul>\n<p>Best regards,<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Since CVP 3.9.9, it is easy to overlay thumbnail with text. You can show overlay always, on hover or disable it. Also, you can change position of overlay text as top, middle, bottom of thumbnail. Requirement Please ensure to select the Show Title or Show Content checkbox in Display Settings >> Fields Settings. Otherwise, there &hellip;<\/p>\n<p class=\"read-more\"> <a class=\"\" href=\"https:\/\/contentviewspro.com\/documentation\/article\/overlay-thumbnail-text\/\"> <span class=\"screen-reader-text\">Overlay thumbnail with (or without) text<\/span> Read More &raquo;<\/a><\/p>\n","protected":false},"author":1,"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":[],"doc_tag":[18,16],"class_list":["post-994","docs","type-docs","status-publish","hentry","doc_tag-overlay","doc_tag-thumbnail"],"year_month":"2026-09","word_count":113,"total_views":"8","reactions":{"happy":"0","normal":"0","sad":"0"},"author_info":{"name":"admin1","author_nicename":"admin1","author_url":"https:\/\/contentviewspro.com\/documentation\/author\/admin1\/"},"doc_category_info":[],"doc_tag_info":[{"term_name":"overlay","term_url":"https:\/\/contentviewspro.com\/documentation\/tags\/overlay\/"},{"term_name":"thumbnail","term_url":"https:\/\/contentviewspro.com\/documentation\/tags\/thumbnail\/"}],"_links":{"self":[{"href":"https:\/\/contentviewspro.com\/documentation\/wp-json\/wp\/v2\/docs\/994","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\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/contentviewspro.com\/documentation\/wp-json\/wp\/v2\/comments?post=994"}],"version-history":[{"count":1,"href":"https:\/\/contentviewspro.com\/documentation\/wp-json\/wp\/v2\/docs\/994\/revisions"}],"predecessor-version":[{"id":5538,"href":"https:\/\/contentviewspro.com\/documentation\/wp-json\/wp\/v2\/docs\/994\/revisions\/5538"}],"wp:attachment":[{"href":"https:\/\/contentviewspro.com\/documentation\/wp-json\/wp\/v2\/media?parent=994"}],"wp:term":[{"taxonomy":"doc_category","embeddable":true,"href":"https:\/\/contentviewspro.com\/documentation\/wp-json\/wp\/v2\/doc_category?post=994"},{"taxonomy":"doc_tag","embeddable":true,"href":"https:\/\/contentviewspro.com\/documentation\/wp-json\/wp\/v2\/doc_tag?post=994"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}