コードブロックを作るには:
- フェンスにバッククォート 3 つ（
```）を使い、最初の```フェンスのあとに 言語 名を書きます - 行はスペース 4 つ、またはタブ 1 つでインデントします
JSON コードブロックの例です。
```json
{
"firstName": "John",
"lastName": "Smith",
"age": 25
}
```レンダリング結果は次のようになります。
{
"firstName": "John",
"lastName": "Smith",
"age": 25
}コードブロックの出力を追加するには、1 つ目の下に 2 つ目のコードブロックを作り、開始フェンスに output プロパティを付けます。次のとおりです。
npx wrangler vectorize create tutorial-index --dimensions=3 --metric=cosine✅ Successfully created index 'tutorial-index'
[[vectorize]]
binding = "VECTORIZE_INDEX" # available in your Worker on env.VECTORIZE_INDEX
index_name = "tutorial-index"```sh
npx wrangler vectorize create tutorial-index --dimensions=3 --metric=cosine
```
```txt output
✅ Successfully created index 'tutorial-index'
[[vectorize]]
binding = "VECTORIZE_INDEX" # available in your Worker on env.VECTORIZE_INDEX
index_name = "tutorial-index"
```コードブロックの言語を指定するには、最初の ``` フェンスのあとに言語名を書きます。
言語名は小文字にしてください。たとえば javascript を使い、JavaScript は使いません。
適切な構文ハイライト用の言語が無いときは txt（別名: text、plaintext）を使います。
-
Linux / macOS ターミナルで実行するコマンドには、
shまたはbash言語を使います。対象は次のとおりです。- 1 行のコマンド
- 複数行にまたがるコマンド（通常、各行の末尾は
\） - 特定シェル向けのコマンド（例:
zshシェル専用のコマンド）
-
Windows PowerShell のコマンドには
powershell言語を使います。レンダリング時、これらのブロックにはPowerShellというタイトルが付きます。 -
Windows コンソールのコマンドには
txt言語を使います。
各コードブロック右上の Copy to clipboard ボタンは、ブロック内のコマンド出力を含め、コードブロックの内容全体をコピーします。
コマンドの前に接頭辞（$、%、PS>、C:\> など）を付けないでください。コピー＆ペーストしたあと、接頭辞を消さずにすぐ実行できるようにするためです。同様に、説明に不可欠でない限り、コマンドを実行しているフォルダーも書かないでください。
JSON のコードブロックや JSON の断片には json を使います。
JSON 本文を含む複数行の curl コマンドは、ターミナルコマンド のとおり、sh または bash の構文ハイライトを使ってください。
コードブロックには、折りたたみ、行番号、ハイライトなどの特殊な書式を付けられます。機能の一部を紹介します。ほかのオプションは、Astro のプロジェクトである Expressive Code ↗ を参照してください。
```powershell title="Write string example"
Write-Output "This one has a title"
```
```js collapse={3-5}
// Collapsing
const foo = {
1: 1,
2: 2,
3: 3,
};
```
```js showLineNumbers
// Line numbers
const foo = "bar";
const bar = "baz";
```
```js wrap
// Example with wrap
function getLongString() {
return "This is a very long string that will most probably not fit into the available space unless the container is extremely wide";
}
```
```js "return true;" ins="inserted" del="deleted"
function demo() {
console.log("These are inserted and deleted marker types");
// The return statement uses the default marker type
return true;
}
```
```diff lang="js"
function thisIsJavaScript() {
// This entire block gets highlighted as JavaScript,
// and we can still add diff markers to it!
- console.log('Old code to be removed')
+ console.log('New and shiny code!')
}
```Worker の例の開始フェンスに playground オプションを付けると、"Run Worker in Playground" リンクが付き、Workers playground へ移動します。
export default {
fetch() {
return new Response("Test!");
},
};```js playground
export default {
fetch() {
return new Response("Test!");
},
};
```開始フェンスに graphql-api-explorer を付けると、Run in GraphQL API Explorer ボタン付きの graphql コードブロックになります。ボタンは GraphQL API Explorer ↗ へ移動します。
```graphql graphql-api-explorer title="A GraphQL query"
query ASingleDatasetExample($zoneTag: string, $start: Time, $end: Time) {
viewer {
zones(filter: { zoneTag: $zoneTag }) {
firewallEventsAdaptive(
filter: { datetime_gt: $start, datetime_lt: $end }
limit: 2
orderBy: [datetime_DESC]
) {
action
datetime
host: clientRequestHTTPHost
}
}
}
}
```GraphQL API Explorer では、クエリで定義した変数の名前と型に基づいて、Variables セクションが自動入力されます。
- 名前に
startを含み、型がTimeの変数は、現在時刻の 6 時間前に設定されます - 名前に
endを含み、型がTimeの変数は、現在時刻に設定されます - 名前に
startを含み、型がDateの変数は、現在日付の 24 時間前に設定されます - 名前に
endを含み、型がDateの変数は、現在日付に設定されます - 名前に
zoneTagを含み、型がstringの変数は "ZONE_ID" に設定されます - 名前に
accountTagを含み、型がstringの変数は "ACCOUNT_ID" に設定されます - 名前に
idを含み、型がstringの変数は "REPLACE_WITH_ID" に設定されます - 名前に
limitを含み、型がintの変数は 100 に設定されます - 型が
stringのその他の変数は "REPLACE_WITH_STRING" に設定されます
graphql-api-explorer メタデータに JSON 文字列として値を設定し、カスタム変数を追加することもできます。カスタム変数は、自動入力された変数とマージされます。
次の例では、カスタム値は custom-variable です。
```graphql graphql-api-explorer='{"uID": "custom-variable"}' title="A GraphQL query"
query GraphqlExample($zoneTag: string, $start: Time, $end: Time) {
viewer {
zones(filter: { zoneTag: $zoneTag }) {
...
}
}
}
```そのため、Variables は次のようになります。
{"zoneTag":"ZONE_ID", "start":"2025-09-11T14:00:00Z", "end":"2025-09-11T20:00:00Z", "uId":"custom-variable"}