{"id":5050,"date":"2026-08-30T04:20:35","date_gmt":"2026-08-29T19:20:35","guid":{"rendered":"https:\/\/donguri3.net\/server-tech\/simple-featured-image-generator-2\/"},"modified":"2026-08-30T04:20:37","modified_gmt":"2026-08-29T19:20:37","slug":"simple-featured-image-generator","status":"publish","type":"post","link":"https:\/\/donguri3.net\/en\/server-tech\/wordpress-blog-seo\/simple-featured-image-generator\/","title":{"rendered":"Building a Custom Auto-Featured Image Generator After Switching WordPress Themes"},"content":{"rendered":"<p class=\"\">The Cocoon theme features a built-in, albeit beta, function that automatically generates featured images based on the article title and settings <span class=\"\" data-state=\"closed\"><span class=\"ms-1 inline-flex max-w-full items-center relative top-[-0.094rem] animate-[show_150ms_ease-in]\"><a class=\"flex h-4.5 overflow-hidden rounded-xl px-2 text-[0.5625em] font-medium text-token-text-secondary! bg-[#F4F4F4]! dark:bg-[#303030]! transition-colors duration-150 ease-in-out\" href=\"https:\/\/wp-cocoon.com\/automatic-generation-of-featured-image-from-title\/?utm_source=chatgpt.com\" target=\"_blank\" rel=\"noopener\"><span class=\"relative start-0 bottom-0 flex h-full w-full items-center\"><span class=\"flex h-4 w-full items-center justify-between overflow-hidden\"><span class=\"max-w-full grow truncate overflow-hidden text-center\">Cocoon<\/span><\/span><\/span><\/a><\/span><\/span>. I personally loved and used this convenient feature for a long time, but one day I discovered that my PageSpeed Insights performance score had plummeted into the 50s. I suspected a plugin and removed it, but saw no improvement; I also reviewed the speed optimization settings within the theme, but nothing changed, leaving me with no choice but to switch themes. Since the new destination lacked an automatic featured image generation feature, I decided to develop my own plugin.<\/p>\n<p><a href=\"https:\/\/github.com\/bomura\/simple-featured-image-generator#\">bomura\/simple-featured-image-generator: This is a WordPress plugin that generates a featured image from the title and author.<\/a><\/p>\n<hr class=\"\" \/>\n<h2 class=\"\">Background: The Cocoon Theme&#8217;s Auto-Featured Image Generation Feature<\/h2>\n<h3 class=\"\">Cocoon&#8217;s Beta Feature<\/h3>\n<p class=\"\">Starting with Cocoon 2.8.4, a beta feature was added that automatically generates featured images from the titles of posts and pages <span class=\"ms-1 inline-flex max-w-full items-center relative top-[-0.094rem] animate-[show_150ms_ease-in]\"><a class=\"flex h-4.5 overflow-hidden rounded-xl px-2 text-[0.5625em] font-medium text-token-text-secondary! bg-[#F4F4F4]! dark:bg-[#303030]! transition-colors duration-150 ease-in-out\" href=\"https:\/\/wp-cocoon.com\/2-8-4\/?utm_source=chatgpt.com\" target=\"_blank\" rel=\"noopener\"><span class=\"relative start-0 bottom-0 flex h-full w-full items-center\"><span class=\"flex h-4 w-full items-center justify-between overflow-hidden\"><span class=\"max-w-full grow truncate overflow-hidden text-center\">Cocoon<\/span><\/span><\/span><\/a><\/span>.<br \/>It can be used simply by enabling &#8220;Generate featured image from title&#8221; under the &#8220;Cocoon Settings &gt; Editor&#8221; tab in the management screen, which greatly saves the hassle of searching for images.<\/p>\n<h3 class=\"\">Real-World Usability<\/h3>\n<p class=\"\">I highly rate this feature because it is extremely useful and makes preparing featured images effortless.<\/p>\n<hr class=\"\" \/>\n<h2 class=\"\">The Problem: Drop in PageSpeed Insights Performance<\/h2>\n<h3 class=\"\">A Sudden Drop to the 50s<\/h3>\n<p class=\"\">I noticed that my site&#8217;s score, which usually maintained around 80 on mobile and 90 on desktop, had suddenly dropped to the 50s on mobile. No major updates had been made, and I struggled through trial and error trying to figure out the cause.<\/p>\n<hr class=\"\" \/>\n<h2 class=\"\">Troubleshooting: Eliminating Plugins and Reviewing Speed Optimization<\/h2>\n<h3 class=\"\">Plugin Isolation<\/h3>\n<p class=\"\">First, I temporarily deactivated all plugins, but the PageSpeed Insights results did not improve.<br \/>Next, I tried introducing plugins for external speed optimizations\u2014such as image lazy loading and next-generation format conversion\u2014but the score continued to hover in the 50s.<\/p>\n<h3 class=\"\">Server and Cache Verification<\/h3>\n<p class=\"\">I also reviewed the server environment, CDN, and caching plugins (such as LiteSpeed Cache), but this did not yield any significant improvements either, and I was unable to identify the root cause.<\/p>\n<hr class=\"\" \/>\n<h2 class=\"\">Theme Migration and Missing Features<\/h2>\n<p class=\"\">Judging that recovery of the PageSpeed Insights score was unlikely, I migrated the entire site to another speed-focused theme.<br \/>Although the new theme achieved a lighter weight, Cocoon&#8217;s automatic featured image generation feature was missing, significantly increasing the burden of manually preparing a featured image every time I created an article.<\/p>\n<p><a href=\"https:\/\/donguri3.net\/wp-content\/uploads\/2025\/05\/PageSpeed-Insights-Google-Chrome-2025_04_23-22_12_43-1.png\"><img decoding=\"async\" class=\"aligncenter size-thumb710 wp-image-1442\" src=\"https:\/\/donguri3.net\/wp-content\/uploads\/2025\/05\/PageSpeed-Insights-Google-Chrome-2025_04_23-22_12_43-1-710x549.png\" alt=\"pagespeed insight\u306e\u30e2\u30d0\u30a4\u30eb\u306e\u30b9\u30b3\u30a2\u6539\u5584\" width=\"710\" height=\"549\" srcset=\"https:\/\/donguri3.net\/wp-content\/uploads\/2025\/05\/PageSpeed-Insights-Google-Chrome-2025_04_23-22_12_43-1-710x549.png 710w, https:\/\/donguri3.net\/wp-content\/uploads\/2025\/05\/PageSpeed-Insights-Google-Chrome-2025_04_23-22_12_43-1-300x232.png 300w, https:\/\/donguri3.net\/wp-content\/uploads\/2025\/05\/PageSpeed-Insights-Google-Chrome-2025_04_23-22_12_43-1-768x594.png 768w, https:\/\/donguri3.net\/wp-content\/uploads\/2025\/05\/PageSpeed-Insights-Google-Chrome-2025_04_23-22_12_43-1-530x410.png 530w, https:\/\/donguri3.net\/wp-content\/uploads\/2025\/05\/PageSpeed-Insights-Google-Chrome-2025_04_23-22_12_43-1-565x437.png 565w, https:\/\/donguri3.net\/wp-content\/uploads\/2025\/05\/PageSpeed-Insights-Google-Chrome-2025_04_23-22_12_43-1-725x561.png 725w, https:\/\/donguri3.net\/wp-content\/uploads\/2025\/05\/PageSpeed-Insights-Google-Chrome-2025_04_23-22_12_43-1.png 986w\" sizes=\"(max-width: 710px) 100vw, 710px\" \/><\/a><\/p>\n<hr class=\"\" \/>\n<h2 class=\"\">Plugin Development: The Birth of Simple Featured Image Generator<\/h2>\n<h3 class=\"\">Motivation for Development<\/h3>\n<p class=\"\">Driven by the desire to &#8220;have an automatic featured image generation feature comparable to Cocoon available on any theme,&#8221; I decided to build my own plugin.<br \/>It operates independently of existing themes, works on the Classic Editor, generates a PNG based on the post title, author avatar, and color settings, and automatically sets it as the featured image.<\/p>\n<h3 class=\"\">Key Specifications<\/h3>\n<ul>\n<li class=\"\">\n<p class=\"\">Renders the post title and author avatar onto a canvas<\/p>\n<\/li>\n<li class=\"\">\n<p class=\"\">Allows font color, background color, and frame color to be configured via a color picker<\/p>\n<\/li>\n<li class=\"\">\n<p class=\"\">Asynchronous generation and saving via AJAX<\/p>\n<\/li>\n<\/ul>\n<p class=\"\">For implementation details and installation instructions, please check the <a href=\"https:\/\/github.com\/bomura\/simple-featured-image-generator#\">GitHub repository<\/a>.<br \/>\nSince I just whipped this up by trial and error and it&#8217;s probably far from refined, I would appreciate any tweaking or contributions.<\/p>\n<hr class=\"\" \/>\n<h2 class=\"\">Conclusion<\/h2>\n<ol>\n<li class=\"\">\n<p class=\"\">Impressed by <strong>Cocoon&#8217;s automatic featured image feature<\/strong>, but faced an unexpected <strong>drop in PageSpeed Insights score<\/strong>.<\/p>\n<\/li>\n<li class=\"\">\n<p class=\"\">Tried <strong>reviewing theme settings and isolating plugins<\/strong> with no improvement, leading to the decision to <strong>switch themes<\/strong>.<\/p>\n<\/li>\n<li class=\"\">\n<p class=\"\">Because the new theme lacked the same functionality, I custom-built the <strong>Simple Featured Image Generator<\/strong> plugin.<\/p>\n<\/li>\n<\/ol>\n<p class=\"\">Moving forward, this custom plugin aims to enable automatic featured image generation across various theme environments and significantly improve workflow efficiency. Please give it a try.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>The Cocoon theme features a built-in, albeit beta, function that automatically generates featured images based [&hellip;]<\/p>\n","protected":false},"author":4,"featured_media":1439,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_locale":"en_US","_original_post":"https:\/\/donguri3.net\/?p=1430","footnotes":""},"categories":[1166],"tags":[51,15,117,525,61,150,10,153],"class_list":["post-5050","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-wordpress-blog-seo","tag-git","tag-litespeed","tag-litespeed-cache","tag-pagespeed-insights","tag-wordpress","tag-server","tag-153","en-US"],"_links":{"self":[{"href":"https:\/\/donguri3.net\/wp-json\/wp\/v2\/posts\/5050","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/donguri3.net\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/donguri3.net\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/donguri3.net\/wp-json\/wp\/v2\/users\/4"}],"replies":[{"embeddable":true,"href":"https:\/\/donguri3.net\/wp-json\/wp\/v2\/comments?post=5050"}],"version-history":[{"count":1,"href":"https:\/\/donguri3.net\/wp-json\/wp\/v2\/posts\/5050\/revisions"}],"predecessor-version":[{"id":5053,"href":"https:\/\/donguri3.net\/wp-json\/wp\/v2\/posts\/5050\/revisions\/5053"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/donguri3.net\/wp-json\/wp\/v2\/media\/1439"}],"wp:attachment":[{"href":"https:\/\/donguri3.net\/wp-json\/wp\/v2\/media?parent=5050"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/donguri3.net\/wp-json\/wp\/v2\/categories?post=5050"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/donguri3.net\/wp-json\/wp\/v2\/tags?post=5050"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}