Myspace Profile 1.0 - Imageready Slicing Tutorial | Help | SignOut   
Powered by Google
Home  |  Browse  |  Search  |  Invite  |  Film  |  Mail  |  Blog  |  Favorites  |  Forum  |  Groups  |  Events  |  Videos  |  Music  |  Comedy  |  Classifieds
Post a reply to this Topic

Groups » go away » Topics » Image Slicing

Click here to go back to the BBZ/Katamari Myspace Code Index
Listing 1-1 of 1    1   of  1
Author Message

Instant Message
Send Message
Reply with this quote Reply to this Post Posted:  Jan 21, 2007 12:24 PM
Once you get your graphic for you layout finished in Photoshop you'll want to open it in ImageReady.

You can do this by either pressing this button, located on the bottom of the tool bar, or by pressing ctrl+shift+M

This will take everything you have done and open it in ImageReady. From there you want to select the slicing tool and start dragging it across your image to create your slices. You may find it helpfull to go to view → snap. This will make your slices snap with your layers and make your slices a little more managable.

Once you have all your slices made, select the Slice Select Tool. Click on the individual slices. From here you'll need to do two things. First, if the particular slices is to be a clickable link, enter the url for the slice in the slice menu.

The second thing you will need to do is decided how each slice will be saved. You can mix and match between jpeg and gif file types. It might be a good idea to save pictures as jpeg and text as gif.

Once you've done this for all slices and are ready to save go to file → save optimized as and save your slices as HTML and Images

After you've saved your slices open the html document in your browser by going to file → open file. This will bring up your image, already put together. If you've assigned urls to any of the slices you can test them here as well.

From here you need to view the source. Right Click anywhere NOT on the image and select view page source. Once you've done this copy everything between this:

<!-- ImageReady Slices (Untitled-1) -->

<!-- End ImageReady Slices -->

and paste it into notepad. You will also need to upload your individual slice images that ImageReady has made for you to a host such as Photobucket. These will be saved in a folder named images alongside your HTML document.

Once you've uploaded your slices, take the url of the image and paste it into the proper area of your source code you have open in notepad.

Your url will look something like this:

and put it into the corresponding area of your coding, in this case it will look like this:
<img src="images/Untitled-1_01.jpg" width="440" height="40" alt="">

After you have pasted in all your individual image urls you are basically done. Save the document in notepad and then set up your page by first Hiding Everything and then adding in your div. Your codes that you have saved in notepad will go inside your div.
Listing 1-1 of 1    1   of  1

Post a reply to this Topic

dspPostReplies - myspace_forums_post

About | FAQ | Terms | Privacy | Safety Tips | Contact MySpace | Report Abuse |   Promote! | Advertise | MySpace International
©2003-2007 All Rights Reserved.