How to Configure the Widget

Learn how to change the widget on your website

The BidClips widget is your conduit to your customers during the lead to order process using the BidClips platform.  You will communicate with and send quotes to your customers through the widget.  Your customers will also generate service requests organically from your website via the widget.  You will integrate the BidClips widget with your business' main website and have the ability to configure the appearance of the widget using your Provider Portal.  This Help Center article outlines:

Creating and configuring the appearance of your BidClips widget

You will start the process of adding a BidClips widget by clicking on the 'Widget' link in the Configure section of the Provider Portal navigation bar that is located on the left side of the screen.

 Clicking on the 'Widget Configuration' link will bring you to the 'Widgets' page:

Note:  You may have created a widget for your organization with a member of the BidClips support team during your Provider's onboarding process.  If you already have a widget and simply want to modify the configuration settings, please skip to the Modify an Existing Widget section of this article.

Click on the '+ ADD WIDGET' button to create a new widget for your organization.  You will be redirected to the 'Widget Configuration' page.

Widget Name

Here you will simply give your widget a name.  The name is for internal description purposes only and will not be shown to the customer.  This example shows the use of 'Test Shop Widget' as a widget name.

Widget Title Text

This is the text that will appear to your customers when they open the BidClips widget that is integrated with your main website.  Your customers will also see this text when they click on the 'New Service' option from within the widget.  This example shows the use of "Let us give you a bid!"

Widget Sub-Title Text

There is currently no functionality for Sub-Title text in the BidClips widget so you can simply skip this item.

Minimize Widget Title

This is the text that will be included in the minimized BidClips widget that is integrated with your main website.  This is a customer's first view of your BidClips widget when they visit your website.  This example shows the use of "Click here to get a bid!"

Video

The BidClips widget is created with a 'See how it works' button included.  The video file selected here will be shown to your customers if they click on the 'See how it works' button in the widget.  To add a video, click on the 'Choose File' button and select a video file from your local device.

Note: The BidClips team already has a short, 30-second video that you can use.  If your widget was created during your onboarding process you will likely already be using it.  If you would like to use the BidClips video and do not have it, please submit a support request for the BidClips support team.

This example shows that 30-second BidClips video being selected for use.

Widget Logo (Opened)

Here you can include a company logo that will be shown to the customer when they open the BidClips widget that is integrated with your website.  The customer will also see this logo when they receive communications and quotations from your organization throughout the lead to order process.

To add an image, click on the 'Choose File' button and select an image file from your local device.

Widget Logo (Minimized)

Here you can include a company logo that will be shown to the customer in the minimized BidClips widget that is integrated with your main website.  This logo, along with the minimized text described above, is a customer's first view of your BidClips widget when they visit your website.

To add an image, click on the 'Choose File' button and select an image file from your local device.

 Header Background Color

Click on the 'Header Background Color' button to bring up a color palette and select the color you want from the palette.  The color you select will be used for your minimized widget background and the color of your buttons and links in the opened widget.  The example shows a header background color change to a dark blue.

 

Title Text Color

Click on the 'Title Text Color' button to bring up a color palette and select the color you want from the palette.  The color you select will be used for the text in your minimized widget.  The example shows keeping the title text color white since the header background color is a dark blue.

Subtitle Color

There is currently no functionality for Sub-Title text in the BidClips widget so you can simply skip this item. 

Select Shops which will be served by this widget

You will need to determine which of your shop(s) will use this widget.  You can add shop(s) by clicking on the 'Shop Name' field and either select a shop from the drop-down list if it appears or start typing in the name of a shop.  When you see the shop you would like to add, select it.  This example will show the selection of a shop called Test Shop.

 

 Save Your Settings

Important!: Please remember, you must click the 'SAVE' button at the very bottom of the page before leaving.  Failure to click the 'SAVE' button before navigating away from the page will result in lost work.

Once you click 'SAVE' you should see the following Widget Created message appear in the upper right hand corner of your screen.  You have now successfully saved all desired widget configuration settings in your Provider Portal.  

Examples of settings applied to your widget:

Minimized widget on your business' main website:

Opened widget on your website:

Widget on your customer's mobile device:

Integrating the BidClips Widget with your website

You will have likely worked with the BidClips support team on integrating the BidClips widget into your business' main website during your onboarding process.  However, the 'Widget Configuration' section of the Provider Portal gives you the information that is needed to perform this task yourself.  To see how this is done, click on the 'Widget Configuration' link in the 'Configure' section of the Provider Portal navigation bar that is located on the left side of the screen.

Click on the grid row or the "edit" () icon for the widget you would like to modify.  

You will be redirected to the 'Widget Configuration' page.

Note: In order to use the integration steps below, you will need access to your provider's main web page.

Review Step 1 on the right side of the page and click the 'COPY' button.  You will notice that the html code has been copied.  This code needs to be added to your provider's main web page (most likely index.html) as the last line in the <head> section.

Review Step 2 and click the 'COPY' button.  You will notice that the html code has been copied.  This code needs to be added to the same web page (most likely index.html) as was performed in Step 1.  This code will be added as the last line in the <body> section.

Modifying an Existing Widget Configuration

You can edit an existing widget configuration by clicking on the 'Widget Configuration' link in the 'Configure' section of the Provider Portal navigation bar that is located on the left side of the screen.

Click on the grid row or the 'edit' () icon for the widget you would like to modify.  

You will be redirected to the 'Widget Configuration' page.

Click here for detailed information regarding each of the settings you can change.

Click here to see how the settings changed here will ultimately look on your widget once they are applied.

Save Your Settings

Important!: Please remember, you must click the 'SAVE' button at the very bottom of the page before leaving.  Failure to click the 'SAVE' button before navigating away from the page will result in lost work.

Once you click 'SAVE' you should see the following Widget Updated message appear in the upper right hand corner of your screen.  You have now successfully saved all desired widget configuration settings in your Provider Portal.