Website Customization Tools

When building a product on the Nations Photo Lab website, such as an Album99, Metal Print, or Press Card (to name a few), you will use the web-based customization tool. This article is a guided tour of the tools and what each button does!

When we open the web-based customization tool on a laptop/desktop computer, the layout will look like this:



The example in this article uses an Album99 10x10" with Midnight Blue leather cover, 15 Spreads as we can see across the top. First, we will go through the Design Tab and its' functions.

Design Tab



This is the Design Tab, and it houses most of the functions needed to lay out content on a project.

Design Tab Toolbar



*Unfortunately, at this time, we cannot copy entire spreads or pages from a project or paste them into another project. The Design Tab toolbar is only for single elements, such as one photo box or one text box.

Photo



To add an individual image box, start by clicking on the actual page within the main template (not on the page listed in the bottom row) - in this example, I clicked the left page of the print template area. We must click "Photo" and then click "Add Empty Photo Box." To insert an image, select "My Galleries."

*Empty photo boxes will not print, nor will they affect the printing process*

This image was already uploaded to "My Galleries" - with the desired photo box selected (outlined in blue), enter the gallery which contains your image and click the image thumbnail you wish to add. Selected image thumbnails have a blue dot with a white check mark inside of it on the bottom right corner. You can also click, hold, and drag the image thumbnail over to the desired photo box, releasing the mouse over the photo box.

Borders



To add a border to a photo box/image, click the photo box/image you wish to modify. Then select "Border" from the Design Tab. Click the desired border you wish to apply to that photo box/image. The selected border will have a blue dot with a white checkmark in the lower right corner. To remove a border, select "NONE," which is located to the right of "Change Border" in the Design Tab.

Please note that borders are an extension of your image. Therefore, you will not see the border if your image fills the entire template. To be able to see it, you will want to click on the photo box within the main template, then click "Transform" in the toolbar that appears. The transform tool allows you to modify the photo box's shape and size! You can make the box smaller, so the border is visible!

Text



To customize your project with text, we must start by clicking the area where you wish to add an empty text box. Select "Text" from the Design Tab and click "Add Empty Text Box." Now you can enter your custom text in the field outlined in purple and may edit the text size, font family, color, bold, underline, or italicize the text, and can left, center, or right justify the text. 

Layout



Layout houses the pre-designed pages/spreads for this specific product. Depending on the chosen layout, layouts may contain photo box's in combination with text boxes. To add a pre-designed layout, click on the page to which you wish to add a layout, then select "Layout" from the Design Tab. A "Page Layout" will be a single-sided layout, and a "Spread layout" will be a layout applied to the left and right sides conjoined. Above is a two photo box/one text box layout chosen from "Page." 

Theme

A theme adds a background color, strokes around photo boxes, and customizes the text box properties (color, size, font family). To add a theme, select the area/page to which you want to add the theme, then select "Theme" from the Design Tab. Scroll and select the theme you wish to apply. Select the top left theme from the given options to remove the theme.

Background



The background contains pre-made images perfectly sized for your project's background. To apply a pre-designed background to your project, click the area you want to modify. Select "Background" from the Design Tab and enter the category of backgrounds you wish to explore. Click the desired background to apply it to that page/area of your project. To remove a background, select "NONE," which is located to the right of "Change Background" in the Design Tab.

The toolbox supplied with photo boxes and text boxes is another very powerful item at our disposal for editing the crop and location of an image or text.

Photo Toolbox



The photo toolbox contains customization tools to personalize your projects! Read on to learn more about the tools and what they do!

Pan/Zoom



The pan/zoom tool is used to modify the crop of an image within the photo box. Pan allows you to adjust an image within a given photo box. To pan an image, click and drag the image within the photo box. To zoom, use the slider bar above the toolbox, or you may use your mouse wheel to zoom in/out.

Transform



Transform is used to modify the photo box's shape, size, and location. To modify the shape or size of the box, select the photo box/image by clicking on it. Select "Transform" - now, you can click and hold a gray tab along the side or corner of the box. Drag your mouse inwards or outwards to modify the shape/size of the photo box. To rotate the photo box, click and hold the curved arrow circled in purple and drag your mouse in a circular motion - release when the desired angle is achieved. To move the photo box click and hold the cross-hairs circled in black - release when the desired location is achieved.

Rotate



The rotate function will rotate the image within the photo box in ninety-degree increments, one rotation per click.

Front/Back



The front/back function is used mainly in collages where images' will overlap each other. In this example, the photo box selected in blue is currently behind the lower photo box. We can bring it to the front by clicking "front."

Background



The background tool will make the photo box/image the background for that item's page or side. First, select the photo box by clicking on it and clicking "Background" to activate it. Make sure to review and edit the crop of the new background image! To undo this action, click "Minimize."

Empty/Delete



Empty will remove the contents of the selected photo box. Delete will remove the selected photo or text box.

Text Toolbox



Input Field (purple) - Enter your custom text in this field.
Transform (red) - Select to rotate or move the text box. Also used to increase or decrease the size of the text Box.
Text (green) - This function exposes or hides the text editing tools on the left side Design Tab.
Delete (blue) - This deletes the single selected text box.
Empty Text Boxes will not print or affect the printing process.

Check out the Edit and Review Crop Tool Guide for ordering prints on the website!