Import

Description

This UI page and functionality is based on the import actions of the PrestaShop application. The listing is specified of all the visible sections in page.

QA

Link to the test

Common components

The UI elements

What do you want to import? dropdown

Select a file to import input

Language of the file dropdown

Field separator input

Multiple value separator input

Delete all (What do you want to import? dropdown value elements) before import toggle switch

Use product reference as key toggle switch

Skip thumbnails regeneration toggle switch

Force all ID numbers toggle switch

Send notification email toggle switch

Save your data matching configuration input

Rows to skip input

Behaviors description

Blue information notification behavior

This is alert message (Alerts basics UI kit) with the useful links to the documentation about import and CSV format. The text is: You can read information on import at: https://docs.prestashop-project.org/1.7-documentation/user-guide/configuring-shop/advanced-parameters/import Read more about the CSV format at: https://en.wikipedia.org/wiki/Comma-separated_values

What do you want to import? dropdown behavior

This dropdown (Dropdowns basics UI kit) functionality can be used for choosing the subjects that can be imported to PrestaShop. The importing subjects are:

  • Categories

  • Products

  • Combinations

  • Customers

  • Addresses

  • Brands

  • Suppliers

  • Alias

  • Store contacts

Yellow information notification behavior

This is alert message (Alerts basics UI kit). Only the Categories and Products import is associated with the following yellow type warnings and they are:

  • Note that the Category import does not support having two categories with the same name.

  • Note that you can have several products with the same reference.

Select a file to import and the import input behavior

This is the file input field (Forms files UI kit), where CSV files can be browsed and imported to the PrestaShop. Input field has label inside “Choose file(s)”. Once clicked on it opens a native OS popup to navigate to the file to import. Once the file has been uploaded, the green success UI notification will appear, indicating, that the file has been attached. There will be a pen icon notification, indicating, that the file attached can be re-attached with other file.

Choose from history / FTP input behavior

By default this field (Forms files UI kit) is disabled, but becomes enabled, once the first CSV file is uploaded through this interface or directly through FTP upload. After the first CSV upload, the history input becomes active with the upload history files. Then the chosen file can be selected, downloaded or deleted from the history list. Once the file has been uploaded, the green success UI notification will appear, indicating, that the file has been attached. There will be a pen icon notification, indicating, that the file attached can be re-attached with other file.

Language of the file dropdown behavior

This is dropdown (Dropdowns basics UI kit) - the language must be set manually for the importing. This dropdown input is set to English by default, or in the other case - to the default PrestaShop's installation language. The locale must be installed.

Field separator input behavior

This is input field (Forms files UI kit) there specific alphabetic symbol must be set, in order to separate the CSV data values.

Multiple value separator input behavior

This is input field (Forms files UI kit) - if values are very similar-typed and should be separated, there should be a multiple value separator defined.

Delete all (What do you want to import? dropdown value elements) before import toggle switch behavior

This is toggle switch button (Forms switch story UI kit), that configures, if the old import entries will be erased before the new import execution. Note, that if this setting is enabled, there will be a pop-up notification from browser, with the confirmation of the deletion. This toggle switch appears for all What do you want to import? dropdown elements.

Use product reference as key toggle switch behavior

This is toggle switch button (Forms switch story UI kit), this option can be enabled, if there are possible Product ID duplications between the existing and the importing products. PrestaShop sets the reference instead of Product ID to the product. This toggle switch appears for Products and Combinations only.

Skip thumbnails regeneration toggle switch behavior

This is toggle switch button (Forms switch story UI kit), that configures, if the thumbnails regeneration should be executed aligned with the import. This toggle switch appears for Categories, Products, Brands, Suppliers and Store contacts only.

Force all ID numbers toggle switch behavior

This is toggle switch button (Forms switch story UI kit), that configures, if to keep imported items' ID number as is already, otherwise, PrestaShop will ignore them and create auto-incremented ID numbers during import process. This toggle switch appears for all What do you want to import? dropdown elements.

Send notification email toggle switch behavior

This is toggle switch button (Forms switch story UI kit), that configures the email sending, when the import is complete. This toggle switch appears for all What do you want to import? dropdown elements.

Next step button behavior

Next step is CTA button with Arrow to right icon (Buttons with icons UI kit). Once clicked executes the redirection to the second UI of the import process Match your data. When hover mouse pointer on it, button color changes.

History of uploaded files list behavior

There is a history list to use already uploaded files. This widget is displayed once the Choose from history / FT button is clicked. The list contains the actual file name with the file extension name and dropdown UI (Dropdowns with button split UI kit) with button use and dropdown with options to download or delete the file. When hover mouse pointer on it, button color changes.

Available fields UI section behavior

Fields listed, that are included into the import execution process. Under fields list is notification: * Required field.

Categories fields

  • ID

  • Active

  • Name*

  • Parent category

  • Root category it has the Tooltip (Tooltips UI kit) notification: A category root is where a category tree can begin. This is used with multistore.

  • Description

  • Meta title

  • Meta keywords

  • Meta description

  • Rewritten URL

  • Image URL

  • ID / Name of shop it has the Tooltip (Tooltips UI kit) notification: Ignore this field if you don't use the Multistore tool. If you leave this field empty, the default shop will be used.

Products fields

  • ID

  • Active

  • Name*

  • Categories (x,y,z...)

  • Price tax excluded

  • Price tax included

  • Tax rule ID

  • Cost price

  • On sale (0/1)

  • Discount amount

  • Discount percent

  • Discount from (yyyy-mm-dd)

  • Discount to (yyyy-mm-dd)

  • Reference #

  • Supplier reference #

  • Supplier

  • Brand

  • EAN13

  • UPC

  • MPN

  • Ecotax

  • Width

  • Height

  • Depth

  • Weight

  • Delivery time of in-stock products:

  • Delivery time of out-of-stock products with allowed orders:

  • Quantity

  • Minimal quantity

  • Low stock level

  • Send me an email when the quantity is under this level

  • Visibility

  • Additional shipping cost

  • Unit for base price

  • Base price

  • Summary

  • Description

  • Tags (x,y,z...)

  • Meta title

  • Meta keywords

  • Meta description

  • Rewritten URL

  • Label when in stock

  • Label when backorder allowed

  • Available for order (0 = No, 1 = Yes)

  • Product availability date

  • Product creation date

  • Show price (0 = No, 1 = Yes)

  • Image URLs (x,y,z...)

  • Image alt texts (x,y,z...)

  • Delete existing images (0 = No, 1 = Yes)

  • Feature (Name:Value:Position:Customized)

  • Available online only (0 = No, 1 = Yes)

  • Condition

  • Customizable (0 = No, 1 = Yes)

  • Uploadable files (0 = No, 1 = Yes)

  • Text fields (0 = No, 1 = Yes)

  • Action when out of stock

  • Virtual product (0 = No, 1 = Yes)

  • File URL

  • Number of allowed downloads - it has the Tooltip (Tooltips UI kit) notification: Number of days this file can be accessed by customers. If setting configured to zero, it will be configured for unlimited access.

  • Expiration date (yyyy-mm-dd)

  • Number of days - it has the Tooltip (Tooltips UI kit) notification: Number of days this file can be accessed by customers. Set to zero for unlimited access.

  • ID / Name of shop - it has the Tooltip (Tooltips UI kit) notification: Field can be ignored if Multishop is used. If this field is left empty, the default shop will be used.

  • Advanced Stock Management - it has the Tooltip (Tooltips UI kit) notification: Enabling Advanced Stock Management on product (0 = No, 1 = Yes).

  • Depends on stock - it has the Tooltip (Tooltips UI kit) notification: 0 = Using quantity set in product, 1 = Using quantity from warehouse.

  • Warehouse - it has the Tooltip (Tooltips UI kit) notification: ID of the warehouse to set as storage.

  • Accessories (x,y,z...)

Combinations fields

  • Product ID

  • Product reference

  • Attribute (Name:Type:Position)*

  • Value (Value:Position)*

  • Supplier reference

  • Reference

  • EAN13

  • UPC

  • MPN

  • Cost price

  • Impact on price

  • Ecotax

  • Quantity

  • Minimal quantity

  • Low stock level

  • Send me an email when the quantity is under this level

  • Impact on weight

  • Default (0 = No, 1 = Yes)

  • Combination availability date

  • Choose among product images by position (1,2,3...)

  • Image URLs (x,y,z...)

  • Image alt texts (x,y,z...)

  • ID / Name of shop - it has the Tooltip (Tooltips UI kit) notification: Field can be ignored if Multishop is used. If this field is left empty, the default shop will be used.

  • Advanced Stock Management - it has the Tooltip (Tooltips UI kit) notification: Enabling Advanced Stock Management on product (0 = No, 1 = Yes).

  • Depends on stock - it has the Tooltip (Tooltips UI kit) notification: 0 = Using quantity set in product, 1 = Using quantity from warehouse.

  • Warehouse - it has the Tooltip (Tooltips UI kit) notification: ID of the warehouse to set as storage.

Customers fields

  • ID

  • Active (0/1)

  • Titles ID (Mr = 1, Ms = 2, else 0)

  • Email*

  • Password (required)

  • Birth date (yyyy-mm-dd)

  • Last name*

  • First name*

  • Newsletter (0/1)

  • Partner offers (0/1)

  • Registration date (yyyy-mm-dd)

  • Groups (x,y,z...)

  • Default group ID

  • ID / Name of shop - it has the Tooltip (Tooltips UI kit) notification: Field can be ignored if Multishop is used. If this field is left empty, the default shop will be used.

Addresses fields

  • ID

  • Alias*

  • Active (0/1)

  • Customer email*

  • Customer ID

  • Brand

  • Supplier

  • Company

  • Last name*

  • First name*

  • Address*

  • Address (2)

  • Zip/Postal code*

  • City*

  • Country*

  • State

  • Other

  • Phone

  • Mobile Phone

  • VAT number

  • Identification number

Brands fields

  • ID

  • Active (0/1)

  • Name*

  • Description

  • Short description

  • Meta title

  • Meta keywords

  • Meta description

  • Image URL

  • ID / Name of group shop - it has the Tooltip (Tooltips UI kit) notification: Field can be ignored if Multishop is used. If this field is left empty, the default shop will be used.

Suppliers fields

  • ID

  • Active (0/1)

  • Name*

  • Description

  • Short description

  • Meta title

  • Meta keywords

  • Meta description

  • Image URL

  • ID / Name of group shop - it has the Tooltip (Tooltips UI kit) notification: Field can be ignored if Multishop is used. If this field is left empty, the default shop will be used.

Alias fields

  • ID

  • Alias*

  • Search*

  • Active

Store contacts fields

  • ID

  • Active (0/1)

  • Name

  • Address*

  • Address (2)

  • Zip/Postal code

  • State

  • City*

  • Country*

  • Latitude*

  • Longitude*

  • Phone

  • Fax

  • Email address

  • Note

  • Hours (x,y,z...)

  • Image URL

  • ID / Name of shop - it has the Tooltip (Tooltips UI kit) notification: Field can be ignored if Multishop is used. If this field is left empty, the default shop will be used.

Download sample csv files UI section behavior

This section helps to orientate, how is the CSV file structure made. Administrators can download the file examples, and to test the import actions and analyze what values and fields are managed by PrestaShop. Those CSV files contain random dummy values. The following CSV templates names and the file sizes are:

  • Sample Categories file - 969 B

  • Sample Products file - 4.6 KB

  • Sample Combinations file - 5.8 KB

  • Sample Customers file - 1.1 KB

  • Sample Addresses file - 2.6 KB

  • Sample Brands file - 17.4 KB

  • Sample Suppliers file - 1.6 KB

  • Sample Aliases file - 135 B

  • Sample Store Contacts file - 1.3 KB

Match your data behavior

This is the title of redirected interface contains the imported data matching table.

Blue information notification behavior

This is information message (Alerts basics UI kit) for the matching columns of the import process and it is: Please match each column of your source file to one of the destination columns.

Save your data matching configuration input beahvior

This is input field (Forms normal UI kit) where special data matching configuration can be saved for future import processes. It can be saved by clicking CTA Save button (Buttons with icons UI kit), after giving a name for the configuration. When hover mouse pointer on it, button color changes.

Load a data matching configuration dropdown behavior

This dropdown (Dropdowns basics UI kit) appears if there is any data match configuration file saved. There are two CTA button on the right side of dropdown. After choosing the configuration file and click Load button (Buttons with icons UI kit), it loads the configurational data. Once clicked Delete button (Buttons with icons UI kit), it removes the configurational data from the saved list. When hover mouse pointer on each button, button color changes.

Rows to skip input behavior

This is numeric input field (Forms normal UI kit), that indicates how many of the first rows of the importing file should be skipped when importing the data.

Matching table behavior

There is a brief table listed, in order to do a final check of the importing elements. Each table column header has a dropdown (Dropdowns basics UI kit), with the values of the import type. The purpose of this dropdown is to match the targeted values with the values that were stored in the importing CSV file. Note, that there is a value Ignore this column, which prevents the import process of the specific column values from the CSV file.

Import button behavior

This is CTA button (Buttons basics UI kit), once clicked finalizes the Import stage and initiates the import process. When hover mouse pointer on it, button color changes. After the successful importing action, the interface prompts the popup element, where there is a success message Data imported Look at your listings to make sure it's all there as you wished., progress bars (Progress bars UI kit) with the percentage and numeric values of the processes - Validated and Imported. Also there is the Close CTA button (Buttons basics UI kit) to close the popup. If there is no CSV file attached to the Import submission form, the outcoming message will be prompted Please upload a file in order to continue. If the file is too large, the UI will be prompted with the error notification File is too large. If the file is with the incorrect extension, the UI will be prompted with the error notification The extension of your file should be .csv.

Multistores functionality

Multistores independent (todo link) page. Prestashop multistores maintaining the same configuration in the import page, for all the multistores and shop groups, as administrator switches them. All the data values from the import process in CSV will be directly transferred to the selected multistore independently.

Last updated