Imagify Plugin issues with Top10 Plugin

Resolved S o f t f u l l y
(@softfully)

1 year, 6 months ago

I want to show webp images format on my website via Imagify Plugin but this Top10 Plugin is changing the style of the image icon so in Imagify Plugin settings I have disabled (uncheck) “Display images in WebP format on the site” and also “Use <picture> tags (preferred)” is recommended in Imagify Plugin if you want to show webp images in the website. (Keep in mind that “Use rewrite rules” settings in Imagify Plugin won’t show webp images).
Demo1: https://drive.google.com/file/d/1fAypwKMZXXFOal4mVUbCIxMxsvrB5Ffu/view
Demo2: https://drive.google.com/file/d/1rCbF6Dvmrl1tGklQKiU0nHHvJbNmo48s/view
From the above 2 demo links “Demo1” is original and good-looking also.
Plugin URL: https://wordpress.org/plugins/top-10/
So please help me out with this.
Thank you

Viewing 9 replies - 1 through 9 (of 9 total)

Plugin Author WP Media
(@wp_media)

1 year, 6 months ago

Hey @softfully

Sorry to hear about the issue!

Indeed, this is caused by the <picture> method of delivering WebP to the site.

If you don’t use CDN/Cloudflare or some extensive server cache like Varnish, you can safely use rewrite rules method and it will work (make sure to follow this guide in order to see if it really delivers WebP or not).

Other than that, there should be an easy fix for this with some CSS so it would be great if you could share this page with us and we will provide the code that will fix it.

Let me know if you need any further assistance, I am happy to help.

Best Regards
Marko

Thread Starter S o f t f u l l y
(@softfully)

1 year, 6 months ago

Thank you very much for your reply
I use Cloudflare and if I use the rewrite rules method then webp images will not display
So the last option is that please help me via CSS fix.
My website: Softfully [.COM]
You will see the Widget on the right sidebar and also in the footer, so please check both.
Thank you

Thread Starter S o f t f u l l y
(@softfully)

1 year, 6 months ago

Please make results like Demo1 via CSS:
Demo1: https://drive.google.com/file/d/1fAypwKMZXXFOal4mVUbCIxMxsvrB5Ffu/view
Plugin Author WP Media
(@wp_media)

1 year, 6 months ago
Hey,

Try to add this code to your CSS:
```
li>a.tptn_link {
    float: left;
}
```
Let me know if you need any further assistance, I am happy to help.

Best Regards
Thread Starter S o f t f u l l y
(@softfully)

1 year, 6 months ago

In the footer, you will see “nVIDIA GeForce Game Ready Driver” image and looks good because that image I already uploaded with webp format so keep this in mind.
Thank you

Thread Starter S o f t f u l l y
(@softfully)

1 year, 6 months ago

Yes, this works but needs little space between the image icon and text
Thank you
Plugin Author WP Media
(@wp_media)

1 year, 6 months ago
Hey @softfully

Ah, I see – you can update the code (replace the current one) with this:
```
li>a.tptn_link {
    float: left;
    margin-right: 3px;
}
```
You can change the “3px” value to fit exact space between if this one is not good.

Best Regards
Marko
Thread Starter S o f t f u l l y
(@softfully)

1 year, 6 months ago

Thank you very very much…

Thread Starter S o f t f u l l y
(@softfully)

1 year, 6 months ago

Hi,
I want to share some private information directly to your personal email
Thank you

Viewing 9 replies - 1 through 9 (of 9 total)

The topic ‘Imagify Plugin issues with Top10 Plugin’ is closed to new replies.