[NOTE] Recently some browsers (like Safari) have started to block all third-party cookies. Within the next two years, Chrome is going to do the same. Since DigiFabster's iframe widget is considered by browsers as a third-party application, some of our end-user might experience problems using eCommerce widget installed via iframe of floated button method. Our recommendation is to move DigiFabster's widget to a subdomain and use the full white label solution. This feature is now available for all DigiFabster customers for free. 

With custom domain, your DigiFabster eCommerce widget will be seamlessly integrated on your company website which allows you to use your branding, customize your webpage with information about your shop's capabilities, add backlinks to other pages on your website and create a subdomain like quote.myshop.com/myshop/client/upload/. Also, all the links to end user personal accounts, 3d models etc. will contains only your domain (e.g. https://quote.myshop.com/client/orders/31849/, so no "DigiFabster" in the URL*).

Using your subdomain for the quote page can significantly increase your visibility in Google. You'll find a link to recommendation at the end of the article. 

Here's a inspirational example, of how your online quoting portal could looks like:

Custom domain

The custom domain feature allows you to use your existing domain's subdomain as your widget URL. To set a custom domain for your account you first need to change the A-record in DNS for your domain. Please update your DNS record as following: 

CNAME <subdomain>.<your_domain> to digifabster.com

Name is the subdomain you want to use, and value should contain DigiFabster's domain. By default, we set up your subdomain as quote.[yourcompanyname].com. If you'd like to change that, please let us know

What happens next

After finishing above steps we will start the process of installing your domain. Once we're finished, you will receive an email. Note that you might have to wait for your DNS changes to propagate throughout the Internet for up to 48 hours.

SSL

We are happy to announce that all of our custom domains have SSL certificates installed automatically. All traffic from http protocol is redirected to the secure https.

Links in widget

After your custom domain starts working, all widget links will start pointing to your new address.

Widget installation (iframe)

Your iframe widget code is located in the Install widget section here. Please copy and paste this code on your webpage wherever you want the widget to appear.

Widget installation (floating button)

Currently, we don't recommend using the floating button along with custom subdomain.

Widget customization (via CSS)

You can easily customize the widget style to match your branding. Using CSS, you're able to change colors and styles of the buttons, hide some elements, add text fragments, change background, fonts and much more. 

Please see all available CSS variables below. Just copy this code to a text file, make the necessary changes, send to us over online chat and we'll take care of updating your widget style.

Great example of the widget customization possibilities

You can download the CSS file sample with comments here.

Example of CSS tweaks

Color the body background (white is nice)

body {background-color: #ffffff;
}

Not displaying how it works link

.widget_how_it_works {
display: none
}

Add text to the Terms and Conditions link

a#inline:before {content: "DF's CNC standards for turning and milling and general " 
}

Restyle buttons

.btn {border-radius:1px;background-color:#126ca8;
}
.btn:hover {background: #45b8f4;
}

Color radio buttons

.type_radio input[type="radio"]:checked + label:before { background-color: #45b8f4;
}

General layout, fit to HD screens

Make the widget wider

.container {width: 100%;
}


Reduce the header's heigth:

.userAcc-header {height:50px;

Color the header

.userAcc-header {background-color: #7f7f7f

Color the header lettering

.userAcc-header-nav a {color: white;
}

Increase distance between header and steps, while decreasing space between steps and box

.order-steps { margin: 0px auto 0px; padding-top:10px; 
}

Color order steps background

.order-steps {background: #536878; 
}
.order-steps li i {z-index: 1;
}

Space order steps wider

.order-steps li a {min-width: 200px;

Result: 

Another example, for comparison, standard layout:

body {background: #fff;}

.userAcc-button, .btn-upload, .btn {background-color: #5299d1;color: #fff;border-radius: 3px;font-size: 1.2em;font-weight: bold;}

.userAcc-button:hover, .btn-upload:hover, .btn:hover, .btn:active {opacity: 0.5;background-color: #5299d1;}

.type_radio label:hover:before{    background-color: #5299d1;}

.type_radio input[type="radio"]:checked + label:before{    background-color: #5299d1;}

.btn.disabled {background:  #5299d1;}

.order-steps li.active i {background:  #5299d1;color: #fff;}

.order-steps li i {font-size: 1.2em;font-weight: bold;}

SEO/SEM subdomain (quote page) optimization

In order to help your shop get the most potential customers from organic search (Google), we highly recommend to use white label package (included in Business plan and higher) and set up your subdomain, e.g. quote.myshop.com, to place the widget.  

If you'd like us to help with setup, please reach out at any time. 

Below, you'll find a recommendation on how to optimize your widget page or subdomain to increase visibility in search engines. 

Recommended Title Tag: 

3D Printing Quote From [Company] | Job Shop (or whatever term best fits your company) Pricing | [Full Company Name]

Example (sample company name: Noah's Shop)

3D Printing Quote From Noah's Shop | Job Shop Pricing | Noah's Shop

Recommended Meta Description:

Get a quick 3D printing quote from [company] for an accurate appraisal of your 3D printing job.

Recommended On-Page Copy:

This copy should:

  • Use keywords like "3D printing quote", "3D printing pricing" and "machine shop quote"
  • Incorporate the company's name
  • Include unique text from the company, which can be repurposed from "About Us" or "Services" pages based on their unique value adds
  • Include the list of materials, technologies and post production options that your shop provide to the customers

Images

  • We also recommend that all companies add images, including their logos and any promotional images of their facilities or finished products.

Other white-label option

Additionally, for Business plan users we allow changing senders email, so all the order status notifications, invoices and other emails will arrive from an email address and custom subdomain that you are use. Here is how to set up this feature. 

If you'd like to customize your email templates it's also possible. You can find a guidance here

*Only Business and Enterprise customers allowed to remove the DigiFabster logo from the widget.

Did this answer your question?