Plans: All plans Platforms: All platforms

Overview

Enhance the design of your branded tracking pages with our image design tips. Whether you're aiming for a sleek and modern look or a vibrant and engaging style, this help guide offers a range of recommendations to help you seamlessly integrate images into your tracking updates, ensuring a cohesive and branded journey for your customers from start to finish.

Sections vs blocks

Blocks	Sections
Blocks are individual components that contain specific types of content, such as text, images, buttons, or videos. Each block functions as a self-contained unit, allowing for versatility in design and content creation.	Sections are larger containers that group multiple blocks together. They help organize the layout of the tracking page, providing distinct areas for different types of content, such as headers, footers, or main content areas.

How to add image sections and blocks in your tracking pages

Sections

1. Image with text section

You can include up to 4 images with text blocks within the image with text section.

Go to your page variant and click Actions, then Edit.
Click + Add sections.
Select Images with text.
An image with text section can be added a maximum of 20 times within the tracking page layout.
Choose your Section type between Text over image and Separate image and text option.
Define your idea for the section and enter Title, Description, Button text and CTA destination URL for text you are going to add here.
Choose your Overlay preference. Dark overlay (like a shadow effect) or a light overlay (like a transparent light color).
Upload the image according to the recommended size.
Upload the mobile image according to the recommended size.
Define the URL for the image part of the section.

2. Image section

Log into your AfterShip Tracking admin account.
Navigate to Tracking pages section.
Select a page variant and click Actions > choose Edit.
Click + Add sections > Image.
An image section can be added a maximum of 20 times within the tracking page layout.
Upload the image according to the recommended size.
Upload the mobile image according to the recommended size.
Define the URL for the image.

Blocks

1. Image block

Log in to your AfterShip Tracking admin account.
Navigate to the Tracking pages section.
Choose a page variant and click Actions > click Edit.
In the Sections tab, navigate to the Tracking update section, Images or Custom section, depending on where you'd want to incorporate the visual element.
- Under the Tracking update section, an image block can be added a maximum of 3 times since the maximum number of blocks added under the Tracking update section is 3.
- Under an individual Images section, an image block can be added a maximum of 5 times.
- Under an individual Custom section, an image block can be added a maximum of 3 times since the maximum number of blocks added under the Tracking update section is 3.
Click Add block and select Image.
Upload the image according to the recommended size.
Upload the mobile image according to the recommended size.
Define the URL for the image.

Under the Tracking update section, an image block can be added a maximum of 3 times since the maximum number of blocks added under the Tracking update section is 3.
Under an individual Images section, an image block can be added a maximum of 5 times.
Under an individual Custom section, an image block can be added a maximum of 3 times since the maximum number of blocks added under the Tracking update section is 3.

Any changes to the design will apply to all page languages. Remember to check how your changes look and manually translate any new content for each language.

2. Image with text block

Navigate to the Tracking pages section in the sidebar.
Select a page variant > click Actions > then Edit.
In the Sections tab, navigate to the Tracking update section.
Click Add block and select Image with text block.
Image with text block can only be added to the Tracking update section or the Image with text section itself.
Choose your Section type between Text over image and Separate image and text option.
Define your idea for the section and enter Title, Description, Button text and CTA destination URL for text you are going to add here.
Choose your Overlay preference. Dark overlay (like a shadow effect) or a light overlay (like a transparent light color).
Upload the image according to the recommended size.
Upload the mobile image according to the recommended size.
Define the URL for the image part of the section.

Add destination URL

You can add destination URL under the Image to guide shoppers back to your website to engage them and drive additional sales.
Additionally, you have the option to integrate merge tags into your destination URL. Kindly note that merge tags are only compatible with custom fields, enhancing the versatility of your destination URLs.
If you have set up your tracking page in multiple languages, you can select in which languages you wish to apply the destination URL settings.

Recommended image assets sizes

While you have the flexibility to upload assets of any size or resolution, we suggest adhering to the following recommended asset sizes for a visually appealing tracking experience. All these recommendations are in pixels.

1. Tracking update section

2. Images and image with text section

Regardless of the number of images added, the Images section allows for up to five uploads. Notably, the recommended and minimum sizes remain consistent regardless of the quantity of images included.

Supported image types

AfterShip editor supports JPG/JPEG, GIF, and PNG image formats.

Key takeaways

Use Sections to group multiple image blocks and Blocks for flexible, standalone visual elements within your tracking page layout.
Add image and image-with-text sections to create visually engaging and structured tracking experiences.
Image blocks have specific placement and quantity limits depending on the section they are added to, so plan layouts accordingly.
Link images using destination URLs, including merge tags (supported for custom fields only), to drive engagement and personalization.
Always upload desktop and mobile images based on recommended sizes to maintain visual consistency across devices.
The editor supports JPG/JPEG, PNG, and GIF formats, and design changes apply across all page languages.