Fixing sizes of images

[robinantill]

Hi,
I have spent all today trying to find out how to fix the size of images for my Sections. I add a product and then in Section Details add an image. This then shows up as the size it is. From a point of view in displaying the web size quickly the browser needs to know the size of the image, otherwise, all the web page will need to be loaded before anything can be displayed. However, I can not find where the size of the image can be defined. This really ought to be easy as I write my own web pages and understand the makeup on a normal web page.

The size of the image can be different depending on the product and also on which Section the image is on. I am using Standard Layout using CSS. I can go to ProductList and through to CSS Section Link Layout and then amend to make all the images the same size, which is not ideal, but this also makes the the 'bullet' images the same size as well which is a problem.

You can see what my web page looks like on this page http://www.leisurebuildings.com/acat...-security.html where you can see the different size images and the 'bullet' images. The 'bullet' images need to stay the same and the images of the products, either need to be the same size, or ideally to suit.

Thanks,
Regards,
Robin

[NormanRouxel]

Add

width="<actinic:variable name="SectionImageWidth" />" height="<actinic:variable name="SectionImageHeight" />"

to your Section Link layout's image tag.

[robinantill]

Hi Norman,
I have added that code to the image which now reads:- (enclosed jpg) which still have the images at the same size.
How do I define the individual image sizes?
Thanks,
Robin

[leehack]

You dont define the sizes in actinic, you save them as the sizes you want in your image software . Unless you take the easy way out and use browser resizing which is just junk. If you do go the junk route, then only specify the width you want, the height will adjust according to the ratio of the source image then. ie add width="150" for example.

[NormanRouxel]

As Lee says, it's up to you to provide correctly sized images (just like you have to do when making the web pages that you say you know how to do).

If you provide images but force them to display differently (via width= and height= taglets), you get horrible browser resizing that will annoy your customers and make your site look nasty.

If you want to use images of any size but have them converted automatically, it can be done but is not for the faint hearted.

The Advanced Guide has an article "Automatically Rescale Your Product Images to a Certain Size" which can also be adapted to work with Section Images.

Also see http://community.actinic.com/showthread.php?t=34654 where using this for Section images is being discussed.

[robinantill]

Hi Lee and Norman,

Thanks for your help, I will ensure that my images are the size I want them to show on my web pages, which will mean that that they will display at that size.

On my normal web pages I always specify the size of the image which is good web page practice. I did not realise that Actinic does this for you.

i.e. <div class="image_product"><img src="caravan-mobile-home-storage.jpg" border="0" width="200" height="165" alt="Secure Addition Caravan Store" /></div>

It also adds in the Section name as an image alt = alt="Secure Addition Caravan Store" which is even better from a search engine point of view.

Regards,
Robin