Post by anas_daved » Tue Feb 26, 2019 12:52 pm

OK guys,
I found a way to save images in WebP format. I searched EVERYWHERE and could not find ANYTHING about this, so I had to do it by my self. I had to do this to improve the speed of my website. If you follow this method you will be able to save images as webP and serve them as such. This is verey early stage and rough, implement with caution.

Prerequisites:
-you need to be running on php 7.1
- you need to have ImageMagic installed on your server.
- you need to have opencart 3.0(not required, but this is my version so I dont know about other versions).

The How:
- find this line in filemanager.php:

Code: Select all

// Get files
            $files = glob($directory . '/' . $filter_name . '*.{jpg,jpeg,png,gif,JPG,JPEG,PNG,GIF}', GLOB_BRACE);
and change it to :

Code: Select all

// Get files
$files = glob($directory . '/' . $filter_name . '*.{jpg,jpeg,png,gif,JPG,JPEG,PNG,GIF,svg,SVG,webp}', GLOB_BRACE);
-find the code for upload() in filemanager.php and change this

Code: Select all

 if (!$json) {
                    move_uploaded_file($file['tmp_name'], $directory . '/' . $filename);
                    }
to this :

Code: Select all

if (!$json) {
                    move_uploaded_file($file['tmp_name'], $directory . '/' . $filename);
                    $dir = 'image/catalog/products/' .$target_file .'/'.$filename;
                    $im = new Imagick($dir);
                    $im->writeImage(substr_replace($dir , 'webp', strrpos($dir , '.') +1));
                    unlink($dir);
                }
- find the save() method in system/library/image.php and cahnge this :

Code: Select all

elseif ($extension == 'png') {
				imagepng($this->image, $file);
			} elseif ($extension == 'gif') {
				imagegif($this->image, $file);
			}
			imagedestroy($this->image);
to this :

Code: Select all

elseif ($extension == 'png') {
				imagepng($this->image, $file);
			} elseif ($extension == 'gif') {
				imagegif($this->image, $file);
			}elseif ($extension == 'webp') {
                            
                            imagewebp($this->image, $file);
			}

			imagedestroy($this->image);
Conclusion:

That's it, I changed these lines and now every save to the website will save into webP. Please be careful when applying this, we need more developers to try this out and tweak it before it is safe for everyone. Also, be sure to clear your cache and browser cache and every other place that an image could be cashed it before saying that it did not work for you.

Let me know if this works for you or if it works for other versions.

Cheers.

Newbie

Posts

Joined
Mon Feb 25, 2019 9:33 pm

Post by straightlight » Sat Mar 02, 2019 8:57 pm

An additional validation can be found here as for PHP v7.1.0: viewtopic.php?f=110&t=143082#p748232 .

Note: Not a replacement solution, simply an addition to it.

Dedication and passion goes to those who are able to push and merge a project.

Regards,
Straightlight
Programmer / Opencart Tester


Legendary Member

Posts

Joined
Mon Nov 14, 2011 11:38 pm
Location - Canada, ON

Post by anas_daved » Sun Mar 03, 2019 1:44 pm

straightlight wrote:
Sat Mar 02, 2019 8:57 pm
An additional validation can be found here as for PHP v7.1.0: viewtopic.php?f=110&t=143082#p748232 .

Note: Not a replacement solution, simply an addition to it.
Excellent catch, great addition. Thank you for enhancing this. I'll update the extension I did on this.

Newbie

Posts

Joined
Mon Feb 25, 2019 9:33 pm

Post by haxcop » Tue Sep 24, 2019 10:58 pm

I have a question:

I see this xml file uploaded by @anas_dawood works pretty well (Thanks) when uploading the files manually using the UI of OpenCart.
But when using an automated tool to import the catalog with images via URL or anything else it won't work, have someone already have a solution to iT?

New member

Posts

Joined
Tue Jan 14, 2014 9:38 pm
Location - Dublin

Post by head_dunce » Fri Nov 22, 2019 11:09 pm

I am looking at doing it like this -
https://www.digitalocean.com/community/ ... ur-website
Not sure if it'll work, but if I create the cache folder to auto-generate the webp file and use Apache mod_rewite I don't think there will be any need to change the OC code.

Jim
https://www.carguygarage.com
Yahoo Store since 2006 moved to OpenCart on January 24, 2020


Active Member

Posts

Joined
Thu Apr 04, 2019 11:50 pm

Post by head_dunce » Sat Nov 23, 2019 4:47 am

Just tried what I previously posted and it works well. It draws the webp image when the image is loaded into the cache. If the webp image is there by the time the page is done being rendered, it gets swapped into the html.

I think I need to expand on this idea so that I can have something crawl all the pages and load all the images so that the webp thing can get all the images loaded. viewtopic.php?f=10&t=214913

Jim
https://www.carguygarage.com
Yahoo Store since 2006 moved to OpenCart on January 24, 2020


Active Member

Posts

Joined
Thu Apr 04, 2019 11:50 pm

Post by agatha65 » Wed Nov 27, 2019 12:15 am

haxcop wrote:
Tue Sep 24, 2019 10:58 pm
I have a question:

I see this xml file uploaded by @anas_dawood works pretty well (Thanks) when uploading the files manually using the UI of OpenCart.
But when using an automated tool to import the catalog with images via URL or anything else it won't work, have someone already have a solution to iT?
Try this:
https://www.opencart.com/index.php?rout ... n_id=38025

Suppliers Module - XML, CSV, XLS Product Feed Import and Update
Rich Snippets | Facebook Open Graph Meta Tags | WebP Images
Image


User avatar
Active Member

Posts

Joined
Fri Mar 16, 2012 10:18 am
Location - Canada, QC

Post by Pavloved » Thu Mar 12, 2020 10:07 am

agatha65 wrote:
Wed Nov 27, 2019 12:15 am
haxcop wrote:
Tue Sep 24, 2019 10:58 pm
I have a question:

I see this xml file uploaded by @anas_dawood works pretty well (Thanks) when uploading the files manually using the UI of OpenCart.
But when using an automated tool to import the catalog with images via URL or anything else it won't work, have someone already have a solution to iT?
Try this:
https://www.opencart.com/index.php?rout ... n_id=38025
Great job - I made small edits for ocstore 3 and everything immediately worked.... Thanks

Newbie

Posts

Joined
Thu Mar 12, 2020 9:41 am

Post by nightwing » Sat Jul 18, 2020 9:16 pm

Tested, however when you open the webp in a new tab, you get this:

Code: Select all

RIFFHí�WEBPVP8 <í�ð՝*€0>1ŠC¢!!!&ÓŠH@ M߁#1xG-îdK+ì÷÷ð´?Ù?üø½Æ>
û÷ßðÿß?½óÿOò½Åý\yîŸã¿ÄuÿÓþ£í«÷_îÿË~Aø‘×ñ?Ñ~Fûÿyoê?ãÿ»ÿÿŸý÷ÿÿÿ¯ºï?äªÿCÿ_÷ÿÿÿâÔòÍþè~ÿÿÿýþ7üãü÷÷òŸù¿Èÿÿ÷ø§þü¿õ>ò?ÇÿÓÿ£þ[ýwÿßÕ¿¿ÿÜÿ5þ“ÿGûOÿÿq_ëÿá˜ýäùYý«üÿü¯òŸèÿù}�ÿ2þÇÿ?ö“ÿ§ûOœßþ¾åëãÿå÷þ¡þ_þïúo÷¿ýþ2÷ÿ¬ÿeÿÿþoÙïõ_ö?û?Ö±ÿýÿ?ìCú÷ßúŸ´?ÿ¿Ú}�æÿ÷ÿËâøþ/ÿÿõ½À?îÿÿö¯õOõë=*ü÷÷ïòÿâmÁzoåÚ¿™ÿ‹þ/ÿ·ü¼¯ß¿×ÿ-äË°ÿöþÖ{ü§ïÇì¿Àþê’ýÉûßýÏ
Any thoughts?
agatha65 wrote:
Wed Nov 27, 2019 12:15 am
haxcop wrote:
Tue Sep 24, 2019 10:58 pm
I have a question:

I see this xml file uploaded by @anas_dawood works pretty well (Thanks) when uploading the files manually using the UI of OpenCart.
But when using an automated tool to import the catalog with images via URL or anything else it won't work, have someone already have a solution to iT?
Try this:
https://www.opencart.com/index.php?rout ... n_id=38025

Regards,
Nightwing
Access to my Free Extensions: https://www.opencart.com/index.php?rout ... =nightwing


Active Member

Posts

Joined
Tue Nov 05, 2019 11:08 pm


Post by by mona » Sun Feb 13, 2022 8:32 am

For a more complete solution, developed to include all images not just product thumbs.

https://www.opencart.com/index.php?rout ... n_id=43173

DISCLAIMER:
You should not modify core files .. if you would like to donate a cup of coffee I will write it in a modification for you.


https://www.youtube.com/watch?v=zXIxDoCRc84


User avatar
Expert Member

Posts

Joined
Mon Jun 10, 2019 9:31 am

Post by Aliyaaii2 » Sun Jul 23, 2023 3:06 pm

head_dunce wrote:
Sat Nov 23, 2019 4:47 am
Just tried what I previously posted and it works well. It draws the webp image when the image is loaded into the cache. If the webp image is there by the time the page is done being rendered, it gets swapped into the html.

I think I need to expand on this idea so that I can have something crawl all the pages and load all the images so that the webp thing can get all the images loaded. viewtopic.php?f=10&t=214913free fire name
Hi guys
That's great to hear! It seems like the method you shared works smoothly, rendering the webp image when cached and swapping it into the HTML once the page finishes loading.

Newbie

Posts

Joined
Wed Jul 19, 2023 10:03 pm
Who is online

Users browsing this forum: No registered users and 37 guests