To start the export process, you click the Export menu option.
TIP: You can press F10 at any time to jump to the export screen from anywhere in the main EZRound program.
On the export page, you will be asked to provide a 3 or 4 character name that will become part of the filename. The point of keeping this short (and only one word) is to keep down the amount of HTML needed to access the image slices.
The first name (in example) defaults to EZ1.
When the export is complete, you would have these files (as itemized in a text file called _EZ1FILES.TXT):
Files created by EZRound for this project [ EZ1]
_EZ1FILES.TXT.....................................This file list
_EZ1Preview.gif...................................Design Preview Image
_EZ1LOCAL.HTM.....................................Local Test file
_EZ1LOCAL.TXT.....................................Local Source file
_EZ1LOCAL_TABLEONLY.TXT...........................Local Source file - Table Only
_EZ1INTERNET.HTM..................................Internet Test file
_EZ1INTERNET.TXT..................................Internet Source file
_EZ1INTERNET_TABLEONLY.TXT........................Internet Source file - Table Only
EZ1UL.jpg.........................................Upper Left Corner Image
EZ1Top.jpg........................................Top Center Image
EZ1UR.jpg.........................................Upper Right Corner Image
EZ1Left.jpg.......................................Left Side Image
EZ1Center.jpg.....................................Center Image
EZ1Right.jpg......................................Right Side Image
EZ1LL.jpg.........................................Lower Left Corner Image
EZ1Bot.jpg........................................Bottom Center Image
EZ1LR.jpg.........................................Lower Right Corner Image
Each file is identified with a description.
If you look close, you can see the significance of the short filename you provided. All of the "EZ1" files are grouped together (easy to find and reuse).
EZRound will save the last short filename that you provided each time so you can increment the number for the next design that you export (EZ2, EZ3, etc.).
The unique naming also allows you to have more than one EZRound design on the same website or on the same web page.
Starting the export...
After you enter your short filename, click the Export Files button to open the export screen.
If you want EZRound to write a HTML container file for you (either as an example of how to use your slices - or as something you can re-use on your website) you must enter the URL to where your design slices will be uploaded.
NOTE: If you are going to be using the design slices in a HTML table created by another program (such as NetObjects Fusion) you can skip entering the URL and select the checkbox that says: "Export Image Slices Only". You may also want to check the box that says: "Export Design Preview GIF". This is a convenient way to be able to preview your design at a later date.
Depending on how you want to use the HTML created by EZRound, you would either enter this as a Direct URL or as a Relative URL. Here is the difference:
A Direct URL would be used if the design slices will be located on a different server than the HTML file that is used to access it. A good example of this would be using the container file with a eBay auction listing. Your design slices will be uploaded to your picture hosting service (note that this would not work if you are using eBay picture services), and then the HTML used to access them would be uploaded (as a part of your listing) to the eBay server.
Since a person viewing your auction listing would be accessing the web page they are looking at from the eBay server, the link between the eBay server and the location of your design slices would be a Direct URL.
An example of a Direct URL would be:
http://www.myphotohosting.com/myfolder/EZ1Top.jpg
A Relative URL would typically be used when you are using your design on your own website. Both the design slices and the HTML container are on the SAME server. So the link between your HTML and your design slices is a Relative URL.
An example of a Relative URL would be:
../assets/images/EZ1Top.jpg
Your hosting center or ISP can provide details of exactly how you need to access your files.
If you want EZRound to generate the container HTML for you, then you can also specify the following information:
Table Width: This setting will force your design to be a certain width. Note that in normal HTML table behavior inserting a larger object (such as a photo) will force the table to expand in size. You can enter the table width in pixels, or add a % (percent) sign to have the table occupy a percentage of the screen width.
Table Height: This setting is optional. If you don't specify it, then the table generated will be the minimum height required to hold your slices and the sample text content. If you switch modes in the Previewer to add more text or a photo, the table will grow in size.
Table Align: This setting will justify the table (left, center, right) in the browser.
Special options:
Export Image Slices Only: If this option is selected, no HTML will be generated - just the design slices.
Export Design Preview GIF: If this option is selected, then a preview image of the design will be generated.
Save as Default Settings: If this option is selected, EZRound will remember the other settings for your next export session.
Open Windows Explorer Folder: If this option is checked, EZRound will open Windows Explorer to the project export folder to give you convenient access to the exported files.
Folder Echo: If this option is enabled a copy of the exported files can be automatically copied to another folder on your computer so the files are ready to use from another software program.
When you are satisfied with your settings, click the Export button to complete the process. EZRound will export the design slices, write the HTML and open a Windows Explorer session in your export folder.
The the EZRound Export Manager (new in Version 3.0) will open:
The EZRound Export manager makes it easy for you to access the files and HTML created by EZRound for your project.
These functions are available:
Open Export Folder: This button opens Windows Explorer to the folder where the project was exported.
Clipboard Manager: The Clipboard Manager makes it easy to copy all (or portions) of the HTML containers to the Windows Clipboard.
Note: There are two sets of copy options. One is for the HTML written to access images in the LOCAL path (on your computer). The other is for HTML written to access images on your Internet Web Server. Be sure that you use the HTML that is correct for your needs (for most users, this will be the "Internet Path" set).
Clipboard Functions:
Copy HTML for Sample Page to Clipboard: This option copies the HTML for the sample page (including the background wallpaper settings if any) to the Windows clipboard. The page starts with the <html> tag and ends with the </html> tag.
Copy HTML for Entire Container to Clipboard: This option copies the HTML for the entire HTML container to the Windows clipboard. The container starts with the <table> tag and ends with the </table> tag.
An example of the entire HTML container is shown here:
<table border="0" width="50%" cellpadding="0" cellspacing="0" align="center">
<tr>
<td width="67"><img src="../assets/images/ez1ul.png" alt="" /></td>
<td width="67" style="background-image:url('../assets/images/ez1top.png')"></td>
<td width="67"><img src="../assets/images/ez1ur.png" alt="" /></td>
</tr>
<tr>
<td width="67" style="background-image:url('../assets/images/ez1left.png')"></td>
<td width="100%" height="" style="background-image:url('../assets/images/ez1center.png')" >
<center>
Your text or photo would insert here
</center>
</td>
<td width="67" style="background-image:url('../assets/images/ez1right.png')"></td>
</tr>
<tr>
<td width="67"><img src="../assets/images/ez1ll.png" alt="" /></td>
<td width="67" style="background-image:url('../assets/images/ez1bot.png')"></td>
<td width="67"><img src="../assets/images/ez1lr.png" alt="" /></td>
</tr>
</table>
HTML Container Splitter
The Export Manager includes an HTML container splitter. This feature makes it simple to separate the first part of the HTML container (which has go in your web page BEFORE the content that you want to appear in the EZRound design) and the SECOND part of the HTML (that has to go in your web page AFTER your content).
Copy First Half of Container to Clipboard: This option copies ONLY the first half of the container to the Windows Clipboard.
An example of the first half of the HTML container is shown here:
<table border="0" width="50%" cellpadding="0" cellspacing="0" align="center">
<tr>
<td width="67"><img src="../assets/images/ez1ul.png" alt="" /></td>
<td width="67" style="background-image:url('../assets/images/ez1top.png')"></td>
<td width="67"><img src="../assets/images/ez1ur.png" alt="" /></td>
</tr>
<tr>
<td width="67" style="background-image:url('../assets/images/ez1left.png')"></td>
<td width="100%" height="" style="background-image:url('../assets/images/ez1center.png')" >
<center>
Copy Second Half of Container to Clipboard: This option copies ONLY the second half of the container to the Windows Clipboard.
An example of the second half of the HTML container is shown here:
</center>
</td>
<td width="67" style="background-image:url('../assets/images/ez1right.png')"></td>
</tr>
<tr>
<td width="67"><img src="../assets/images/ez1ll.png" alt="" /></td>
<td width="67" style="background-image:url('../assets/images/ez1bot.png')"></td>
<td width="67"><img src="../assets/images/ez1lr.png" alt="" /></td>
</tr>
</table>
Modify HTML Container for NetObjects Fusion: This feature was added to make it easy for users of NetObjects Fusion (and similar operational software) to use the HTML container code generated by EZRound for centering web pages.
By default, NetObjects Fusion uses a "publish by asset" folder structure on the webserver that places files and folders like this:
<ROOT> - the "HOME" page ( index.html, etc. ) goes in the "root" public directory of the webserver.
<ASSETS> - this is a directory below the root level of the webserver.
<IMAGES> - this is a directory below the assets level of the webserver.
<HTML> - this is a directory below the root level of the webserver where OTHER HTML files are placed.
As a result of having HTML files in two locations, the HTML needed to reference the EZRound image files (which get uploaded into the IMAGES folder) has to be different for the HOME page than it is for OTHER pages.
The relative path to the images from the HOME page is ./assets/images
The relative path to the images from OTHER pages is ../assets/images
(note the ./ vs the ../ in the path)
By default this feature is "Disabled", meaning that the relative path to the images is exactly as specified on the Export Form.
Selecting the "Home Page" option modifies the relative path generated into the HTML container halves to have ./ in them.
Selecting the "Other Pages" option modifies the relative path generated into the HTML container halves to have ../ in them.
Using the feature: To use the feature all you need to do is select which type of page they want to generate HTML for (Home or Other) and then use the copy to clipboard buttons to place the HTML on the Windows clipboard. Then you paste the HTML into place in the NetObjects Fusion program. See the "centered" tutorial for details at: http://www.ezround.com/centered.
A note on file locations:
By default, EZRound creates a folder called EXPORTS under your My Documents folder. When you enter a short filename, then another folder for that particular export will be created below the EXPORTS folder. In our example (EZ1) the folder setup would bee:
C:\Documents and Settings\CJE\My Documents\EZRound\Export\EZ1
The design slices and HTML would be in this folder.
To use the slices in another program, you would typically copy them to the other programs preferred location. In example: with NetObjects Fusion you would copy the slices to the Assets folder of your NOF project.
If you decide to stop the export process, just click the Cancel button,
Clipboard:
EZRound can also export your unsliced design to the Windows clipboard. This can be useful when you want to paste a copy of it into another program for enhancement (or into an email for a client).
Explorer:
The Explorer icon opens a copy of Windows Explorer at the EXPORTS level of your folders. This is useful when you want easy access to exported designs at a later date.