Add instructions on how to format multiple variables (#27032)

* Add instructions on how to format multiple variables

* Update docs/sources/developers/plugins/add-support-for-variables.md

Co-authored-by: Diana Payton <52059945+oddlittlebird@users.noreply.github.com>

* Fix review comment

Co-authored-by: Diana Payton <52059945+oddlittlebird@users.noreply.github.com>

docs/sources/developers/plugins/add-support-for-variables.md

@@ -51,7 +51,7 @@ For data sources, you need to use the [getTemplateSrv]({{< relref "../../package
 
 
    ```ts
    ```ts
    async query(options: DataQueryRequest<MyQuery>): Promise<DataQueryResponse> {
    async query(options: DataQueryRequest<MyQuery>): Promise<DataQueryResponse> {
-     const query = getTemplateSrv().replace('SELECT * FROM services WHERE id = "$service"'), options.scopedVars);
+     const query = getTemplateSrv().replace('SELECT * FROM services WHERE id = "$service"', options.scopedVars);
 
 
      const data = makeDbQuery(query);
      const data = makeDbQuery(query);
 
 
@@ -59,6 +59,26 @@ For data sources, you need to use the [getTemplateSrv]({{< relref "../../package
    }
    }
    ```
    ```
 
 
+## Format multi-value variables
+
+When a user selects multiple values for variable, the value of the interpolated variable depends on the [variable format](https://grafana.com/docs/grafana/latest/variables/advanced-variable-format-options/).
+
+A data source can define the default format option when no format is specified by adding a third argument to the interpolation function.
+
+Let's change the SQL query to use CSV format by default:
+
+```ts
+getTemplateSrv().replace('SELECT * FROM services WHERE id IN ($service)', options.scopedVars, "csv");
+```
+
+Now, when users write `$service`, the query looks like this:
+
+```sql
+SELECT * FROM services WHERE id IN (admin,auth,billing)
+```
+
+For more information on the available variable formats, refer to [Advanced variable format options](https://grafana.com/docs/grafana/latest/variables/advanced-variable-format-options/).
+
 ## Add support for query variables to your data source
 ## Add support for query variables to your data source
 
 
 [Query variables]({{< relref "../../variables/variable-types/add-query-variable.md" >}}) is a type of variable that allows you to query a data source for the values. By adding support for query variables to your data source plugin, users can create dynamic dashboards based on data from your data source.
 [Query variables]({{< relref "../../variables/variable-types/add-query-variable.md" >}}) is a type of variable that allows you to query a data source for the values. By adding support for query variables to your data source plugin, users can create dynamic dashboards based on data from your data source.