add docs

Author: penalosa

CONTRIBUTING.md

@@ -33,9 +33,46 @@ If we require more information to address your pull request, the `more-informati
 - [npm](https://nodejs.org/en/learn/getting-started/an-introduction-to-the-npm-package-manager#introduction-to-npm) is the recommended package manager that must be used in installing dependencies.
 - The generated `package-lock.json` file must be committed to git.
 
+## Wrangler config
+
+If you're adding a code snippet to the docs that represents a Wrangler config file (`wrangler.toml` or `wrangler.json`) make sure you wrap it with the `<WranglerConfig>` component, which ensure it's rendered as both JSON and TOML e.g.
+
+````
+
+import { WranglerConfig } from "~/components";
+
+<WranglerConfig>
+
+```toml
+# Top-level configuration
+name = "my-worker"
+main = "src/index.js"
+compatibility_date = "2022-07-12"
+
+workers_dev = false
+route = { pattern = "example.org/*", zone_name = "example.org" }
+
+kv_namespaces = [
+  { binding = "<MY_NAMESPACE>", id = "<KV_ID>" }
+]
+
+[env.staging]
+name = "my-worker-staging"
+route = { pattern = "staging.example.org/*", zone_name = "example.org" }
+
+kv_namespaces = [
+  { binding = "<MY_NAMESPACE>", id = "<STAGING_KV_ID>" }
+]
+```
+
+</WranglerConfig>
+
+````
 
 ## Workers Playground
+
 If you are adding a code snippet to the docs that is:
+
 1. A fully contained, valid Worker (i.e. it does not require external dependencies or specific bindings)
 2. Only JavaScript
 
@@ -58,6 +95,7 @@ export default {
 };
 ```
 ````
+
 would render as
 
 <img width="870" alt="Screenshot 2024-02-20 at 14 29 22" src="https://github.com/cloudflare/cloudflare-docs/assets/28503158/56aa8016-b3b6-4d64-8213-b1a26f16534a">

src/content/docs/workers/wrangler/configuration.mdx

@@ -27,8 +27,6 @@ import { WranglerConfig } from "~/components";
 
 <WranglerConfig>
 
-<WranglerConfig>
-
 ```toml
 # Top-level configuration
 name = "my-worker"