abonnementen ibood.com bol.com Gearbest
pi_170699278
registreer om deze reclame te verbergen
Goedendag FOKkers,

Een deel van mijn baan is het onderhouden van een website en social media platform voor een keukenwinkel. Deze website werkt met wordpress, de meeste dingen lukken mij dan ook prima. Bij sommige webpagina's vervormen de afbeeldingen echter, en ik heb geen flauw idee hoe dit te verhelpen is. Hieronder een voorbeeld:

http://www.coenenhelmond.nl/product-categorie/koken/

Als deze plaatjes simpelweg vierkant zouden zijn in plaats van rechthoekig zou dit probleem volgens mij al opgelost zijn. Ik hoor graag of iemand mij hiermee kan helpen.

Met vriendelijke groet,

Queenshore
pi_170700071
ten eerste vind ik de kwaliteit van de images te laag,
en het stretchen e.d. komt omdat de preview tiles een vaste grootte van miniatuur verwacht.
als je afwijkt van deze standard formaten worden ze gestreched naar het juiste formaat lijkt me.

dit is een aanname aangezien ik niet weet hoe deze site precies in elkaar steekt.

ik zou de miniatuur zonodig handmatig maken in de juiste formaten en deze erop zetten (met de goede kwaliteit)

[ Bericht 0% gewijzigd door kovenant op 05-05-2017 10:33:26 ]
  Moderator vrijdag 5 mei 2017 @ 11:37:00 #3
34614 crew  jogy
Hersenflatulent
pi_170701269
Je moet de foto's in de juiste verhouding knippen. Dat hoe dan ook. Want nu heb je een foto met een rechthoekige verhouding die je in een vierkant wil proppen zeg maar en dan vervormd het. Dat zoutvaatje bijvoorbeeld, je propt nu een 'lang' plaatje in een breed kader. Dat werkt niet. Dus als het kader 150*100 is (100 hoog en 150 breed) en je plaatje is 1772 hoog 1535 breed komt het niet goed. En als je het goed knipt zijn de foto's ook niet meer zo lelijk denk ik.
Iedereen is de hoofdrolspeler van zijn eigen comedie.
'Goatboy is hurt by your indifference'
Vrijheid
Dean Radin presenteert: "Science and the taboo of psi"
  Moderator vrijdag 5 mei 2017 @ 11:43:15 #4
279246 crew  HeaN82
(PAINT) ......................
pi_170701429
registreer om deze reclame te verbergen
Ik zie dat je bij elke afbeelding een andere resolutie gebruikt, hier kan het weleens fout gaan.

700x660 http://www.coenenhelmond.(...)812E282BF0A91B1C.jpg
1024x1024 http://www.coenenhelmond.(...)kpot-duraceramic.jpg
978x446 http://www.coenenhelmond.(...)3/05/Demeyere-07.jpg

Woocommerce maakt er automatisch 150x150 van, dan gaat de afbeelding met de resolutie van 978x446 enorm stretchen.

Zorg dat alle afbeeldingen dezelfde resolutie hebben, bijvoorbeeld 1000x1000 of 300x300 (liever iets groter dan kleiner)
Maar je zal wel moeten snijden in afbeeldingen zoals ik hier heb gedaan http://i.imgur.com/AmlsfXE.jpg
pi_170804703
Bedankt voor jullie reacties allemaal. Ik heb niet bijzonder veel ervaring met wordpress dus dit komt van pas. Toch begrijpt niemand exact wat ik bedoel, bij de link die ik stuurde zou ik de afbeeldingen graag als vierkanten zien ipv rechthoeken. Aangezien de meeste afbeeldingen die geupload zijn vierkant zijn, zou dit het probleem op moeten lossen. Is dit mogelijk?

Mvg
pi_170807310
quote:
0s.gif Op dinsdag 9 mei 2017 18:44 schreef Queenshore het volgende:
Bedankt voor jullie reacties allemaal. Ik heb niet bijzonder veel ervaring met wordpress dus dit komt van pas. Toch begrijpt niemand exact wat ik bedoel, bij de link die ik stuurde zou ik de afbeeldingen graag als vierkanten zien ipv rechthoeken. Aangezien de meeste afbeeldingen die geupload zijn vierkant zijn, zou dit het probleem op moeten lossen. Is dit mogelijk?

Mvg
Om dit op te lossen moet de resolutie van je WooCommerce thumbnails sowieso omhoog, dit kan je volgens mij zelf instellen. Probeer eens 250px breed. Daarnaast zal er wat styling aangepast moeten worden (kan je CSS?).

Wat er nu namelijk gebeurt is dat de afbeelding (vierkant of niet) geresized wordt naar 150x150. Vervolgens wordt de afbeelding ingeladen in de pagina, waar deze een ruimte heeft van (bij mijn desktop resolutie tenminste) 194px en de styling zo is ingesteld dat de afbeelding alle mogelijke ruimte (in de breedte) inneemt.

Als de breedte van een afbeelding ingesteld wordt, is het normaal dat de hoogte niet (geforceerd) wordt ingesteld zodat deze automatisch de verhoudingen van de afbeelding behoudt als deze gaat schalen.

Dit is bij jou echter niet het geval. De hoogte wordt geforceerd op 150px. Hierdoor krijg je een afbeelding van 150x150 die getoond wordt als een afbeelding van 194x150. Uitgerekt en rechthoekig dus.

Naast de wijziging van 150px naar 250px zou een CSS wijziging om de hoogte weer automatisch te laten bepalen (height: auto; met evt een !important), voldoende moeten zijn.

Edit: Los van deze wijzigingen moeten je afbeeldingen natuurlijk allemaal wel vierkant zijn zodat ze fatsoenlijk terugschalen naar 150x150 (na je wijziging 250x250). Dat is bij deze niet het geval, die haalt 150px hoogte niet.

[ Bericht 2% gewijzigd door Azerdion op 09-05-2017 20:14:24 (toevoeging) ]
pi_171021596
registreer om deze reclame te verbergen
quote:
0s.gif Op dinsdag 9 mei 2017 20:09 schreef Azerdion het volgende:

[..]

Om dit op te lossen moet de resolutie van je WooCommerce thumbnails sowieso omhoog, dit kan je volgens mij zelf instellen. Probeer eens 250px breed. Daarnaast zal er wat styling aangepast moeten worden (kan je CSS?).

Wat er nu namelijk gebeurt is dat de afbeelding (vierkant of niet) geresized wordt naar 150x150. Vervolgens wordt de afbeelding ingeladen in de pagina, waar deze een ruimte heeft van (bij mijn desktop resolutie tenminste) 194px en de styling zo is ingesteld dat de afbeelding alle mogelijke ruimte (in de breedte) inneemt.

Als de breedte van een afbeelding ingesteld wordt, is het normaal dat de hoogte niet (geforceerd) wordt ingesteld zodat deze automatisch de verhoudingen van de afbeelding behoudt als deze gaat schalen.

Dit is bij jou echter niet het geval. De hoogte wordt geforceerd op 150px. Hierdoor krijg je een afbeelding van 150x150 die getoond wordt als een afbeelding van 194x150. Uitgerekt en rechthoekig dus.

Naast de wijziging van 150px naar 250px zou een CSS wijziging om de hoogte weer automatisch te laten bepalen (height: auto; met evt een !important), voldoende moeten zijn.

Edit: Los van deze wijzigingen moeten je afbeeldingen natuurlijk allemaal wel vierkant zijn zodat ze fatsoenlijk terugschalen naar 150x150 (na je wijziging 250x250). Dat is bij deze niet het geval, die haalt 150px hoogte niet.
Ik snap natuurlijk het idee van afbeeldingen forceren in een vorm die niet bij de afbeelding "hoort". Alleen de 1e alinea van jouw bericht is niet helemaal duidelijk vooe mij. Zoals ik al zei, ik weet hoe ik berichten etc op de website zet, maar voor de rest ben ik een leek wat wordpress betreft. Vandaar dat ik hier op dit forum zit.

Mvg
pi_171022633
Ik denk dat ik het idee met de afbeeldingen wel snap. Ik wil alleen een "regenerate thumbnails" plugin installeren. Ik heb alleen geen toestemming om plugins te veranderen of zelfs te zien? Weet iemand wat ik hieraan kan doen?

Mvg
  Moderator donderdag 18 mei 2017 @ 10:32:50 #9
34614 crew  jogy
Hersenflatulent
pi_171022806
quote:
1s.gif Op vrijdag 5 mei 2017 09:49 schreef Queenshore het volgende:
Als deze plaatjes simpelweg vierkant zouden zijn in plaats van rechthoekig zou dit probleem volgens mij al opgelost zijn. Ik hoor graag of iemand mij hiermee kan helpen.
quote:
0s.gif Op dinsdag 9 mei 2017 18:44 schreef Queenshore het volgende:
Bedankt voor jullie reacties allemaal. Ik heb niet bijzonder veel ervaring met wordpress dus dit komt van pas. Toch begrijpt niemand exact wat ik bedoel, bij de link die ik stuurde zou ik de afbeeldingen graag als vierkanten zien ipv rechthoeken. Aangezien de meeste afbeeldingen die geupload zijn vierkant zijn, zou dit het probleem op moeten lossen. Is dit mogelijk?

Mvg
Je hebt twee mogelijke oplossing voor dit probleem.

1) Pas de te uploaden plaatjes aan die je wil gebruiken zodat deze in dezelfde beeldverhouding zitten als de thumbnail waar je ze in zet. (Relatief makkelijk met bijvoorbeeld Gimp of zelfs ingebouwde foto bewerkingsprogramma's van Windows volgens mij)

2) Pas de template aan. Als je de template aan wil passen moet je in ieder enig geval verstand hebben van het bouwen van internet pagina's, en misschien zit er ergens in de template instellingen wel de mogelijkheid om de beeldverhoudingen aan te passen maar dat weten we hier niet omdat we daar niet kunnen kijken. Elke Wordpress template is namelijk weer anders.

In het geval van het zoutvaatje van je site is deze niet vierkant http://www.coenenhelmond.nl/wp-content/uploads/2017/04/600025.jpg maar er zit meer dan 200 pixels verschil in de breedte en hoogte 1772 (hoog) 1535 (Breed) en blijkbaar kan de template niet goed met dat verschil om gaan. *waarschijnlijk* vind de template het minder erg als je foto breder is dan hoog maar vindt ie hoger dan breed wel lastig.
Iedereen is de hoofdrolspeler van zijn eigen comedie.
'Goatboy is hurt by your indifference'
Vrijheid
Dean Radin presenteert: "Science and the taboo of psi"
abonnementen ibood.com bol.com Gearbest
Forum Opties
Forumhop:
Hop naar:
(afkorting, bv 'KLB')