Support » Plugin: Adaptive Images for WordPress » Vector-based PNG Images

  • Resolved mafreprezent

    (@mafreprezent)


    Howdy,

    I am really excited to try out this plugin. I have some vector-heavy PNG header images that my theme was running through a filter and resizing/destroying their sharpness.

    After checking out the plugin settings, I was not sure if I would run into the same issue. Do you have any experience with this kind of situation?

    Asking in advance of editing NGINX config file.

    Thank you!

    The page I need help with: [log in to see the link]

Viewing 10 replies - 1 through 10 (of 10 total)
  • Plugin Author Takis Bouyouris

    (@nevma)

    Hello, @mafreprezent,

    Well, you actually cannot know what is going to happen to PNGs at such a detailed level unless you try it out. I made a test page here for you http://aidev.nevma.gr/uncategorized/test-alpin-io/ with some of your images. The results are not bad at all. However, your smaller images are already quite small themselves and they are not really affected -if at all- by the Adaptive Images plugin. However, images like https://alpin.io/wp-content/uploads/2019/04/mountain-header5.png are more important candidates for testing.

    Let me know what you think!

    Cheers,
    Takis

    Thread Starter mafreprezent

    (@mafreprezent)

    Oh my gosh this is… the best support I’ve ever received for ANY plugin my gosh! The test/example stuff has me over the moon.

    I am feeling really tempted to define some other image sizes and rely on WP’s system to deliver different images, but wow this could save me some time and hassle with theme updates.

    I’m going to leave a revive and make a personal donation because this blew me away.

    Plugin Author Takis Bouyouris

    (@nevma)

    You are welcome, my friend.

    You know where to find us, if you need anything more in the future! 🙂

    Thread Starter mafreprezent

    (@mafreprezent)

    I am working for someone who has done a lot more front-end work than me who I am going to run the following by:

    I am now thinking I can upload some really nice images (we have some 4K and similar monitors here) and define a number of different lower sizes and be done with it. It would save me the trouble of dabbling in PHP and re-making changes after theme updates (probably).

    Plugin Author Takis Bouyouris

    (@nevma)

    It is always a good idea to experiment and the Adaptive Images cache is something you can easily erase and reset with new image sizes. We generally advice against using too many image size, but you will eventually know what suits your use-case best.

    Now, I noticed that your images are being served with NginX mentioned in the server header, so I would like to point out that, for this setup to work properly, you need to add a special bit of code to your NginX configuration file. You will find that bit of code in the message after you save the Adaptive Images plugin settings. You might need some help from your server admin there!

    Cheers,
    Takis

    Thread Starter mafreprezent

    (@mafreprezent)

    I have looked for an NginX.conf file and asked Sitegruond support about it, but they could not locate it (we have a dedicated server).

    Would I just add this to the wp-config.php file?

    location / {
    rewrite \.(?:jpe?g|gif|png)$ /wp-content/plugins/adaptive-images/adaptive-images-script.php;
    }

    Plugin Author Takis Bouyouris

    (@nevma)

    Hello, my friend,

    By the looks of it, it seems that you are probably using Apache as your main server and NginX as a caching server. This is why you do not see any NginX configuration files. However, I would like you to confirm this for me with your host, as a first step. Can you do this please?

    Plugin Author Takis Bouyouris

    (@nevma)

    Hello, my friend,

    By the looks of it, it seems that you are probably using Apache as your main server and NginX as a caching server. This is why you do not see any NginX configuration files. However, I would like you to confirm this for me with your host, as a first step. Can you do this please?

    If this is your case, then you do not have to do anything, you are already good to go as far as the initial setup is concerned. However this kind of setup (which resembles a small CDN, actually) requires that you enable the CDN support option in the plugin settings page. Unfortunately, this is a setup that we can only support in an experimental way, because of the way caching servers and CDNs work. Experimental doesn’t mean that anything will break, but it does mean that a) some images might be delivered in their original size even in smaller screen and b) images in CSS backgrounds are not detected and they are delivered in their original sizes, as well.

    Let me know how it goes!

    Cheers,
    Takis

    Thread Starter mafreprezent

    (@mafreprezent)

    OK, here is what I learned after getting a better answer from a different tech at SiteGround:

    Thank you for contacting our Help Desk!

    The NGINX configuration files are not visible to you as they are system files.

    You should be able to apply the above-mentioned rule in the .htaccess file of the website as follows:
    Code:
    RewriteRule \.(?:jpe?g|gif|png)$ /wp-content/plugins/adaptive-images/adaptive-images-script.php

    Please discuss the matter with the developer of the plugin once again.

    If this fails to resolve it, please update the ticket so we can check this further.

    Plugin Author Takis Bouyouris

    (@nevma)

    Hello, there,

    Well, I think that the rewrite rule that they mention is already created automatically by our plugin. So, this is most probably already taken care of.

    So, what you need to do now is enable the CDN support option in the plugin settings page, because NginX in your setup actually works like a small CDN, it works as a caching server. However, let me remind you what I already mentioned in my previous message about this option:

    Unfortunately, this is a setup that we can only support in an experimental way, because of the way caching servers and CDNs work. Experimental doesn’t mean that anything will break, but it does mean that a) some images might be delivered in their original size even in smaller screen and b) images in CSS backgrounds are not detected and they are delivered in their original sizes, as well.

    Hope this helps!

    Cheers,
    Takis

Viewing 10 replies - 1 through 10 (of 10 total)
  • The topic ‘Vector-based PNG Images’ is closed to new replies.