How To Use Custom-Mapped Fields To Link Client Folders (like Google Folders, Dropbox etc) In Dubsado Questionnaires

Streamline your client intake process and make your Dubsado questionnaires work smarter, not harder. Today, we’re diving into how to use custom-mapped fields to link client folders (like Google Drive or Dropbox) directly in your questionnaires. This step-by-step guide will help you create a seamless, branded, and user-friendly experience for your clients. Let’s get started!

Why Use Custom-Mapped Fields In Dubsado?

Custom-mapped fields allow you to create dynamic buttons or links in your questionnaires that are specific to each client. For example, if you have individual Google Drive or Dropbox folders for your clients, you can link these folders directly in their forms. This eliminates back-and-forth emails like “Where do I upload my files?” and keeps everything organised.

Watch The Youtube Tutorial On Using Custom-Mapped Fields in Buttons:

Step 1: Create Your Custom-Mapped Fields

To get started, you’ll need to create custom-mapped fields in Dubsado. Here’s how:

1. Go to Settings > Custom-Mapped Fields.
2. Create a New Field. Name it something relevant, like “Wedding Photography Folder” or “Brand Assets Folder.”
3. Choose Field Type. Select “Short Answer” so you can paste URLs into the field.
4. Save the Field. Repeat this process for any other folders or links you want to include.

Step 2: Add Folder Links to Client Projects

Once you’ve set up your custom-mapped fields, assign the specific folder links to your clients’ projects.

1. Open a client’s project in Dubsado.
2. Scroll down to the custom-mapped fields section.
3. Paste the URL of the client’s Google Drive or Dropbox folder into the corresponding field.
4. Save the project. The link is now dynamically linked to the client’s project.

Step 3: Build Your Questionnaire

Now it’s time to create your questionnaire and embed these custom-mapped fields.

1. Create a New Questionnaire

• Go to Templates > Forms > Questionnaires.
• Click the + icon to create a new questionnaire and give it a title (e.g., “Onboarding Questionnaire”).

2. Add a Button for Each Folder

• Add a Text Box to your questionnaire.
• Highlight the text you want to link (e.g., “Upload Files Here”).
• Click “Insert Link or Button” in the toolbar.
• In the URL field, insert a Smart Field.
  • Go to Project > Custom-Mapped Fields and select the field you created earlier (e.g., “Wedding Photography Folder”).
• Set the link to open in a new tab (to avoid disrupting the questionnaire flow).
• Repeat for any additional folders or links.

Step 4: Style Your Questionnaire

Make your questionnaire look polished and professional with simple design tweaks.

1. Add Containers for Layout Structure

• Use one-column containers to keep your layout clean.
• Set the container width to 100% and the content width to 80% for better readability.
• Add padding (e.g., 80px top and bottom) to create breathing room between sections.

2. Customise Buttons with CSS

Enhance the appearance of your buttons to align with your branding.

• Go to the “Form Styling” section and scroll down to “Custom CSS.”
• Add the following CSS snippet:

/* General Button Styles */
.form-viewer .dubsButton {
  background-color: #312F2A !important; /* Set the button's background color */
  border-color: #312F2A !important;    /* Match the button's border color to the background */
  color: white !important;            /* Set the text color to white for contrast */
  border-radius: 0 !important;        /* Remove rounded corners for a clean, sharp look */
  font-family: montserrat;            /* Apply the font to the button text */
  letter-spacing: 2px;                /* Add spacing between letters for a stylish effect */
  text-transform: uppercase;          /* Transform text to all uppercase for emphasis */
  font-weight: 400;                   /* Use a normal font weight for readability */
  font-size: 14px !important;         /* Set the font size to 14px */
  padding: 3px 35px !important;       /* Add vertical and horizontal padding for button spacing */
}

If you want to change the button on hover then use the below CSS snippet and match with your hex codes and fonts:

.userBorderColor,
.dubsButton,
.userBorderColor:hover,
.dubsButton:hover {
 text-decoration: none !important; /* Remove any text underlines for a cleaner look */
  background-color: #F7F5F3 !important; /* Set a light background color for both normal and hover states */
  color: black !important;            /* Change the text color to black for contrast */
  border: 1px solid #312F2A !important; /* Add a solid border with a dark color for emphasis */
}

Step 5: Test Your Questionnaire

Before sending your questionnaire to clients, test it thoroughly.

Adjust as Needed. Make any necessary tweaks to the layout, links, or styling.

Create a Dummy Project. Add the questionnaire to a test project.

Preview the Form. Open the questionnaire and click on the buttons to ensure they link to the correct folders. Maybe give a bit more of a personalised touch with adding a custom welcome video aswell.

Final Thoughts

Using custom-mapped fields in Dubsado questionnaires is a game-changer for creating a streamlined, professional client experience. With dynamic folder links, polished design, and seamless navigation, your clients will love filling out your forms—and you’ll save time on admin tasks.

If you found this guide helpful, check out more Dubsado tips and CSS snippets on my blog. And if you need help customising your own setup, book a discovery call with me today. Let’s create a Dubsado system that works as hard as you do and don’t forget to snag 30% off Dubsado with my discount code “sarahworboyes”.