Reading list Switch to dark mode

    PrestaShop Marketplace Web To Print {User Guide}

    Updated 2 February 2023

    PrestaShop Marketplace Web to Print module offers customers to customize the seller products as per their choice.

    Improve the overall shopping experience by offering a wide range of customization options on the marketplace.

    From t-shirts to mobile phone covers, to gift cards and coffee mugs – a user can personalize it all.

    The module provides various custom options to customize the product as per the need. You can choose to provide the following custom options to customize the product.

    • Text
    • Number
    • Image

    PrestaShop Marketplace Web to Print module is compatible with PrestaShop 8.x.x

    Searching for an experienced
    Prestashop Company ?
    Find out More

    Features of the PrestaShop Marketplace Web to Print module

    • Multiple options have been provided to customize the products as per need.
    • Sellers can add five types of templates viz. view, image, color, text, and paint.
    • Admin can add product customization templates and its values on behalf of a seller.
    • Users can personalize the products by adding desired image, color, and text.
    • Social import feature enables the users to fetch the desired images from their Facebook and Instagram accounts.
    • Customers can preview the products they have designed before placing the order.
    • Product personalization increases customer engagement on the marketplace which leads to higher sales conversion.
    • Offering product customization helps the sellers to understand the user’s needs.
    • The module is multi-shop compatible with PrestaShop Advanced Multi-Vendor Marketplace version v 6.x.x.

    Multiple Ways to Customize Product

    At the front end, the customer can personalize the product in multiple ways:

    Adding desired text on the product

    38-1

    Customize the product by adding the desired image

    24

    Personalize the product by adding color

    Hummingbird-printed-t-shirt-1

    Adding pattern to your product

    Hummingbird-printed-t-shirt-2

    How to install the PrestaShop Marketplace Web to Print module?

    In order to install the module, you need to install the PrestaShop Advanced Multi-Vendor Marketplace module first.

    After installing the marketplace module, you can now proceed to install the PrestaShop Marketplace Web to Print module.

    • Firstly, go to the module manager in the back office and click on ‘upload a module’.
    • After that, drag and drop the module file or select the file from the system.
    • In this way, the module installation will be successful.
    2
    3
    4

    How to configure the module?

    After the successful installation of the module, admin can configure Facebook and Instagram image import settings.

    Configuration

    If admin has enabled the image import, then customers can fetch the images from their Facebook and Instagram accounts. Customers can add the image(s) imported from social sites to the products and customize it as per their requirements.

    48

    Front End View

    At front end, a customer just has to click on the Facebook/Instagram button for fetching the images from Facebook and Instagram. A customer has to select image(s) to add on a customized product.

    5

    How to Generate Facebook and Instagram Credentials

    Create Facebook Credentials

    First of all, an admin needs to create an account on the Meta developer site.

    After creating the account, navigate to My Apps.

    customized-product-image-visible-to-admin-on-the-order-page-1

    After clicking on the My Apps option, the following page will open. Here, click on Create App.

    Create-App

    Now, select the app type as Business from here.

    Select-the-app-type

    After selecting the app type as business you will redirect to the following page. Here, enter the Display name of app and click on Create app.

    Enter-display-name-and-email-id-to-create-a-new-app

    Now, go to the Basic section under Settings. Here, on this page, you’ll find your App ID & App secret required to configure the module.

    facebook-API-generated

    Now, let’s proceed to see the process of generating the Instagram API credentials.

    Create Instagram Credentials

    In order to proceed to generate API keys, visit the link. After landing on the page, click on the “My Apps” button.

    My-apps

    On clicking the “My Apps” button, you will land on the following page. Here, you can see the list of all the previously created apps.

    Now, in order to create a new app, click on the “Create App” button.

    Create-new-app-1

    After that select the app category as “None”.

    Select-this-option-proceed

    Now, enter the name of the app & contact email to proceed.

    App-name

    Upon creation of an app, you will land on the dashboard of the app. Here, go to the Basic under the Settings section.

    Go-to-basic-section

    Now, at the end of the page, you will find a button Add platform.

    create-API-keys

    Click on the Add platform button & after that select the platform as Website.

    Select-the-platfor-to-be-website-to-proceed

    Here, you will need to add the URL of your website. Add the front-end URL of your shop & click on “Save changes” to proceed.

    Click-here-to-save

    Set up the Instagram Basic Display app

    After adding the URL of your shop, now click on Add Product option. Here, you will need to set up a product that’ll help you to show Instagram feeds.

    configure-feeds-of-instagram

    To fetch & show the Instagram feeds, proceed to configure the “Instagram Basic Display” product. Click on the “Set up” button to proceed.

    Instagram-Basic-Display

    Now, click on the Create New App to configure Instagram basic display app.

    Click-here-to-proceed-to-configure-Instagram-basic-display-app

    Enter the name of the app & click on “Create App”.

    Click-here-to-create-new-app

    After creating the app for Instagram basic display, you will find the App ID & App Secret needed to configure the module.

    On this page, you will also need to fill OAuth redirect URL, Deauthorize callback URL & the Data Deletion Request URL.

    The redirect URL which needs to be filled is already available in the configuration settings of the module. You just need to copy & paste the URL here.

    Click-here-to-proceed-to-add-or-remove-the-Instagram-Tester-1

    So, this was all about the process to generate the API keys for the module. Enter these keys in the configuration settings to fetch the Instagram feeds.

    Apart from the generation of API keys, you also need to add an Instagram tester in order to access the Insta account via the Meta app.

    Add Instagram Tester

    In the above picture, you may notice a section of the “User Token Generator”. In this section, there is an option to “Add or Remove Instagram Testers”.

    Now, you need to click on “Add or Remove Instagram Testers” button in order to proceed to the next step.

    Currently-no-tester-are-added-for-the-app

    Upon clicking the “Add Instagram Testers” button, a popup will open. Here, enter the username of the Instagram account that you want to add as an Instagram tester.

    add-as-a-Instagram-tester

    After selecting the user & clicking on the “Submit” button, the Instagram user will be added as a tester.

    Tester-is-added-status-is-pending

    Now go to Instagram. After that navigate to the “Apps and Websites” section under “Settings“.

    Then-go-to-this-section-1

    Under “Apps and Websites“, you now need to go to “Tester Invites” to view all the tester requests.

    Go-to-this-section-to-view-all-tester-invites-approve-them

    Here, either you can accept/decline the tester request of the Meta app via which you sent the request.

    Either-accept-or-decline-the-request

    On clicking the “Accept” button, you are authorizing the Meta app as Instagram Tester.

    Tester-access-provided-to-app

    Upon accepting the request, the status of the Instagram Tester will also update from “Pending“.

    Pending-status-is-not-showing

    Seller End Workflow

    After the installation of module, a new tab “Manage Product Templates” gets added under the seller’s account from where it can add product customization templates.

    New-tab-added
    Product-customized-template-1

    While adding a template, a seller has to enter the template name and select type of template.

    Types of Templates

    In PrestaShop Marketplace Web to Print, a seller can add five types of templates:

    1. View Template
    2. Text Template
    3. Image Template
    4. Color Template
    5. Paint Template

    Adding View Template

    For adding a view template, a seller has to select “View” in the type field.

    Choose-template
    edit-or-delete-the-template

    After saving the template, a seller can add its value under “Template Value” tab.

    Add-value-of-template

    The seller needs to enter template value and upload image for adding template value.

    Add-template-value-1
    Edit-or-delete-template-value-1

    NOTE: Values can be assigned only to view, image, and color template only.

    After installation of the module, a new tab “Assign Template” gets added on “Update Product” page from where seller can assign template to a product.

    Assign-template-1

    Customer’s End View

    14

    Customer can view the template and customize the product according to its requirement by clicking on “Customise” button.

    15

    Adding Text Template

    For adding a text template, a seller has to select:

    • “Text” in the type field.
    • View template and template value and
    • Mark the area in which customer can enter text and customise the product.
    Set-dimension
    Text-template-added

    After adding a text template, a seller can assign it to a product.

    Select-text-template

    Front End View

    38-2

    If a seller does not select a template value for a “view template”, then text template will not be displayed at front end.

    19-1

    Adding Image Template

    For adding an image template, a seller has to select:

    • “Image” in the type field.
    • View template and template value, and
    • Mark the area in image on which a customer can add desired image.
    Image-Template-added-by-seller

    After saving image template, a seller can add its value under “Template Value” tab.

    Image-Template

    After adding template value, a seller can assign template to a product.

    22

    Front End View

    Customer can add the image in an area specified by the seller for inserting image and customising the product.

    23-1
    24

    Adding Color Template

    For adding a color template, the seller has to select “color” in type field.

    Color-template
    Color-template-added

    After saving the color template, a seller can add its value.

    Color-template-value

    After adding template value, seller can assign template to the product.

    28

    Note: Color template can only be used for transparent or SVG images.

    If a seller has added an SVG image for a view template and assigned multiple color template values to a product, then a customer can customise the product using multiple values.

    29

    Adding Paint Template

    For adding the paint template, a seller has to select paint template here.

    Select-paint-template
    Paint-template-added

    After adding a paint template, the seller can assign it to the product.

    33

    Add Customization Templates and Values – Admin’s End

    After the installation of the module, a new tab “Product Customization” gets added under “Marketplace”. From this tab, admin can add product customization templates and its values on behalf of the seller.

    new-tab-added-1
    Add-new-template

    For adding a new template, admin has to select the seller to whom it wants to assign a template, template type, and enter template name.

    New-template-add
    View-template-added-by-admin

    After saving the template, admin can add its value under “Template Value” tab.

    Click-here-to-add-the-template-value

    For adding template value, admin has to:

    • Select the seller to whom it wants to assign template value.
    • Select the type of template.
    • Specify the template value, and
    • Upload an image
    Select-a-seller-to-whom-you-want-to-assign-template-value

    Once admin has assigned product customization template and its value to a seller, then he can view it under “Manage Product Templates” tab.

    Product Customization – Customer’s End

    As configured by a seller, the customers can customize a product as per their requirements.

    34
    Customize-T-shirt

    After customizing the product as per requirements, the customer can download the image by clicking on “download” button.

    Once the customer has downloaded the image, it can upload the image and then save it by clicking on “SAVE CUSTOMIZATION” button on the product page.

    Image-upload
    Customized-image-saved-by-a-customer

    When a customer adds product to the cart, it can view the customized product image in the cart.

    Click-here-to-view-customized-product-image
    Customized-product-image-saved-by-the-customer

    Once the customer has placed an order for a customized product, then a seller can view the customized image under the “Order Details”.

    Customized-product-image-visible-to-the-seller-on-the-order-page

    Admin can also view the customized product image on the orders page.

    customized-product-image-visible-to-admin-on-the-order-page

    So, this was all about the PrestaShop Marketplace Web to Print module. I hope this document will help you in checking the functionality of the module in a better way.

    Also, do let us know about your views in the comments.

    Support

    For any kind of technical assistance or query, please raise a ticket at http://webkul.uvdesk.com or send us a mail at [email protected]

    Also, please explore our PrestaShop development services & vast range of featureful PrestaShop Addons.

    Current Product Version - 5.0.3

    Supported Framework Version - 1.7.x.x

    . . .

    Leave a Comment

    Your email address will not be published. Required fields are marked*


    Be the first to comment.

    Back to Top

    Message Sent!

    If you have more details or questions, you can reply to the received confirmation email.

    Back to Home

    Table of Content