Slicing your images in Freeway4

Here’s a technique for those new to Freeway for creating slices in your published images.

This can be useful if you wish to create a soft deterrent from people casually taking images off your site and it is also a way of adding extra relevant image alt tags on a page with limited images but lots of text. This can sometimes make your web page more search engine friendly.

For those wishing a more robust method of protecting your images you may wish to take a look at Tim Plumb’s shareware action Image Guardian http://www.freewayactions.com/product.php?id=006

[b:bbb1b8574c]Technique for slicing non layer graphics.[/b:bbb1b8574c]

Start off with a non layer graphics box containing the image you wish to slice.

De-check the css Layout tool in your toolbar so it is grey and not blue ( this means the graphics box you draw will create a non layer item )

Select the graphic box tool and pull out an empty graphics box from the left hand side of the box containing the image - you will see your cursor change to a + sign surrounded by a box.

Drag this cursor across your image to the far right side. If you overshoot the cursor icon changes to a + image without the surrounding square. If this happens, drag the outer edge of the box your dragging out back into the image area of the graphic you wish to slice - now hit spacebar to re-reveal the + surrounded by the square and end the action at the right hand side of the image you are slicing.

In graphics item properties -make sure you de-check the combine graphics option for the empty graphic boxes you have added over the image.

Repeat this technique to add further slices.

Now when you preview the page in the browser and drag your mouse down over the image you should see your slices being dragged

NB: If done correctly - when you look in the page panel you should now see the empty graphics boxes indented under the image graphic as children of that item

[b:bbb1b8574c]Technique for slicing a layer image[/b:bbb1b8574c]

A layer graphic image can be sliced the same way - making sure you see the + surrounded by rectangle cursor and again dragging from edge to opposite edge over the image graphic.

However unlike with a non layer graphic image as in the previous example - it does not matter whether you drag out in css layer mode or not using this technique - if you do it correctly the empty graphics box you drag out will become a non layer inset child item once you are complete.

Again make sure you turn off the combine graphics check box for the empty graphic boxes you have drawn over the original image.

quote

further to this tutorial see this post on why I couldn’t select a slice to be a jpg when the slice was a child of the main graphic box: http://www.freewaytalk.net/viewtopic.php?t=474

See also thatkeiths tips here: http://www.freewaytalk.net/viewtopic.php?t=462

quote

I had a large image covering 3 layers of different colors, my antialias could not cope with the 3 and the image looked bad. I sliced it and changed the antialias to be the background appropriate for each layers.

great tool, I wonder if you could slice with polygones? will try later

quote