D.I.Y

Remove Featured Image With AMP On WordPress Post CSS



What Is AMP?

AMP is Accelerated Mobile Pages. It’s a way to build mobile pages that render super fast, which helps with Google ranking, and helps your viewers to see your content quicker. Unfortunately AMP is a visual disaster. Using YOAST, which is what TheBLACKMedia uses, you can do some cosmetic changes, but one important change is to remove featured image.

AMP removes your theme’s style.css, fonts, and HTML, and can cause your website front visual to change from your basic mobile theme and style, to a boring text and white background. One of the things AMP does is re-ads your featured image, if previously removed with a plugin, which doubles if you already have an image atop a post [see screenshots below].


Remove Featured Image On Post

There are two great AMP plugins. AMP from Automattic which is a WordPress company, and AMP for Wp-Acclerated Mobile Pages. With the second plugin, there’s a simple button for remove featured image, but with AMP from Automattic, there’s not.


Screenshot Without CSSScreenshot With CSS


These instructions are specifically for YOAST users, who use AMP, and YOAST glue plugin. We use AMP from Automattic because it caused less issues with our site breaking with certain plugins we used, so if this is your case, simply follow these steps to remove featured image.


  • Download And Install AMP
  • Download And Install Glue For YOAST SEO & AMP Plugin
  • In Your Dashboard Visit YOAST SEO
  • Click AMP In YOAST SEO
  • Click Design
  • Scroll Down To Extra CSS
  • Copy And Paste The Following Code And Press Save Changes At The Bottom

.amp-wp-article-featured-image {
display:none;
}

How Did We Create This Code?

The CSS code { display:none; } is used to not display many things, its a basic code you can find readily on Google. The issue was trying to find the name for the AMP featured image, which is a different name from the theme’s featured image. So using Safari’s Inspect Element feature by left clicking on an AMP page, we found the following line within the Head tag and AMP style tag, and used the featured image code added with the display none code and it removed it easily!


© 2017 Tahir Register 
TheBLACKMedia On Twitter

Trending In The News

6th Annual National Melanin Day 2024

The 6th annual National Melanin Day October 1st 2024 relaunches the 2022 documentary with a…

2 months ago

Caresha Deserves An Apology – She Did Nothing Wrong, Diddy Did

Caresha 'Yung Miami' Brownlee does not deserve the cruelty she's been receiving over being Diddy's…

3 months ago

Tyler Perry Does Not Hate Black Women: A Critique On Critics

Tyler Perry's unfair critiques have plagued his career in the press, but not the numbers.…

4 months ago

Pretty Vee Was Born For The Stage | My Experience As Press:

A full review of Vena E Excell, aka Pretty Vee's debut sold out solo comedy…

4 months ago

Amanda Seales Is NOT The Problem, Our Conditioning Is

Amanda Seales does not deserve the onslaught of misinformed, hyperbolic, and assumptive articles written for…

8 months ago

Jada Pinkett Smith Does Not Deserve Your Cruelty!

Jada Pinkett Smith reveal she and Will Smith have been separated for 7 years, but…

1 year ago

We Use Cookies