Articles

WooCommerce Docs

Majoritatea incidentelor cu imagini neclare sunt cauzate de stilul temei, ceea ce înseamnă că designul temei are dimensiuni ale imaginii în pixeli care s-ar putea să nu se potrivească cu WooCommerce.

Actualizare începând cu WooCommerce 3.3 Înapoi sus

WooCommerce versiunea 3.3 și versiunile ulterioare vin cu suport pentru a face temele compatibile cu WooCommerce și îmbunătățiri la redarea și decuparea dimensiunilor imaginilor. Aceste noi caracteristici înseamnă că:

  • Imaginile neclare cauzate de incompatibilitatea temei sau de suprapunerea codului nu ar mai trebui să apară.
  • Proprietarii de magazine pot controla lățimea și înălțimea imaginilor lor principale.
  • Redimensionarea miniaturilor se poate face automat sau manual.
  • Imaginile afișate clienților arată întotdeauna foarte bine în mod implicit, astfel încât produsele dvs. să continue să se vândă singure!

Pentru a învăța cum să folosiți aceste noi caracteristici, mergeți la: Gestionarea produselor și Adăugarea de imagini și galerii de produse.

Alte soluții Înapoi sus

Dacă utilizați o versiune de WooCommerce anterioară versiunii 3.3, vă recomandăm să actualizați la cea mai recentă versiune pentru a beneficia de caracteristicile descrise mai sus.

Dacă, din anumite motive, nu doriți să utilizați cea mai recentă versiune sau dacă actualizarea la 3.3 nu rezolvă problema cu care vă confruntați, ar putea fi:

  • Setările dvs. de dimensiune a imaginii sunt prea mici.
  • Imaginile originale trebuie să aibă o rezoluție mai mare.

Pentru a rezolva acest lucru:

  • Dimensiunile imaginii dvs. ar trebui să se potrivească sau să fie mai mari decât cele ale temei dvs.
  • Imaginile originale pe care le încărcați ar trebui să fie de cel puțin 800 x 800px sau mai mari pentru a funcționa pentru majoritatea temelor.

Îți arătăm cum să găsești dimensiunea maximă a imaginii pe care o dorește tema ta în videoclipul și mai jos.

Tipuri de imagine Înapoi sus

  • Imagine unică de produs: Cea mai mare imagine de pe pagina de detalii a produsului individual și se referă la imaginea principală/caracteristică.
  • Imagini de catalog: Imagine de mărime medie utilizată în buclele de produse, cum ar fi pagina Magazin, paginile de categorii de produse, Produse înrudite, Vânzări ascendente și Vânzări încrucișate.
  • Imagini în miniatură ale produselor: Cea mai mică imagine utilizată în mod obișnuit în coșul de cumpărături, în widget-uri și în imaginile de galerie (opțional) de sub imaginea produsului unic.

Dimensiuni standard ale imaginii Înapoi sus

În WooCommerce versiunea 3.2x și versiunile ulterioare, setările Imaginii produsului pot fi găsite la WooCommerce > Settings > Products > Display > Product Images. Rețineți că primul număr este lățimea și al doilea înălțimea.

Since WC 2.3, these settings are located in WooCommerce > Settings > Products > Display

Imaginile pe care le încărcați sunt redimensionate pentru a se potrivi cu valorile pe care le introduceți. De exemplu, dacă setările dvs. sunt 100×100 și încărcați o imagine de 300×600, aceasta este redimensionată la 100×200. De asemenea, puteți alege să „hard crop” imaginile, ceea ce le forțează să aibă dimensiunea specificată în setări, indiferent de imaginea brută pe care o încărcați, astfel încât acestea sunt mai degrabă decupate decât distorsionate la scară.

Dacă modificați setările după ce ați încărcat imaginile produsului, trebuie să regenerați miniaturile în WordPress pentru ca modificările să se aplice. Pentru a face acest lucru, vă recomandăm să utilizați pluginul Regenerate Thumbnails.

De la versiunea 3 a WooCommerce.3, setările pentru imaginea produsului pot fi găsite în Customizer, în WooCommerce > Product Images:

Căutați dimensiunile imaginii produsului din temă Înapoi sus

Tema pe care ați ales-o deleagă dimensiunea maximă pe care o va avea o imagine, așa că trebuie să știți dimensiunile în care le redă pentru a le seta în WooCommerce.

Imagini catalog Înapoi sus

Determinați unde tema dvs. redă cele mai mari miniaturi de catalog. În unele cazuri, aceasta este pagina magazinului; în tema Twenty Eleven, este în bucla produselor conexe.

Cu instrumentele pentru dezvoltatori activate în browserul ales, puteți face clic dreapta pe imagine și să selectați „Inspect” sau „Inspect Element”. Acest lucru vă va spune care sunt dimensiunile imaginii. Notați acest lucru, deoarece trebuie să le folosim mai târziu.

WooCommerce Product Image - Thumbnail Size

În Storefront (mai sus), cele mai mari imagini de catalog sunt redate la 213 x 213px.

Single Product Image Back to top

Repetați procesul pentru imaginea unui singur produs – cea mai mare imagine de pe o pagină de produs.

WooCommerce Product Image - Product Featured Image

În Storefront, cea mai mare imagine unică de produs este redată la 298 x 298px.

Product Thumbnail Back to top

Cea mai mică este probabil miniatura din galeria de produse. Repetați procesul de inspecție pentru a obține dimensiunile.

WooCommerce Product Image - Product Gallery

În Storefront, se redă la 43 x 43px.

Ajustați dimensiunile imaginii și regenerați miniaturile Înapoi sus

Acum că toate dimensiunile imaginilor miniaturale pentru tema noastră specifică sunt cunoscute, putem adăuga aceste noi dimensiuni la WooCommerce pentru a ne asigura că dimensiunile viitoare ale imaginilor vor fi de această mărime sau mai mari.

În WooCommerce > Setări > Produse > Afișare, asigurați-vă că dimensiunile maxime ale imaginilor sunt cel puțin la fel de mari ca dimensiunile pe care tema dvs. le redă pentru acele miniaturi. Apoi salvați modificările.

Toate imaginile de produse noi care sunt încărcate vor avea acum miniaturi în aceste setări și ar trebui să apară fără distorsiuni sau neclarități.

Notă: Salvarea modificărilor nu actualizează automat toate imaginile de produse încărcate anterior. Pentru a actualiza imaginile vechi, WordPress trebuie să regenereze miniaturile. Un plugin grozav care face exact acest lucru este Regenerate Thumbnails.

Suport retina Înapoi sus

Ecranele HiDPI, cunoscute în mod obișnuit sub numele de ecrane retina, conțin de două ori mai mulți pixeli, sau mai mulți, decât ecranele mai vechi. Pentru imagini perfecte din punct de vedere al pixelilor pe afișajele retina, setați miniaturile dvs. să fie de două ori mai mari decât dimensiunea redată de temă. De exemplu, dacă o temă redă imaginile la 80 x 80px, doriți ca acestea să fie de 160 x 160px.

.