Change Portfolio Image Size

dr4shop's picture
dr4shop
Fri, 03/20/2015 - 12:42
#1
Change Portfolio Image Size

Hello,
I need to change the size of the media section in the portfolio detail block (from 580 pixel width to 350 pixel width), because the space for the contet (350px, is to narrow.

I have done the modification to the css and to the portfolio block template as needed and the form is correctly shown.

Anyways the media file image is alway resized to 580 width wide.
I have seen that this is done in the portfolio content definitio after it is saved.
It is always put in the portfolio_previes/public folder and it is resized just after the content is saved.

How can I change this behaviour in order to size it to 350px wide and not to 580px wide
I wasn't able to find this settings anywhere
Thanks
Dario

cindy's picture
cindy
Mon, 03/23/2015 - 06:08

Hi,

You did CSS modification and it showed correclty, didn't you?

Then, what is the problem? Could you please send us your site url and some screenshots here so that we can take a look at your problem

dr4shop's picture
dr4shop
Mon, 03/23/2015 - 07:08

Hi Cindy,

    the problem is the one that I have described.

The page look correctly, but the uploaded media is enlarged and still has the old dimension.

For what I was able to understand, the uploaded image is modified at the time of upload or, to be mor esure, when the content is saved.

In fact, if I create a content of type portfolio, I can add one or more media using the existing media asset field.

The images are uploaded correctly. Then, when the content is saved, at that specific moment, the images are elaborated and a modified version is saved on the sites/default/files/styles/portfolio_preview/public folder.  The image is always save at 580x480 pixels, which means that the image is resized and then cut to that size. Then, when it is shown on the site, only the 350 left pixels are shown.

I suppose there is a hook for the content save to do this. But I wan not able to find it to change.

Can you let me know where to act to modify this behaviour?

to let you understand I attach some screenshots and the link to the site.

Let me know if you need more information

This is the image I want to upload. It is 350x480 pixels and it is the size is should be shown.

Image title

This is the image resized automatically after it is uploaded and the content is saved. It is 580x480 px, which means that it is resized to 580px wide, then it is cutt to 480px height, which means that the bottom otìf the image is cut off.

Image title

this is the image shown in the page. As you can see, only the first 350px on the left are shown.

Image title

adn the strange thing happen if I hadd more than one image: when it shows the second image, the remaining 230px on the right of the first image are overlapped with the new image:

Image title

If I check with FireBug. I see that even if only the first 350px on the left are shown, the image is sized to 580px. Perhaps the not shown pixels are covered by other elements:

Image title

For this I suppose that it depends on the fact that the image is resized to 580x480px at time of save and, should it be changed, everything should start working correctly.

I have also seen oin your code that, for images in particular, you explicitely mention the portfolio_preview folder. In fact in the node template for the portfolio block, you write:

    if($file_type != 'image') {
        $media_content .= '<li>'.render($content['field_portfolio_multimedia'][$key]).'</li>';
    } else {
        $media_content .= '<li><img src="'.image_style_url('portfolio_preview',$image_uri).'"/></li>';
    }

In addition to this, I haven't yet tried with the video's, but I will soon need it.

If I try with your predefined content, I see that it is shown in the following way:

Image title

so even the video is cut to the left 350px, so I am afraid I would have the same problem with videos.

What can I do?

the site is www.omniabpm.com/omniadev

the problem is in the front page, at the portfolio element

Regards

Dario Russo

dr4shop's picture
dr4shop
Mon, 03/23/2015 - 13:10

Hi Cindy,

  I was able to find the solution.

I have seen that the resize of the image is done using a style in the image module, so I have changed that style and the upload of image started working correctly.

I am still wondering if there will be any problem with videos, but for the moment I do not have the issue anymore.

Should I have  a problem with videos, I will write you when it arises. For the moment thanks for your support

Regards

Dario

Log in or register to post comments
Have More Idea?

We are here to build your website!

No Universal solution fits all special business requirements. Our experienced team is ready with ideas and state-of-the-art technical solutions to consult the best solution within your budget.