Pomoc pri optimizaciji slika na Wordpressu

GTMetrix: Screenshot by Lightshot

Pokusao sam nekoliko plugina svi smanje velicinu slika, keep exif data OFF, sada sto se tice scale slike tu nemam pojma sto radit. Moze neka pomoc, savjet bilo sto?

htaccess:

# BEGIN WpFastestCache
<IfModule mod_rewrite.c>
RewriteEngine On
RewriteBase /
RewriteCond %{HTTPS} =on
RewriteCond %{HTTP_HOST} ^XXX
# Start WPFC Exclude
# End WPFC Exclude
# Start_WPFC_Exclude_Admin_Cookie
RewriteCond %{HTTP:Cookie} !wordpress_logged_in_[^\=]+\=XXX|Publisher
# End_WPFC_Exclude_Admin_Cookie
RewriteCond %{HTTP_HOST} ^# BEGIN WpFastestCache
RewriteEngine On RewriteBase / RewriteCond %{HTTPS} =on RewriteCond %{HTTP_HOST} ^XXX # Start WPFC Exclude # End WPFC Exclude # Start_WPFC_Exclude_Admin_Cookie RewriteCond %{HTTP:Cookie} !wordpress_logged_in_[^\=]+\=XXX|Publisher # End_WPFC_Exclude_Admin_Cookie RewriteCond %{HTTP_HOST} ^XXX RewriteCond %{HTTP_USER_AGENT} !(facebookexternalhit|WhatsApp|Mediatoolkitbot) RewriteCond %{HTTP_USER_AGENT} !(WP\sFastest\sCache\sPreload(\siPhone\sMobile)?\s*Bot) RewriteCond %{REQUEST_METHOD} !POST RewriteCond %{REQUEST_URI} !(\/){2}$ RewriteCond %{REQUEST_URI} \/$ RewriteCond %{QUERY_STRING} !.+ RewriteCond %{HTTP:Cookie} !wordpress_logged_in RewriteCond %{HTTP:Cookie} !comment_author_ RewriteCond %{HTTP:Cookie} !woocommerce_items_in_cart RewriteCond %{HTTP:Cookie} !safirmobilswitcher=mobil RewriteCond %{HTTP:Profile} !^[a-z0-9\"]+ [NC] RewriteCond %{HTTP_USER_AGENT} !^.*(\bCrMo\b|CriOS|Android.*Chrome\/[.0-9]*\s(Mobile)?|\bDolfin\b|Opera.*Mini|Opera.*Mobi|Android.*Opera|Mobile.*OPR\/[0-9.]+|Coast\/[0-9.]+|Skyfire|Mobile\sSafari\/[.0-9]*\sEdge|IEMobile|MSIEMobile|fennec|firefox.*maemo|(Mobile|Tablet).*Firefox|Firefox.*Mobile|FxiOS|bolt|teashark|Blazer|Version.*Mobile.*Safari|Safari.*Mobile|MobileSafari|Tizen|UC.*Browser|UCWEB|baiduboxapp|baidubrowser|DiigoBrowser|Puffin|\bMercury\b|Obigo|NF-Browser|NokiaBrowser|OviBrowser|OneBrowser|TwonkyBeamBrowser|SEMC.*Browser|FlyFlow|Minimo|NetFront|Novarra-Vision|MQQBrowser|MicroMessenger|Android.*PaleMoon|Mobile.*PaleMoon|Android|blackberry|\bBB10\b|rim\stablet\sos|PalmOS|avantgo|blazer|elaine|hiptop|palm|plucker|xiino|Symbian|SymbOS|Series60|Series40|SYB-[0-9]+|\bS60\b|Windows\sCE.*(PPC|Smartphone|Mobile|[0-9]{3}x[0-9]{3})|Window\sMobile|Windows\sPhone\s[0-9.]+|WCE;|Windows\sPhone\s10.0|Windows\sPhone\s8.1|Windows\sPhone\s8.0|Windows\sPhone\sOS|XBLWP7|ZuneWP7|Windows\sNT\s6\.[23]\;\sARM\;|\biPhone.*Mobile|\biPod|\biPad|Apple-iPhone7C2|MeeGo|Maemo|J2ME\/|\bMIDP\b|\bCLDC\b|webOS|hpwOS|\bBada\b|BREW).*$ [NC] RewriteCond %{DOCUMENT_ROOT}/wp-content/cache/all/$1/index.html -f [or] RewriteCond /home/XXX/XXX/wp-content/cache/all/$1/index.html -f RewriteRule ^(.*) "/wp-content/cache/all/$1/index.html" [L] AddDefaultCharset UTF-8 FileETag None Header unset ETag Header set Cache-Control "max-age=0, no-cache, no-store, must-revalidate" Header set Pragma "no-cache" Header set Expires "Mon, 29 Oct 1923 20:30:00 GMT" # END WpFastestCache # BEGIN GzipWpFastestCache AddType x-font/woff .woff AddType x-font/ttf .ttf AddOutputFilterByType DEFLATE image/svg+xml AddOutputFilterByType DEFLATE text/plain AddOutputFilterByType DEFLATE text/html AddOutputFilterByType DEFLATE text/xml AddOutputFilterByType DEFLATE text/css AddOutputFilterByType DEFLATE text/javascript AddOutputFilterByType DEFLATE application/xml AddOutputFilterByType DEFLATE application/xhtml+xml AddOutputFilterByType DEFLATE application/rss+xml AddOutputFilterByType DEFLATE application/javascript AddOutputFilterByType DEFLATE application/x-javascript AddOutputFilterByType DEFLATE application/x-font-ttf AddOutputFilterByType DEFLATE application/vnd.ms-fontobject AddOutputFilterByType DEFLATE font/opentype font/ttf font/eot font/otf # END GzipWpFastestCache # BEGIN LBCWpFastestCache AddType application/font-woff2 .woff2 ExpiresActive On ExpiresDefault A0 ExpiresByType image/webp A2592000 ExpiresByType image/gif A2592000 ExpiresByType image/png A2592000 ExpiresByType image/jpg A2592000 ExpiresByType image/jpeg A2592000 ExpiresByType image/ico A2592000 ExpiresByType image/svg+xml A2592000 ExpiresByType text/css A2592000 ExpiresByType text/javascript A2592000 ExpiresByType application/javascript A2592000 ExpiresByType application/x-javascript A2592000 ExpiresByType application/font-woff2 A2592000 Header set Expires "max-age=2592000, public" Header unset ETag Header set Connection keep-alive FileETag None # END LBCWpFastestCache # BEGIN WordPress RewriteEngine On RewriteBase / RewriteRule ^index\.php$ - [L] RewriteCond %{REQUEST_FILENAME} !-f RewriteCond %{REQUEST_FILENAME} !-d RewriteRule . /index.php [L]

END WordPress

RewriteCond %{HTTP_USER_AGENT} !(facebookexternalhit|WhatsApp|Mediatoolkitbot)
RewriteCond %{HTTP_USER_AGENT} !(WP\sFastest\sCache\sPreload(\siPhone\sMobile)?\s*Bot)
RewriteCond %{REQUEST_METHOD} !POST
RewriteCond %{REQUEST_URI} !(\/){2}$
RewriteCond %{REQUEST_URI} \/$
RewriteCond %{QUERY_STRING} !.+
RewriteCond %{HTTP:Cookie} !wordpress_logged_in
RewriteCond %{HTTP:Cookie} !comment_author_
RewriteCond %{HTTP:Cookie} !woocommerce_items_in_cart
RewriteCond %{HTTP:Cookie} !safirmobilswitcher=mobil
RewriteCond %{HTTP:Profile} !^[a-z0-9\"]+ [NC]
RewriteCond %{HTTP_USER_AGENT} !^.*(\bCrMo\b|CriOS|Android.*Chrome\/[.0-9]*\s(Mobile)?|\bDolfin\b|Opera.*Mini|Opera.*Mobi|Android.*Opera|Mobile.*OPR\/[0-9.]+|Coast\/[0-9.]+|Skyfire|Mobile\sSafari\/[.0-9]*\sEdge|IEMobile|MSIEMobile|fennec|firefox.*maemo|(Mobile|Tablet).*Firefox|Firefox.*Mobile|FxiOS|bolt|teashark|Blazer|Version.*Mobile.*Safari|Safari.*Mobile|MobileSafari|Tizen|UC.*Browser|UCWEB|baiduboxapp|baidubrowser|DiigoBrowser|Puffin|\bMercury\b|Obigo|NF-Browser|NokiaBrowser|OviBrowser|OneBrowser|TwonkyBeamBrowser|SEMC.*Browser|FlyFlow|Minimo|NetFront|Novarra-Vision|MQQBrowser|MicroMessenger|Android.*PaleMoon|Mobile.*PaleMoon|Android|blackberry|\bBB10\b|rim\stablet\sos|PalmOS|avantgo|blazer|elaine|hiptop|palm|plucker|xiino|Symbian|SymbOS|Series60|Series40|SYB-[0-9]+|\bS60\b|Windows\sCE.*(PPC|Smartphone|Mobile|[0-9]{3}x[0-9]{3})|Window\sMobile|Windows\sPhone\s[0-9.]+|WCE;|Windows\sPhone\s10.0|Windows\sPhone\s8.1|Windows\sPhone\s8.0|Windows\sPhone\sOS|XBLWP7|ZuneWP7|Windows\sNT\s6\.[23]\;\sARM\;|\biPhone.*Mobile|\biPod|\biPad|Apple-iPhone7C2|MeeGo|Maemo|J2ME\/|\bMIDP\b|\bCLDC\b|webOS|hpwOS|\bBada\b|BREW).*$ [NC]
RewriteCond %{DOCUMENT_ROOT}/wp-content/cache/all/$1/index.html -f [or]
RewriteCond /home/XXX/XXX/wp-content/cache/all/$1/index.html -f
RewriteRule ^(.*) "/wp-content/cache/all/$1/index.html" [L]
</IfModule>
<FilesMatch "index\.(html|htm)$">
AddDefaultCharset UTF-8
<ifModule mod_headers.c>
FileETag None
Header unset ETag
Header set Cache-Control "max-age=0, no-cache, no-store, must-revalidate"
Header set Pragma "no-cache"
Header set Expires "Mon, 29 Oct 1923 20:30:00 GMT"
</ifModule>
</FilesMatch>
# END WpFastestCache
# BEGIN GzipWpFastestCache
<IfModule mod_deflate.c>
AddType x-font/woff .woff
AddType x-font/ttf .ttf
AddOutputFilterByType DEFLATE image/svg+xml
AddOutputFilterByType DEFLATE text/plain
AddOutputFilterByType DEFLATE text/html
AddOutputFilterByType DEFLATE text/xml
AddOutputFilterByType DEFLATE text/css
AddOutputFilterByType DEFLATE text/javascript
AddOutputFilterByType DEFLATE application/xml
AddOutputFilterByType DEFLATE application/xhtml+xml
AddOutputFilterByType DEFLATE application/rss+xml
AddOutputFilterByType DEFLATE application/javascript
AddOutputFilterByType DEFLATE application/x-javascript
AddOutputFilterByType DEFLATE application/x-font-ttf
AddOutputFilterByType DEFLATE application/vnd.ms-fontobject
AddOutputFilterByType DEFLATE font/opentype font/ttf font/eot font/otf
</IfModule>
# END GzipWpFastestCache
# BEGIN LBCWpFastestCache
<FilesMatch "\.(ico|pdf|flv|jpg|jpeg|png|gif|webp|js|css|swf|x-html|css|xml|js|woff|woff2|ttf|svg|eot)(\.gz)?$">
<IfModule mod_expires.c>
AddType application/font-woff2 .woff2
ExpiresActive On
ExpiresDefault A0
ExpiresByType image/webp A2592000
ExpiresByType image/gif A2592000
ExpiresByType image/png A2592000
ExpiresByType image/jpg A2592000
ExpiresByType image/jpeg A2592000
ExpiresByType image/ico A2592000
ExpiresByType image/svg+xml A2592000
ExpiresByType text/css A2592000
ExpiresByType text/javascript A2592000
ExpiresByType application/javascript A2592000
ExpiresByType application/x-javascript A2592000
ExpiresByType application/font-woff2 A2592000
</IfModule>
<IfModule mod_headers.c>
Header set Expires "max-age=2592000, public"
Header unset ETag
Header set Connection keep-alive
FileETag None
</IfModule>
</FilesMatch>
# END LBCWpFastestCache
# BEGIN WordPress
<IfModule mod_rewrite.c>
RewriteEngine On
RewriteBase /
RewriteRule ^index\.php$ - [L]
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule . /index.php [L]
</IfModule>

# END WordPress

veći ti htaccess nego li sve fotke na sajtu :smile:

3 Likeova

Ja sam ovom ■■■■ kevu :smiley:

Odavno nisam koristio free cache plugin (neda mi se placat jos jednu licencu wp rocketa) pa sve selektirao sto mi nudi :stuck_out_tongue:

Neznam sto radit… isto koristim i cloudflare, ali ovaj plugin iskljuci neke postavke, instaliram drugi plugin nema uopce cloudflare u opciji itd itd neznam vise sto radit, sada sam izbrisao sve slike i opet nade neke lijeve kojih uopce nema na sajtu odnosno ima, ali to su neki pathovi za poludit.

uopšte nemojte koristiti caching plugine … ja sam izbacio cache plugin ostavio samo cloudflare i preporodio sam se

1 Like

Ja ne koristim ni cache ni CloudFlare. CloudFlare je ok, ali mi je kršio stranicu na HT-u. Posjetitelji sa HT (A)DSL, mobilnih mreža, Bonbon kada bi otvorili stranicu bila bi užas. CSS se ne bi učitao. Odustao od njega i sada koristim isključivo htaccess. Nije perfektno, ali je sasvim solidno s obzirom da su kod mene uglavnom fotografije.
Što se tiče scaled image u pitanju je tema. Tema smanjuje veličinu slike putem koda. Ukoliko si u mogućnosti trebao bi promijeniti veličinu slike u onu u kojoj se prikazuje na stranici ( https://gtmetrix.com/serve-scaled-images.html )

Evo dva linka koje ja koristim za optimizaciju:
https://perishablepress.com/

1 Like

Plugin za smanjenje slika? A da ubaciš i neki za uvećavanje, može da zatreba? :slight_smile:
Ma dajte ljudi, kakvi plugini, htaccess i kodiranja kad se to rešava prosto u Photoshopu i sl. programima.
Skaliranje znači promeniti dimenzije slika na one koje su dovoljne stranici. Na pr. ako je logo 80x80 nema poptrebe da koristi sliku logoa 500x500. Kada se promene dimenzije ima opcija u Photoshopu, “Save for web”, kako bi se brže učitala, jel slike na webu trebaju imati što manje KB.
Ima i programa za kompresiju slika, sve u cilju da se brže učitaju na sajtu.

Edit. htaccess se može koristiti kod slika koje nećete menjati pa onda nema potrebe da budu keširane, mada ima plugina koji to rešavaju.

Tako je Tomas, plugini i posebni kodovi su nepotrebni, neće ni raditi dobro. Potreban je poseban program kojim ćeš komprimirati sliku PRIJE slanja online. :+1:
To nećeš moći u Photoshopu, ali meni npr. izvanredno radi “Professional Image Optimizer” koji je free (ne sjećam se čak jesam li ga već i imao u Windowsu 7) i smanjuje veličinu slike ovisno o formatu i drugim karakteristikama, ali najčešće i do 30% veličine, sve bez primijeta u kvaliteti. :blush: :o:

1 Like

Plugin Smush može biti od koristi :wink:

Mislio sam na Photoshop za skaliranje. Koristim Riot za komprimiranje, a hvala ti za ovaj Image Optimizer, vidim dobro radi, no problem je ako se previše komprimira slika, može izgubiti na kvaliteti. Na telefonu se to neće primetiti ali na HD ekranima hoće.
I ključ za pro mi pošalji :wink:

To je provjereno više nego dobro. Savjetujem da ostaviš defaultne vrijednosti podešavanja jer je tako najbolje. Naravno da ne možeš napraviti da Full HD fotografija bude npr. 25 Kb-a, ali vidi ovu naprimjer, velika je svega 165 Kb pri Full HD. :blush:
Ispričavam se što vas stalno pilam s nogometom. :smile:

(Vidim da je smanjuje u pixelima ako radiš download odavde, no to je zbog Foruma valjda, kod mene je tako kako sam napisao)
Ajmo Vatreni, još malo. :blush: :o:

1 Like