Smartlink Apps | Garment 3

Introduction

The following article has been written to detail how our standard Garment 3 app can be set up and used for. We have also detailed all of the available options associated with Garment 3 features, styling, renderer option and miscellaneous menus. The Garment 3 app itself was designed specifically customisable clothing products such as blanks, pre-designs, print on demand and saved sample type products

Key features of this smartlink app include the dynamic colour change palette, force selection of size and easy display of front and back aspects of a product.

The app is intended for use on desktop and larger screen sizes and may not display desirably on smaller screens. 

How To Set Up A Garment 3 App

To set up a new Garment 3 app users need to head into the Settings menu and select the "Smartlink Apps" option highlighted below. 

Once in the "Smartlink Apps" menu simply search for "Garment" or select it from the available default options. 

Here you can set up new "Configurations", "Language Packs" and "Details" from within the sub menus.

We have broken down each section of the submenus in the remainder of this article. 

How to Set A Garment 3 Configuration 

The following tables added below outline the available configuration options that can be used to tailor the App to meet specific requirements. To access every menu simply click the arrow pointing down and the menu will expand for you to customise. 

Within the setup of configuration there are multiple menus detailed below for General setup and Features menu

Once created users will be left with a unique 15 digit config code that can then be used to add config to the smartlink. 

General Menu

The general menu will allow you to set the name of your config as well as the ability to enable multiple different locale options. This menu has been shown below. 

Locale options link into Language packs which has been detailed further down in this article. Essentially these act as app translation locales that can be listed into this menu for languager or terminology translations to key elements of the app such as "Add to cart", "add text" or "add Image". 

Features Menu

The following table details every single option that can be enabled within the Features menu located on your set configuration.

test

Option Name	Setting Option	Description
Add Text Tab	Toggle	Enabled by default, this option will ensure the "Text" tab appears within the app.
Add Images Tab	Toggle	Enabled by default, this option acts the same as the "Add Text Tab" option but will instead ensure the "Image" tab appears.
Products Tab	Toggle	This option is important as without ir products will not function within the app menu, this is why this is enabled by default within the features menu.
Remove Background Tool	Toggle	Enabled by default this will ensure the remove background tool is visible within the app.
Auto Select Next Image Area	Toggle	With this option enabled for products with multiple images this will ensure by default whenever an image is uploaded to one image area the app will automatically move onto the next image area within the sequence.
Text Scale & Rotate Enabled	Toggle	Enabled by default, this ensure that customsied text can be resized and rotated with the "Scale & Rotate" options enabled. If fixed text is required this should be disabled.
Image Scale & Rotate Enabled	Toggle	Enabled by default, similar to the "Text" option this will ensure that uploaded images can be resized and rotated dependant on what the customer wants to see. If images should be fixed within the print area this option should be disabled.
Drag and Drop	Toggle	This option is only visible within HTML5 but this will allow users to upload images which will appear in the gallery side view that can then be dragged from the gallery and dropped onto the image area.
Show Surface Borders	Toggle	Enabled by default this offers a 'clean' appearance of the app. A blue dotted line will appear around the print area which represents the size of this
Autoload First Gallery Image	Toggle	With customers connecting to a gallery this option can be enabled to automatically load the first image from within the gallery into the image area. This is useful for selecting through a gallery of designs the app will ensure the first image appears within the app.
Simple Quantity	Toggle	This toggle should be enabled for products that can be ordered into multiple quantities. The quantity can be increased or decreased with the quantity going up with either the "+" button or down with the "-" button.
Grouped Quantities	Toggle	This toggle is different to the "Simple Quantity" toggle as this one will allow for business products such as those in quantities of 500 to be ordered at once. This toggle is ideal for B2B customers.
Dynamic Pricing	Toggle	Toggle to display the Dynamic Pricing Summary based on user selected options such as an additional cost for front, back and neck label printing. This does need to include appropriate pricing data on the product as well as a working EPA Parameter.
Image Colour Detection	Toggle	With this toggle enabled, the app will detect CMYK colours in any uploaded images, this should be used in conjunction with the other toggle "User Image API v3 Upload Processor Pantone".
Show Product Info	Toggle	This option should be toggled if you want the app to display the name and SKU of the products appearing within the app.
Is Save Enabled	Toggle	Enabled by default this option will save any draft designs that a customer is working on into their own drafts which they can revisit and order at a later point.
Show Attributes Tab	Toggle	This option should be enabled if the customer needs to select an attribute size for the garment that they are ordering.
Show Attributes After Add To Basket	Toggle	This option toggled will show the selectable attributes after the garment has been added to the bag, by default this option will appear before adding to bag with the "Show Attributes Tab" toggle enabled.
Get Images from Facebook	Toggle	Enabled by default, this option will enable customers to upload images from their Facebook account.
Get Images From Instagram	Toggle	Enabled by default, this option will enable customers to upload images from their Instagram account.
Link Galleries By Name To Image Areas	Toggle	With this enabled this will ensure any linked galleries specified to the smartlink to the image area on the product with the same name as the gallery,
Colour Area Colour Spectrum	Toggle	If enabled this will add an interactive colour picker tool to the the Colour Area menu in place of the standard single colour swatch set by default. Please note this will ONLY display as long as the product within the app have at least 2 colour area options to choose from.
Text Area Colour Spectrum	Toggle	If enabled this will add an interactive text colour picker tool to the text area menu in place of the standard single colour swatch set by default.
Tab Order	Matrix	Change the order of appearance for selected menus within the app based on numerical order.  eg. 1 = Appears first / topmost. Specific menus can also be disabled to remove them from the app entirely by toggling the "Disabled" option.
Drag and Drop Mode	Dropdown	Referring to the "Drag and Drop" toggle this dropdown offers options from using drag and drop which are "Copy", "Move" or "Swap". Copy will copy the image from the gallery onto the product, Move will remove the image from the gallery onto the product and Swap will take an existing image off into the gallery if enabled.
Print Job Thumbnail Type	Dropdown	From this dropdown you can specify the type of print jobs that will be generated by the system - this can either be left at PNG by default or updated to generate as JPG.
External CSS	Input Field	Here you can add external CSS to change the appearance of the smartlink. To enable this you simply ave to add the URL of the hosted CSS into the input field.
Spot Colours	Input Field	With this option users can specify certain colours that they do not want to be printed.
Print Job Number Of Thumbnails	Input Field	With this input field users can specify the number of thumbnail that can be produced with every artwork generation for this app. This is set to "-1" by default to not produce these thumbnails but users of multiple pieces of artwork can update this to produce a thumbnail for every side.
Print Job Thumbnail Size	Input Field	The thumbnail size will be set to 500 pixels by default but users can update this to produce bigger or smaller thumbnails with each generated print job.
Google Analytics Code	Input Field	Enter your Google Analytics ID here, starting with "UA-".
Mouseflow Website ID	Input Field	Mouseflow is a third party that tracks user activity within your app. Simply add the Mouseflow website ID they will have created for you and this will track activity.

Below gives you a look at how this menu will appear for users. 

Features is the last menu within the configuration, users will than have a unique 15 digit code that they can use when using smartlink builder or default apps. 

Language Packs

As mentioned before on this article language packs can be set to define the shown text for menu options such as "Add To Cart" which users may want to change to either "Add To Bag" or spelling add to cart in French which would be "Ajouter au panier".  To set a new language pack simply click the "+ Create Locale" button shown below. 

Once clicked users can select the language type from the dropdown which is set to English by default, as well as options to set a unique identifier as well as a name. 

With these basic details now set users can expand the menu with the arrow which will show the Translations options which must be entered into the "To" column. These can be changed at a later date by simply amending the app. 

Once the "To" translations have been set simply save the Locale which can than be entered into the "Enabled Locales" menu within the config which will ensure this locale is used for the app. 

Example Of The App

We have created an example of the app for customers to use, this is using a test product variety of the different features and config options shown below. 

Users can access this Garment 3 App link here - Click Here

• Related Articles

• Smartlink Apps | Kiosk

  Introduction The following article has been written to detail how our standard Kiosk app can be set up and used for. We have also detailed all of the available options associated with Kiosk features, POS, Styling and Renderer Options menus. The Kiosk ...

• Smartlink Apps | Proof3

  Introduction The following article has been written to detail how our standard Proof 3 app can be set up and used for. We have also detailed all of the available features associated with Proof 3 features. This app is designed for the B2B market and ...

• Smartlink Apps | Stepped3

  Introduction The following article has been written to detail how our standard Stepped 3 app can be set up and used for a stepped app experience. We have also detailed all of the available features associated with Stepped 3 general, features, ...

• Smartlink Apps | 3Column3

  Introduction The following article has been written to detail how our standard 3Column3 app can be set up and used for. We have also detailed all of the available options associated with 3Column3 features, styling, product info, renderer option and ...

• Smartlink Apps | Flow

  Introduction The following article has been written to detail how our standard Flow app can be set up and used for. We have also detailed all of the available options associated with Flow features, styling, product info, renderer option, POS (Point ...