[Support request] AMP Official Plugin

[Muhammad Qasim]

Hello,

I installed official AMP plugin on my blog. It went well but the only issue is with ads. I selected “Classic” option in plugin that display AMP responses in classic (legacy) post templates in a basic design that does not match your theme’s templates.

However, since I have placed ad codes on my main theme, it is also showing that code on amp pages too. I have added a separate amp compatible ad below title which is working, but it is also loading that non-amp ad codes too, which I dont want to be there and they are also not loading. Can you please have a look at that and help me out?

[Tom]

Hi there,

Just so I fully understand, you have two ads on the page, one for AMP and one not. On AMP, it’s showing the not-for-AMP ad code.

So basically, you want to hide that not-for-AMP ad when using AMP?

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/
Ongoing Development: https://generatepress.com/ongoing-development

[Muhammad Qasim]

Dear Tom,

Yes exactly. Actually, I am using QuickAdsense plugin for displaying ads on my blog. I think the best solution would be to be able to disable this plugin for amp pages only.

And yes exactly, I want only amp ads to be shown on amp pages. The other ads are not even working, but QuickAdsense plugin is showing them on amp pages too.

[Tom]

That might be something you need to bring up with the QuickAdsense developer, then.

They should be able to use the is_amp_endpoint() function to detect whether AMP is active or not.

If you had control over the HTML around the ads, we could write a function to hide them on AMP with CSS.

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/
Ongoing Development: https://generatepress.com/ongoing-development

[Muhammad Qasim]

Its a free plugin and not updated in last few months, so I don’t expect any support from them.

I can’t play with ad codes, but can add CSS etc. above it. So would that work to hide it on amp pages? If yes, then I would be very thankful for the proper code to achieve this.

Thanks in advance.

[Muhammad Qasim]

Or is it possible to edit plugins to add is_amp_endpoint() code to solve this? If this is possible, then it would also help me edit any other plugin which I donot want to work on amp versions.

[Tom]

If you can wrap the ad, we could try this:

<div class="non-amp-ad">
    Your non-AMP ad in here.
</div>

Then you can add this function:

add_action( 'wp_head', function() {
    if ( ! function_exists( 'is_amp_endpoint' ) ) {
        return;
    }

    if ( ! is_amp_endpoint() ) {
        return;
    }
    ?>
        <style>
            .non-amp-ad {display: none;}
        </style>
    <?php
} );

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/
Ongoing Development: https://generatepress.com/ongoing-development

[Muhammad Qasim]

Dear Tom,

I have placed my ads inside the CSS and added the code using Code Snippets plugin. Please refer to screenshot and check if I did it right, because it is still showing ads on amp pages.

https://paste.pics/63f2f91717724996a0f22a57495fc824

[Tom]

That looks right to me.

Just to confirm, you’re using this plugin?: https://wordpress.org/plugins/amp/

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/
Ongoing Development: https://generatepress.com/ongoing-development

[Muhammad Qasim]

Dear Tom,

Yes, it is the AMP official plugin you mentioned above. Can you please sort out what is issue now, as the problem is not yet fixed. I did the above steps.

[Anna De Simone]

I’ve the same problem!
Muhammad Qasim, can i visit your website?

I’m using to QuickAdsense on another blog, try to paste the code on “Header Embed Code” of “Quick Adsense Setting Plug-in”.

[Tom]

How are you testing the site on AMP? I can’t find a good way to do so.

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/
Ongoing Development: https://generatepress.com/ongoing-development

[Muhammad Qasim]

By adding /amp/ at end of URL. Homepage is not on amp, only blog post pages. Eg. abc.com/blogpost-url/amp/

This will show the amp page and you can then also view the source-code.

[Tom]

Just checked this topic: https://wordpress.org/support/topic/add-custom-css-in-amp-paired-mode/

Instead of that function, try adding this in Customize > Additional CSS:

html[amp] .non-amp-ad {
    display: none;
}

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/
Ongoing Development: https://generatepress.com/ongoing-development

[Author]

Posts