The graphics library stores all your images, cascading style sheets (CSS), shockwave, and javascript files that are needed to brand your checkout. It is important to upload everything needed for your checkout screen branding into the graphics library so the pages can be served up securely.

At first, it may seem a little awkward to have a special graphics management piece to the UltraCart branding. Intuitively the graphics could reside on the same web server that a merchants website exists, but the technical details of secure page downloads requires all content (html page and graphics) to come from a secure web server. If some of the content on a page does not come from a secure web server, the secured page icon at the bottom of the web browser will not appear. By using the UltraCart graphics management system (Screen Branding), you can avoid having to purchase a secure server certificate for your server.

There are two sections to this screen; Graphics Files, where you will see your uploaded graphics listed and Upload Graphics, where you actually navigate within your system to identify and locate which graphics are to be uploaded to the UltraCart server.

Figure 128 - Graphics Library Tab
On your first trip to this screen you will see the following message: "There are no graphic files uploaded……" This message will disappear once you upload your first graphic.
You must first know where your graphics reside on your system (which folder). If you know the path to the file, you can simply type it into the "filename" field. If not, click the "Browse" button. A dialog window will appear in your browser. Locate the file on your computer/system and then click OPEN. The filename (path) will appear in the filename field and will look something like this:

Click on the "Upload Graphic(s)" button to complete the upload function.
Note: To make it more convenient for sites with a lot of images we support the uploading of a ZIP file. Compress (zip) your files into one ".Zip" file and upload it in the same manner as explained above. UltraCart will automatically unzip and list them as separate files in the Graphics Library.
Once you've successfully uploaded your graphic, the theme editor screen will change in appearance. Each and every graphic will appear in a list showing its filename and size (in KB). In addition, new buttons will be added and labeled View, Link and Delete.

Figure 129 - Graphic Files list

View Button

Clicking on "View" button will provide a screen view of your graphic. This gives you an opportunity to insure that it is indeed the graphic you wanted. Click on your browsers "back" button to return to the graphics library screen.

Figure 130 - Browser view of uploaded graphic

Link Button

Clicking on the "Link" button will take you to the Graphic Link screen which gives you a preview of the actual "Img Tag" and "Img URI" html code. This code can be "copy and pasted" into any brandable screens header/footer.

Figure 131 - Graphic Link screen
Img Tag
The IMG element allows an image file to be inserted within an HTML document. This lets you include pictures and figures within a document as opposed to having hypertext links that retrieve and display images in a separate viewing window. SRC gives the URI of the image document.
Experienced HTML coders can enhance the Img Tag (at the Theme Editor) to manipulate the graphics alignment, look and other attributes.
Img URI
The Img URI is the unique name used to access a resource (the graphic in this case).

Download Image

If for some reason the merchant needs the graphic back onto their system (lost the file, etc.), they can download it by clicking the "Download" button for that image. A dialog box will appear offering to open or save the file to your system.

Delete Button

Clicking the "Delete" button will remove the graphic from our system. It will not interfere with the graphic at it's location on your system!