Reading list Switch to dark mode

    Magento 2 Web To Print

    Updated 7 February 2024

    Introduction

    Magento 2 Web To Print extension allows you to sell personalized products on your online store. With the help of the Web To Print extension, the customer can customize the product with text, images, and shapes. Magento 2 Web To Print extension is a must who are selling personalized products such as printed t-shirts, personalized coffee mugs, and custom phone cases.

    Similarly, if you are running a jewellery online store and looking for a feature where your customers can build their custom rings and then add to their cart them, you can check Magento 2 Custom Ring Building

    Check how to create a customizable product using the plugin –

    PiVcwyGmBzE

    Check a brief overview of the plugin configuration –

    3Q4TCxZ3Jqg

    Features

    • Set web to print status as active or not.
    • Show declaration and instruction text before adding a product to the cart.
    • Upload font files for the text editor.
    • Add various color options for the canvas.
    • New product type added in Magento – Web To Print.
    • The admin can set the minimum DPI, height, and width of the images.
    • The admin can set the canvas width and height in pixels.
    • Create multiple templates for the front view, back view, or side view.
    • The admin can upload a mask image for the template design.
    • Customers can fully customize the template using images, text, and shapes.
    • After customizing and designing the product, the customer can download the image.
    • The customized image will be visible in the shopping cart and other places as a product image.
    • The module supports multiple languages and translations.

    Installation

    Step 1 – Upload Folder

    After downloading the Magento 2 Web To Print module zip file, extract it and go to src>app. Now, you need to upload the app folder to the root directory of the Magento (Adobe Commerce) installation.upload folders

    Searching for an experienced
    Magento 2 Company ?
    Find out More

    Step 2 – Run Commands

    Open the terminal from the Magento root directory and run the following commands:

    First command - php bin/magento setup:upgrade
    Second Command - php bin/magento setup:di:compile
    Third Command - php bin/magento setup:static-content:deploy

    Step 3 – Clear Cache

    Go to System>Cache Management and refresh all the cache types.Cache clear

    Language Translation

    For translating the module language, please go to app>code>Webkul>WebToPrint>i18n and edit the en_US.csv file. Now, translate the words on the right and upload the modified file to the same location. The filename of the translated file should be according to the language and region code like de_DE.csv.

    language translation file

    Module Configuration

    After installing the extension, go to Stores>Configuration>Webkul>WebToPrint Settings. The following options will be available:

    Active – Select Yes to enable the module or select No to disable it.

    Declaration Before Add to Cart – You can show any declaration message to the customer before adding the customized product to the cart.

    Instruction Before Add To Cart – You can also show some instruction message to the customer.

    Canvas Width in Pixels – Enter the minimum width (in pixels) of the upload image.

    Canvas Height in Pixels – Enter the minimum height (in pixels) of the uploaded image.
    Image Width In Pixel – Enter the width (in pixels) of the final image.

    Image Height In Pixel – Enter the height (in pixels) of the final image.

    Upload Images Minimum DPI – Set the minimum DPI required for uploading images by a customer. The higher the DPI, the sharper and clearer will be the printed images.

    webkul-magento2-web-to-print-adminconfigurations

    Web to Print for Magento 2 (Adobe Commerce) Settings

    Adding Image Category

    For uploading the images for the templates, the admin first needs to create image categories. Go to Web To Print>Image Category>Add Images Category. Then, enter the name, and description, and upload any category image.

    webkul-magento2-web-to-print-admin-adds-image-category

    Uploading Images

    After creating the categories for the images, the admin can now upload images for the templates. Go to Web To Print>Images>Add Image. Upload the image from your computer, select category and set alt text description.

    webkul-magento2-web-to-print-admin-adds-image

    WTP Fonts

    The admin can upload custom font files for the text editor. Go to Web To Print>WTP Fonts>Add Fonts and upload the font file.

    wtpfonts-1

    WTP Colors

    Although the admin and the customer can add the color in the template using color name or color codes. Besides that, the admin can create some predefined color options for the template. Go to Web To Print>WTP Colors>Add New Color.

    webkul-magento2-web-to-print-admin-adds-new-color

    Create Personalized Products

    For adding a new personalized product to your online store go to Catalog>Products>Add Product>Web To Print.

    webkul-magento2-web-to-print-admin-adds-web-to-print

    Then, go to the WTP Customize tab and click Create WTP Template.

    webkul-magento2-web-to-print-admin-adds-product-web-to-print

    Clicking the Create WTP Template brings up the below section.webkul-magento2-web-to-print-admin-adds-add-web-to-print-template-view

    Adding Template

    To insert a new template, click Add More and the following form will appear where the admin needs to provide the template information:

    Title – Set the title for the frontend.

    Description – Enter any description of the template.

    Base Image –  Upload the base image of the product.

    Mask Image – Upload the mask image of the product where customization can be done.

    Add Template Variation – Use this to add the template variation.

    webkul-magento2-web-to-print-admin-adds-add-web-to-print-add-template-form

    Adding Text

    To add a text to the template, click the Text icon and edit the text. The text editor has various options to customize the text – font face, bold, italic, size, color etc.webkul-magento2-web-to-print-admin-adds-add-web-to-print-textview-1

     

    Adding Images

    The admin can add the images to the template. The height and width of the image can be adjusted accordingly.webkul_magento2_web_to_print_admin_adds_add_web_to_print_image_view

    Adding Shapes

    For adding shapes, click Shape and then click any object. You can also customize the shape using fill color, border color, width, etc.

    webkul-magento2-web-to-print-admin-adds-add-web-to-print-shape-view

    Adding Zoom

    For adding zoom, first, click the Zoom and then you can make use of the zoom slider to zoom in or out on the respective image.

    webkul-magento2-web-to-print-admin-adds-add-web-to-print-zoom-view

    Preview

    The admin can also preview the customization made from the backend.

     

    Customer Front-End View

    On the product page, the customers will see the Customize Product button.

    Product page

    Canvas

    After clicking the Customize Product button, the Canvas editor will open. Here, the customer can customize the product images using the text editor, upload images, add shapes to the image or add zoom functionality to the image. The customer can choose any of the templates and customize them accordingly.

    canvas

    Final Image

    Once, the customer finishes the customization, the customer needs to save the template and then preview it. Following is the preview pop-up window, the customer needs to check the declaration, enter the quantity, and then click Add to Cart button.

    Final image

    Shopping Cart

    Now, when the customer finalizes the image, the product image will be changed automatically.

    shopping cart

    Support

    That’s all for the Web to Pring extension for Magento 2 (Adobe Commerce), in case you need more information or require any customization, then please send an email to [email protected]

    Explore the Adobe Commerce Cloud development service by Webkul. You may also browse other Magento 2 marketplace addons. Also our quality Magento 2 extensions.

    Current Product Version - 5.0.1

    Supported Framework Version - Magento 2.0.x, 2.1.x, 2.2.x,2.3.x, 2.4.x

    . . .

    Leave a Comment

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


    4 comments

  • Crystal
    • Zeba Hakim (Moderator)
  • Manuel
    • Rohit Kashyap (Moderator)
  • 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