Developing printing technology will be a part change life quality. If do you not have experience in photoshop, but you also want you or your customer can create their own design. You are a WordPress website owner and you are in the printing business. Do you want to enhance the experience for your customers by integrating online design features on your website? NBdesigner is a new powerful design tool that helps customers customize multiple printing products, create a complete solution for business. This is a responsive plugin packed with exclusive functionality that provides customers with a great experience with a high-quality outcome. In this article, we will give you an overview of the NBdesigner solution and basic instructions on how to use it. Let's begin!

To start with the main content of this article, we will go into the first part of how you can get NBdesigner plugin for your WordPress website.

Download and install NBdesigner Lite Version

Download NBdesigner Lite Version?

In Fact, many customers have not found a place to download the  NBdesigner Lite Version, we apologize for the inconvenience.  So, in this article, we are officially providing a completely free lite version of NBdesigner for our customers. Click the "GET NOW" button to get our free package. Besides, you can try Online Product Designer Demo Plugin Frontend on Our Demo.

Please login or signup an account before downloading

Then you will find yourself receiving a free order with the following great deals:

• Link to download WordPress Online Design Plugin- NBdesigner file with filename: web_to_print_online_designer.zip
• Opportunity to buy our premium services
• In particular, you can send request support tickets during use following CMSmart Support Policy

If you want to experience the online design feature on your website, the "NB Product Designer WP Plugin" lite version is the perfect choice for you. But if you really want to set up an online design website and make this a unique experience for your web customers, then premium NBdesign is the technology solution not to be missed. Here are the differences when you use our NBdesigner lite version and Premium version.

How to install?

The first thing after owning a powerful tool like NBdesigner is that you must know how to install and use this tool proficiently. In our premium NBdesigner package, we offer a complete installation service for your website. However, if you want to use this complete free product. Do not worry, because installing this tool on your website is extremely simple and you can easily follow the instructions in the tutorial and video below

Step 1: You click on the box "plugins" in the Dashboards tool, then "add new" and click "upload plugin".
Step 2: Click Browse to browse zip file, and then click "install now".
Step 3: After installing successfully, click on "Active plugin". And now the plugin is ready to use.
Step 4: Enjoy your product.

Follow the Video Tutorial 

Get the license key

After install Plugin, to use our plugin, you have to use one of two versions: Free version and Pro version.

To use a free version, you need to fill in real your full name and your email to get a free license key. Then click on the "get key" button. Free license key will be sent to your email

Next, you check your email to get license key, copy and paste on "Active license key" and active.

This free version includes full features of the plugin, but it only allows shop owners to created or modify maximum five products with Online Design.

Note: You can use Pro version with full features by click Upgrade Pro version link.

How to configure NBdesigner on Admin Page

Position of WordPress Online Design on Market:

• #1 Bestselling Online Designer Plugin for WordPress Platform
• #1 Online solution for all types of the printing company
• A powerful, smooth, and smart product online designer plugin

To make it easy for customers to install and use the available features, we would like to introduce the installation process: Easy to use and convenient for WordPress Online Design Plugin

NBdesigner Setting

General tab

See the video below to know How to setting!

Design tool tab

See the video below to know How to setting Design tool tab!

Colors tab

See the video below to know How to setting color tab!

Upload Design

See the video below to know How to upload design!

Output

Product Management

Go to NBDesigner -> Products

This is the place to manage only products that it configured online design.

Cliparts management

See the video below to know How to set Cliparts management easily!

Fonts management

See the video below to know How to set Fonts management easily!

Frontend translate management

See the video below to know How to set Frontend translate management easily!

Enable online design for products

See the video below to know How to set NBDesigner for Product!

Order management

See the video below to know How to edit order management!

With this tutorial you can:

• View orders have been placed
• Export and download designs in formats (PDF, JPG)

More features

Show all admin’s default templates into any page

Add product design widget on the sidebar. When customer saves their design, suggest that design for the related products on the sidebar.

Create template

Video Tutorial Create Template

Pricing Option

Pricing options and their benefit

Pricing Options could enable you to choose your printing styles. Therefore, if you want to display your prices to your shopper and any minimums, you need to add in to make ensure that a certain number is ordered. In addition, Customers are the direct users of products and services of the business and help your shopper make a profit for the business and play an important role in determining the survival of the business. Using pricing options can help customers have more choices in buying the products they want and help sellers increase prices and make profits when selling personalized products.

Tutorial video of Configure Print pricing option on NBDesigner

• Step 1: Click on NBdesigner -> choose 'Printing options'
• Step 2: Configure quantity break
• Step 3: Write your change in Description
• Step 4: Select display type, orientation.
• Step 5: Come to frontend preview and enjoy your product.

Configure DPI

What is DPI?

DPI stands for ‘dots per inch’ – the number of printed dots there is in an inch of the printed document. DPI is used to describe the resolution number of dots per inch in a digital print and the printing resolution of a hard copy print dot gain, which is the increase in the size of the halftone dots during printing. This is caused by the spreading of ink on the surface of the media. The larger the DPI and the number of dots, the clearer the print is. In addition, with much more DPI, the level quality of the print would be higher. Most of the prints often opt for the resolution with DPI between 300 and 600. However, professional photography or large advertisements might be print at a very high DPI like 1200.

Configure and Display DPI?

• Firstly, You need to log in to NBDesigner - Cmsmart, add file and enter information in the Backend. In "general" box, changing " fixed amount'  into "Current value price" and increasing "additional price" from 0 to 0.01.
• Secondly, you do not need to change something inbox "conditional", "appearance" and "online design".
• And then, click on Update and view in Fronted.

Now, you can correct DPI as you like. Press the button " start and update design" and enjoy your product. Besides, Cmsmart creates a video for you to know more details, please watch this below video!

Visual Designer Editor

Why should you choose one layout over another?

Why you should carefully make a selection when choosing one layout on your website:

A good layout keeps users on the site because it makes important information easily accessible and intuitive to find. A bad layout frustrates users which then quickly leave the site because they can’t find what they are looking for. For this reason, it’s best to take as long as you need to find a good layout because users won’t give you more than a few seconds of their time. There’s a strong relationship between the layout and the engagement of users with the website. It determines how long they dwell on the website pages, how many pages they browse and how often they come back to the website. So, besides overcoming the problem of split-second choice, a good layout comes with additional benefits. Engaging visitors can be a rewarding effort.

How to set up a Visual Design editor layout?

As you could see, we provide 3 design editor layouts for your choices. Customers can design online on the product detail page and Admin can set it for all products You also could choose the design editor layout for each product. 

Today, this article will show you how to setup Visual Design editor layout in  NBDeisgner plugin. Kindly follow this tutorial video for more detail: 

Preview Builder for Product Feature

With Create Preview Builder for Product feature, we provide you with a product's component design. On this design, you or your customers can edit to suitable for their purpose before providing it. It brings customers convenience and gets requests from customers easily.

• Step 1: Go to Backend of your website -> click NBdesigner plugin (after this product has been installed on your web). "Create Pre Builder" button will be shown after you add this component. Click button "Create Pre Builder"

• Step 2: Select the layer to edit. When you click on the layer, attributes will be respectively shown.
• Step 3: View the frontend page after completing. If you want more detail, please follow this simple video guide step by step.

Setup 3D preview

To set up the 3D preview, follow these steps:

First you need a 3D design model, you can use Blender software to export to the 3D model as instructed: https://nbdesigner.cmsmart.net/3d-preview/

Or you can download sample product here:

Step 1:  Once you have a 3D model, you can start creating a new product. Click "Products" select "Add New" to create a new product, you enter full information such as product name, description, select product image ... and don't forget "Enable Design". to complete you save and Publish is done.

Step 2: Using the 3D Model created earlier, copy and paste it into the NBDesigner archive folder on your computer: <root>/wp-content/uploads/nbdesigner/3d-models/<3d folder>

Step 3: Next, you click "Products" select your 3D preview product, click "Design Editor Setting", click "3D preview", select "Enable" in "Enable 3D preview", setup  "can" in "3D model folder". and "label" under "Custom mesh name" then click "Update" to finish the setting.

Step 4: Now you can see the 3D product preview that you finished by click "Product", selecting "View Product" and selecting "Starting Design", clicking "3D" icon to preview. in 3D mode.

You can see more in the video below: 

NBdesigner workflow

As a top leading solution software and website development company, we're focused on developing technologies that respond to our clients in the printing industry needs. We deliver custom-built eCommerce web to print solutions, online design, and all the eCommerce-related services that help your printing business to grow.

If your organization needs something unique we will help you plan, design, and develop any kind of software. As a result, you will see increased productivity and job quality in your company.

Here is the workflow we have done with NBdesigner. We developed our client websites with other Print on demand website features so that they could import the products and variations and also shipping fees and taxes.

Online Design tool Workflow

Web to Print Workflow

Above are all the basics you need to know about NBdesigner. If you encounter any problems during use or have any questions about this product, please leave a comment below, or create a support ticket for us on your CMSMART dashboard. We will immediately respond to you within 24 hours.

Integration and Customization

Integration

Live Chat

The simple solution is that you can build a script of questions available exclusively for your Website for customers to see. But it is not enough because customers will take great effort to find FAQs for the products they are viewing.

So you need to build a common scenario and scripts specific to that product to improve order conversion rates.

The current trend is to integrate FAQs on LiveChat so that customers can conveniently search instead of a long page of FAQs in a location that makes users uncomfortable.

I will show you how to use and create a simple Help Center.

Step 1: Script your FAQs.

Step 2: Go to WordPress, select NBDesigner and then select Printing FAQs

Step 3: Select Add New to add FAQs

For example, your FAQs will have 3 levels and follow the model below:

Step 4: Create a menu level 1, create a menu level 2

Step 5: Add the FAQs into the corresponding headings and menus.

Step 6: After adding the FAQs and completing the import we will arrange the menus in the Help Center in a hierarchical format.

Step 6.1: You choose the menu level 1, level 2 and then select Add Category

Step 6.2: Select Menu level 2, and add the corresponding FAQs.

After completing the Help Center, the interface will display the following

Another problem is that not all products can use the same set of FAQs, but there will be special products that need their own set of FAQs. So you need to screen and assign FAQs for the most relevant and relevant products instead of having customers read the entire set to find the answers.

You need to do the following:

Step 1: Go to Product and select All Product

Step 2: Select different products to assign separate FAQs

Step 3: Select the "Printing FAQ"

Step 4: Check "Enable" in the box "Show as product tab"

Step 5: Select the FAQ corresponding to the product and Press "Add FAQs" to complete

So you have completed the Help Center. Hope that you can easily convert orders and improve customer service.

Additionally, I hope that this product will help you express your personality and uniqueness.

You can refer to the video tutorial below:

Rose Helen

Shop Owner

Rose Helen is a highly accomplished Ecommerce Project Consultant with a strong background in managing and guiding successful e-commerce projects. With her exceptional expertise and strategic mindset, she helps businesses achieve their goals in the digital marketplace.
With years of experience, Rose Helen possesses an in-depth understanding of e-commerce platforms, technologies, and best practices. She works closely with clients to analyze their needs, develop tailored strategies, and execute effective project plans that drive growth and success.
As an Ecommerce Project Consultant, Rose Helen excels at overseeing project lifecycles, from inception to completion. She ensures projects are delivered on time, within budget, and with the highest level of quality. Her exceptional project management skills enable her to effectively communicate with stakeholders, manage resources, and mitigate risks throughout the project journey.
Rose Helen is a strategic thinker who leverages her extensive knowledge to identify opportunities for improvement and innovation. She provides valuable insights and recommendations to optimize e-commerce processes, enhance user experiences, and increase online sales.
With her strong communication and collaboration skills, Rose Helen builds strong relationships with clients and key stakeholders. She fosters a collaborative environment, working closely with cross-functional teams to ensure seamless project execution and alignment with business objectives.
Beyond her technical expertise, Rose Helen is dedicated to delivering exceptional client service. She goes above and beyond to understand her clients' unique requirements and provide them with personalized solutions that drive tangible results. Her commitment to client success is evident in her approach and the long-term relationships she builds.
Rose Helen's passion for e-commerce, coupled with her extensive experience and project management skills, makes her a valuable asset for organizations looking to thrive in the digital landscape. With her guidance, businesses can navigate the complexities of e-commerce projects and achieve their objectives with confidence and success.