Fix: build your own font provider - step 3 (#12690)

Co-authored-by: Yan <[email protected]>
Co-authored-by: Sarah Rainsberger <[email protected]>
Co-authored-by: Florian Lefebvre <[email protected]>

Author: 4 people

src/content/docs/en/reference/experimental-flags/fonts.mdx

@@ -857,11 +857,17 @@ An Astro font provider is made up of two parts: the config object and the actual
 3. Add your custom provider to your font configuration.
 
     ```js title="astro.config.mjs" ins="myProvider()"
-    fonts: [{
-      provider: fontProviders.myProvider(),
-      name: "Custom Font",
-      cssVariable: "--font-custom"
-     }]
+    import { defineConfig } from "astro/config";
+    import { myProvider } from "./provider/config";
+
+    export default defineConfig({
+      experimental: {
+        fonts: [{
+          provider: myProvider(),
+          // ...
+        }]
+      }
+    });
     ```
 
 </Steps>