Disable Cover inside the article? To avoid images repeating twice within the article

[DanielGarzaB]

Some sites will use some internal images of the article for the features image/cover but Facebook doesn't allow this:

2) Article Formatting Instant Articles must not contain formatting that creates a confusing experience or which makes articles appear broken. For example:

1. Images or videos must not be repeated within the article. The image or video set as the cover in the article header may not appear a second time in the article body, unless you are granted a special exception by Facebook.

Have seen some pages disabled it i.e. CNN

How can I acomplish this? Should I remove from fb-instant-articles/template.php all this?:

<!-- The cover -->
                <?php $cover_media = $this->get_cover_media(); ?>
                <?php if ( 'image' === $cover_media->type ) : ?>
                    <figure>
                        <img src="<?php echo esc_url( $cover_media->src ); ?>" />
                        <?php if ( strlen( $cover_media->caption ) ) : ?>
                            <figcaption><?php echo esc_html( $cover_media->caption ); ?></figcaption>
                        <?php endif; ?>
                    </figure>
                <?php elseif ( 'video' === $cover_media->type ) : ?>
                    <figure>
                        <video>
                            <source src="<?php echo esc_url( $cover_media->src ); ?>" type="<?php echo esc_attr( $cover_media->mime_type ); ?>" />
                        </video>
                    </figure>
                <?php elseif ( 'slideshow' === $cover_media->type ) : ?>
                    <figure class="op-slideshow">
                        <?php foreach ( $cover_media->items as $item ) : ?>
                            <figure>
                                <img src="<?php echo esc_url( $item->src ); ?>" />
                            </figure>
                        <?php endforeach; ?>
                    </figure>
                <?php endif; ?>

[schneidan]

Curious why this one was closed? It does seem like a relevant choice, if only as an option for those who want to use it?

[jerclarke]

This definitely deserves a response if it's going to be closed. The behavior/rules are all over the place on this and it's very confusing.

[EDIT: Just realized it was closed by OP not the devs, sorry for misunderstanding, still think it's an important issue]

This forum post highlights one aspect of it, which is that there is sometimes an error for almost-duplicate images, but never an error for completely-the-same images. Very strange and if FB genuinely has a rule against duplicating images, the error should show when the images are the same.

https://wordpress.org/support/topic/general-warningrepeating-cover-image-and-first-image/#post-8731646

On top of that the actual behavior of iA posts seems erratic (as I describe in that thread). When I preview posts in the FB Pages app I sometimes see both cover and first image, sometimes see only cover and sometimes only see first image. All in cases where I used the same image at the start of a post and as the featured image.

Clarity on this would be very valuable and mentioning whatever the best practice is in the plugin docs is important.

NOTE: I have submitted a site for review that violates the "rule" quoted above but not recieved a response yet. Not sure if they will reject me for my violation or not, but the behavior where they automatically correct the duplication implies to me that they are accepting it.

[everton-rosario]

Reopening the issue. @jeremyclarke How was your submission?

[jerclarke]

My submission was accepted, I think when there were still some cases of duplicated heading. So I think they may be accepting submissions without being too strict about it but I'm not totally sure.

In the end I figured out the filters to remove the cover image and have settled on that as my final solution. Most of our posts would have "duplicate cover and first image" and when FB DOES show them both (still not sure of what triggers it) the result is just awful. The result is by the time my sites are getting approved I already had the no-cover-image code running so I'm not totally sure.

FWIW IMHO the iA design works great with a big image below the title, it's not a huge flaw as long as you tend to include the image near the top of the post.

Here's code to disable the featured image->cover image relationship:

/**
 * Filter for Facebook Instant Articles that disables the featured image 
 * as "cover image" for all instant articles.
 *
 * By default FB uses the WP featured image as the "Cover Image" for ia, 
 * which shows above the headline.  * FB forbids having that image repeat
 * in the post, and especially when it's at the top of the post, it looks
 * terrible to have two copies in a row. 
 * 
 * This code disables the Cover Image entirely, and is useful if you 
 * usually have the featured image inserted at thetop of your posts so you
 * don't need the cover image. 
 * 
 * Note: This has no effect on the FB share display, which is driven by
 * the Open Graph og:image tag and not iA. 
 *
 * @param array $image_data
 *
 * @return array
 */
function gh_example_filter_instant_articles_remove_featured_image($image_data) {
	return array(
		'src' => '',
		'caption' => '',
	);
}
add_filter('instant_articles_featured_image', 'gh_example_filter_instant_articles_remove_featured_image');

[jerclarke]

In terms of what to do, a setting that affects this might be welcomed by a lot of users who have this problem.

Ideally it would be something like "[x] If cover+first image are duplicates (i.e. that error comes up) disable featured image!"

But something like this would also be useful "[x] Don't use WP Featured Image as iA Cover Image (Avoids duplication)"

Potentially a per-post setting would be useful, so we could just have this apply to posts that start with their featured image, but that's probably "too many options".

[schneidan]

I, too, had not realized it was closed by OP. I will give your filter suggestion a try when I get a chance, @jeremyclarke -- thank you!

As for the checkbox options, the second one you suggested is exactly what I had in mind. I use the WP Featured Image for social media cards and the like, so it is sometimes different than the lead image in a post, and other times not. Either way it does look sub-par in iA with both, and mine have the double in every post because I always lead with an image, although my site was also accepted (beforehand my first post in this thread, even).

Thanks for digging into this.

[rondavilar]

@jeremyclarke I'm completely new to programming and at the student level. Where does one insert the code to disable the cover image. Is it in the custom transform rules or in one of the elements .php. If so, which?

[jerclarke]

@rondavilar To start, avoid editing plugins or the core of WordPress at all costs, it makes it impossible to update them.

The correct place for my code is either in a custom plugin (not that hard but maybe not what you need), or the functions.php file of your theme.

functions.php is what I'd recommend.

[rondavilar]

@jeremyclarke Thanks much! Is it normal for plugins not to have basic features? Eg. A global footer or to disable the kicker? I'm having a really hard time figuring this out.

[jerclarke]

Plugins and WordPress core often follow a "less options is better" approach to keep things simple for users to understand and simple to maintain. The more settings you add the more likely you break things for some users and not others in the future etc.

Plugins like this tend to get the basics done for you, then rely on advanced users to use the API to do what they need (like adding footers/kicker etc). One nice thing is someone could make an add-on plugin to this one, that did things like that if they wanted because it's all done with the API. Right now I haven't seen anything like that, but it's totally possible, and that plugin could exist without the author having to re-do all the work of having the core iA features set up.

Anyway, this isn't really the place for plugin philosophy ;)

[DanielGarzaB]

Yea I think this needs to be a feature, facebook is now inboxing whoever uses cover image and the same image inside the article.

Any idea aside of the code to implement this fast and batch update articles?

[nabeelmoeen]

hi Jeremy, thanks for sharing the code to add filter. unfortunately, when i added this to my functions.php file my site stopped working, after some trial and error I changed the name of the function to remove the leading "57_" and it seems to have done the trick.

I wanted to ask if it is ok to modify the function name? and secondly, any ideas why my theme crashes when i use the name with leading numbers.

[jerclarke]

Sorry everyone, I updated the example code to not have a number in the function name.

[imjitthu]

Where to paste the code @jerclarke

[jerclarke]

@VanasriJithendar In the functions.php of your theme, or create a simple WP plugin just to include this code.

[github-actions[bot]]

This issue has been marked stale because it has been open for 30 days with no activity. If there is no activity within 7 days, it will be closed. This is an automation to keep issues manageable and actionable and is not a comment on the quality of this issue nor on the work done so far. Closed issues are still valuable to the project and are available to be searched.