Show providers in multiple columns in the widget

Overview

By default, the provider widget (the scheduling widget that lists every available provider at a location) shows providers in a single column. If your practice has many providers, a single column can mean a lot of scrolling before patients find the right one.

You can show providers in two or three columns instead by adding a short piece of style code (CSS) to your website. You don’t need to change your widget code or anything in NextPatient.

Choose how many columns to use

• Two columns work for most practices. They’re the best choice if you’ve added provider bios, since bios need room to read comfortably.
• Three columns work well if you don’t use provider bios and have a long list of providers.
• More than three columns isn’t recommended. Provider cards get too narrow to read easily.

How to show providers in multiple columns

1. Copy the code for the number of columns you want.

Two columns:

<style>

.nextpatient-provider {float: left;width: 50% !important;}

.nextpatient-box {max-width: 100% !important;}

</style>

<style>

.nextpatient-provider {float: left;width: 33% !important;}

.nextpatient-box {max-width: 100% !important;}

</style>

2. Paste the code into your website. We recommend the header section of your site. If you can’t edit the header, paste it anywhere on the page above your widget code.

3. Save and publish your changes.

4. Open the page with your provider widget and check that providers now appear in columns.

FAQs

Can I show more than three columns?

It’s possible, but not recommended. With more than three columns, provider names, photos, and details get too narrow to read easily.

Where should I put the code?

In your website’s header is best. It also works anywhere on the page, as long as it’s above your widget code.

If I put the code in my site header, will it change every page?

Yes. Code in your header loads on every page, so every page with a provider widget will show the same number of columns. To change only one page, add the code to that page instead, above the widget code.

How do I go back to one column?

Delete the code from your website and save. The widget returns to a single column.

My providers still show in one column. What should I check?

Make sure the code sits above your widget code and that you’ve published your changes. Then refresh the page, or clear your browser’s cache, since your site may be showing a saved version. If it still doesn’t work, reach out to your account manager.