Extra afbeeldingsfuncties

Ik vindt de manier waarop OC met afbeeldingen omgaat geweldig. Het bewaren van het orgineel en dynamisch resizen en cashen van afbeeldingen is geweldig. Een groot nadeel ervan vind ik echter dat ik vaak wordt getrakteerd met witruimte omdat elke afbeelding in zijn geheel wordt getoond. Omdat ik zelf een CMS gemaakt heb waarin ik altijd probeer zoveel mogelijk met het ontwerp van websites rekening te houden heb ik een tweetal functies van mijn CMS toegevoegd aan OC zodat als je een afbeelding wilt van 200x300 deze ook volledig gevuld wordt met de foto. Ik heb hiervoor de system>library>image uitgebreid en de catalog>model>tool>image met de functies "cropsize" en "onesize".

Cropsize:
Deze functie genereerd een uitsnede van de foto met de afmetingen zoals je deze opgeeft in het beheer. In de controller van categories staat bijv:

'thumb' => $this->model_tool_image->resize($image, $this->config->get('config_image_category_width'), $this->config->get('config_image_category_height'))
);

Als je deze nu vervangt door

'thumb' => $this->model_tool_image->cropsize($image, $this->config->get('config_image_category_width'), $this->config->get('config_image_category_height'))
);
Danwordt een uitsnede gemaakt vanuit het midden naar de zijkanten. De afbeelding wordt verschaald zodat de breedte of de hoogte past binnen het gebeid wat je opgeeft.

Onesize:
Deze functie gebruik ik zelf voor de grote weergave bij productdetails. Ik vindt het zelf onnodig om bij een popup witruimte rond de afbeelding te zien. Deze functie heeft maar 1 waarde nodig en verschaald de grootste waarde van het orgineel naar de opgegeven waarde.
In de product controller heb ik dus dit:

'popup' => $this->model_tool_image->resize($result['image'] , $this->config->get('config_image_popup_width')),
'thumb' => $this->model_tool_image->resize($result['image'], $this->config->get('config_image_additional_width'), $this->config->get('config_image_additional_height'))

vervangen door:

'popup' => $this->model_tool_image->onesize($result['image'] , $this->config->get('config_image_popup_width')),
'thumb' => $this->model_tool_image->cropsize($result['image'], $this->config->get('config_image_additional_width'), $this->config->get('config_image_additional_height'))

Nu heb ik dus voor de popup een verschaalde afbeelding zonder extra witruimte en de afbeeldingen daaronder (de kleine thumbs) zijn vierkant en helemaal gevuld. Met de cropsize functie kan het wel zo zijn dat er delen wegvallen van een foto maar dat neem ik zelf voor lief. Uiteindelijk ziet de gebruiker het volledige product op de productpagina. Ik heb de files met de image functie als zit erbij gedaan. Doe er je voordeel mee of helemaal niks.

NB. de files in de zip bevatten de standaard OC image functies + de extra functies. Je moet zelf de keuze maken waar je welke functie gebruikt en dit in de controller aanpassen. Standaard wordt resize() gebruikt maar kan nu vervangen worden door cropsize() en onesize().

Heel erg bedankt hiervoor zocht er al een tijdje naar.

Groeten

Super, daar doe ik het voor! Veel plezier ermee.

Heel erg bedankt voor deze oplossing!

Graag gedaan!

Thank you!
Works great with OC 1.5.4

Thanks man! In case you're in Poland, there will be a beer waiting for you (or 2)

I want the same feature to be incorporated in my website, however have no enough technical knowledge to make these changes. So, I would appreciate if you can explain step-by-step changes are to be done (file-wise) ... it will be great help ...

My objectives are:

1. No white background in images.
2. Width should be fixed as per settings (e.g. 120px), and height can be proportionate according to Width.
3. Images should be aligned bottom

Thanks in advance!

Thanks a ton for the methods. The other solutions affected images in other modules like slideshow. But this one was realy helpful. Thanks