[Workers] Zone-level dash buttons

Author: Oxyjun

src/content/docs/workers/ci-cd/builds/git-integration/index.mdx

@@ -6,6 +6,8 @@ sidebar:
   order: 3
 ---
 
+import { DashButton, Steps } from "~/components";
+
 Cloudflare supports connecting your [GitHub](/workers/ci-cd/builds/git-integration/github-integration/) and [GitLab](/workers/ci-cd/builds/git-integration/gitlab-integration/) repository to your Cloudflare Worker, and will automatically deploy your code every time you push a change.
 
 Adding a Git integration also lets you monitor build statuses directly in your Git provider using [pull request comments](/workers/ci-cd/builds/git-integration/github-integration/#pull-request-comment), [check runs](/workers/ci-cd/builds/git-integration/github-integration/#check-run), or [commit statuses](/workers/ci-cd/builds/git-integration/gitlab-integration/#commit-status), so you can manage deployments without leaving your workflow.
@@ -33,6 +35,15 @@ For details on providing access to organization accounts, see [GitHub organizati
 
 ## Manage a Git Integration
 
-To manage your Git installation, go to the [Cloudflare dashboard](https://dash.cloudflare.com) > **Workers & Pages** > your Worker > **Settings** > **Builds** > under **Git Repository**, select **Manage**.
+To manage your Git installation:
+
+<Steps>
+1. Go to the **Workers & Pages** page in the Cloudflare dashboard.
+
+   <DashButton url="/?to=/:account/workers-and-pages" />
+
+2. Select your Worker.
+3. Go to **Settings** > **Builds** > under **Git Repository**, select **Manage**.
+</Steps>
 
 This can be useful for managing repository access or troubleshooting installation issues by reinstalling. For more details, see the [GitHub](/workers/ci-cd/builds/git-integration/github-integration) and [GitLab](/workers/ci-cd/builds/git-integration/gitlab-integration) guides for how to manage your installation.

src/content/docs/workers/configuration/routing/custom-domains.mdx

@@ -4,7 +4,7 @@ title: Custom Domains
 
 ---
 
-import { WranglerConfig, DashButton } from "~/components";
+import { WranglerConfig, DashButton, Steps } from "~/components";
 
 ## Background
 
@@ -41,6 +41,7 @@ You cannot create a Custom Domain on a hostname with an existing CNAME DNS recor
 
 To set up a Custom Domain in the dashboard:
 
+<Steps>
 1. In the Cloudflare dashboard, go to the **Workers & Pages** page.
 
    <DashButton url="/?to=/:account/workers-and-pages" />
@@ -49,6 +50,7 @@ To set up a Custom Domain in the dashboard:
 3. Go to **Settings** > **Domains & Routes** > **Add** > **Custom Domain**.
 4. Enter the domain you want to configure for your Worker.
 5. Select **Add Custom Domain**.
+</Steps>
 
 After you have added the domain or subdomain, Cloudflare will create a new DNS record for you. You can add multiple Custom Domains.
 
@@ -152,39 +154,41 @@ If you are currently invoking a Worker using a [route](/workers/configuration/ro
 ### Migrate from Routes via the dashboard
 
 To migrate the route `example.com/*`:
-1. In the Cloudflare dashboard, go to the **Account home** page.
 
-   <DashButton url="/?to=/:account/home" />
+<Steps>
+1. In the Cloudflare dashboard, go to the **DNS** page for your domain.
 
-2. Select your domain.
-3. Go to **DNS** and delete the CNAME record for `example.com`.
-4. Go to **Account Home** > **Workers & Pages**.
-5. In **Overview**, select your Worker > **Settings** > **Domains & Routes**.
-6. Select **Add** > **Custom domain** and add `example.com`.
-7. Delete the route `example.com/*` located in your Worker > **Settings** > **Domains & Routes**.
+   <DashButton url="/?to=/:account/:zone/dns" />
+
+2. Delete the CNAME record for `example.com`.
+3. Go to **Account Home** > **Workers & Pages**.
+4. In **Overview**, select your Worker > **Settings** > **Domains & Routes**.
+5. Select **Add** > **Custom domain** and add `example.com`.
+6. Delete the route `example.com/*` located in your Worker > **Settings** > **Domains & Routes**.
+</Steps>
 
 ### Migrate from Routes via Wrangler
 
 To migrate the route `example.com/*` in your [Wrangler configuration file](/workers/wrangler/configuration/):
 
-1. In the Cloudflare dashboard, go to the **Account home** page.
-
-   <DashButton url="/?to=/:account/home" />
+<Steps>
+1. In the Cloudflare dashboard, go to the **DNS** page for your domain.
 
-2. Select your domain.
-3. Go to **DNS** and delete the CNAME record for `example.com`.
-4. Add the following to your Wrangler file:
+   <DashButton url="/?to=/:account/:zone/dns" />
 
+2. Delete the CNAME record for `example.com`.
+3. Add the following to your Wrangler file:
 
 
-<WranglerConfig>
+   <WranglerConfig>
 
-```toml
-[[routes]]
-pattern = "example.com"
-custom_domain = true
-```
+   ```toml
+   [[routes]]
+   pattern = "example.com"
+   custom_domain = true
+   ```
 
-</WranglerConfig>
+   </WranglerConfig>
 
 4. Run `npx  wrangler deploy` to create the Custom Domain your Worker will run on.
+</Steps>

src/content/docs/workers/configuration/routing/routes.mdx

@@ -73,7 +73,15 @@ zone_id = "<YOUR_ZONE_ID>"
 
 </WranglerConfig>
 
-Add the `zone_name` or `zone_id` option after each route. The `zone_name` and `zone_id` options are interchangeable. If using `zone_id`, find your zone ID by logging in to the Cloudflare dashboard > select your account > select your website > find the **Zone ID** in the left-hand side of **Overview**.
+Add the `zone_name` or `zone_id` option after each route. The `zone_name` and `zone_id` options are interchangeable. If using `zone_id`, find your zone ID by:
+
+<Steps>
+1. Go to the Zone Overview page in the Cloudflare dashboard.
+
+   <DashButton url="/?to=/:account/:zone/" />
+
+2. Find the **Zone ID** in the left-hand side of **Overview**.
+</Steps>
 
 To add multiple routes:
 

src/content/docs/workers/examples/103-early-hints.mdx

@@ -13,26 +13,26 @@ sidebar:
   order: 1001
 description: Allow a client to request static assets while waiting for the HTML response.
 ---
-import { DashButton } from "~/components";
+import { DashButton, Steps, TabItem, Tabs } from "~/components";
 
 If you want to get started quickly, click on the button below.
 
 [![Deploy to Cloudflare](https://deploy.workers.cloudflare.com/button)](https://deploy.workers.cloudflare.com/?url=https://github.com/cloudflare/docs-examples/tree/main/workers/103-early-hints)
 
 This creates a repository in your GitHub account and deploys the application to Cloudflare Workers.
 
-import { TabItem, Tabs } from "~/components";
-
 `103` Early Hints is an HTTP status code designed to speed up content delivery. When enabled, Cloudflare can cache the `Link` headers marked with preload and/or preconnect from HTML pages and serve them in a `103` Early Hints response before reaching the origin server. Browsers can use these hints to fetch linked assets while waiting for the origin’s final response, dramatically improving page load speeds.
 
 To ensure Early Hints are enabled on your zone:
 
-1. In the Cloudflare dashboard, go to the **Account home** page.
+<Steps>
+1. In the Cloudflare dashboard, go to the **Speed settings** page.
 
-   <DashButton url="/?to=/:account/home" />
+   <DashButton url="/?to=/:account/:zone/speed/optimization" />
 
-2. Go to **Speed** > **Optimization** > **Content Optimization**.
+2. Go to **Content Optimization**.
 3. Enable the **Early Hints** toggle to on.
+</Steps>
 
 You can return `Link` headers from a Worker running on your zone to speed up your page load times.
 

src/content/docs/workers/observability/metrics-and-analytics.mdx

@@ -9,7 +9,7 @@ description: Diagnose issues with Workers metrics, and review request data for a
 
 ---
 
-import { GlossaryTooltip, DashButton } from "~/components"
+import { GlossaryTooltip, DashButton, Steps } from "~/components"
 
 There are two graphical sources of information about your Workers traffic at a given time: Workers metrics and zone-based Workers analytics.
 
@@ -21,11 +21,13 @@ Zone analytics show how much traffic all Workers assigned to a zone are handling
 
 Workers metrics aggregate request data for an individual Worker (if your Worker is running across multiple domains, and on `*.workers.dev`, metrics will aggregate requests across them). To view your Worker's metrics:
 
+<Steps>
 1. In the Cloudflare dashboard, go to the **Workers & Pages** page.
 
    <DashButton url="/?to=/:account/workers-and-pages" />
 
 2. In **Overview**, select your Worker to view its metrics.
+</Steps>
 
 There are two metrics that can help you understand the health of your Worker in a given moment: requests success and error metrics, and invocation statuses.
 
@@ -65,13 +67,15 @@ The Duration per request chart shows historical [duration](/workers/platform/lim
 
 To review invocation statuses:
 
+<Steps>
 1. In the Cloudflare dashboard, go to the **Workers & Pages** page.
 
    <DashButton url="/?to=/:account/workers-and-pages" />
 
 2. Select your Worker.
 4. Find the **Summary** graph in **Metrics**.
 5. Select **Errors**.
+</Steps>
 
 Worker invocation statuses indicate whether a Worker executed successfully or failed to generate a response in the Workers runtime. Invocation statuses differ from HTTP status codes. In some cases, a Worker invocation succeeds but does not generate a successful HTTP status because of another error encountered outside of the Workers runtime. Some invocation statuses result in a [Workers error code](/workers/observability/errors/#error-pages-generated-by-workers) being returned to the client.
 
@@ -110,12 +114,14 @@ Worker metrics can be inspected for up to three months in the past in maximum in
 Zone analytics aggregate request data for all Workers assigned to any [routes](/workers/configuration/routing/routes/) defined for a zone.
 
 To review zone metrics:
-1. In the Cloudflare dashboard, go to the **Account home** page.
 
-   <DashButton url="/?to=/:account/home" />
+<Steps>
+1. In the Cloudflare dashboard, go to the **Analytics & Logs** page for your zone.
 
-2. Select your domain.
-3. In **Analytics & Logs**, select **Workers**.
+   <DashButton url="/?to=/:account/:zone/analytics" />
+
+2. Select **Workers**.
+</Steps>
 
 Zone data can be scoped by time range within the last 30 days. The dashboard includes charts and information described below.