mirror of
https://github.com/mintlify/docs.git
synced 2026-09-14 13:35:46 +08:00
skeptrune
9200586a3a
* docs: boost search ranking for single-word title pages Apply `boost: 3` to English pages whose H1 / frontmatter title is a single word (e.g. "Assistant", "Quickstart", "Cards"). Short titles tend to be canonical landing pages for a topic, so users searching the exact term should land on them first. * docs: drop boost on websocket-playground stub to keep canonical Playground ranking `api-playground/websocket-playground.mdx` is an auto-generated AsyncAPI stub with no body content but shares the title "Playground" with `api-playground/overview.mdx`. Boosting both equally diluted the canonical overview page in search for the query "playground". Drop the boost on the stub.
74 lines
2.1 KiB
Plaintext
74 lines
2.1 KiB
Plaintext
---
|
|
title: "Examples"
|
|
description: "Display code examples in the right sidebar panel on desktop devices to show request and response samples alongside API documentation."
|
|
keywords: ["RequestExample", "ResponseExample", "code examples", "request-response"]
|
|
boost: 3
|
|
---
|
|
|
|
The `<RequestExample>` and `<ResponseExample>` components display code blocks in the right sidebar to create a two-column layout that keeps examples visible while users scroll through your content. Use these components for API documentation, but they work on all pages.
|
|
|
|
Common use cases:
|
|
|
|
- API endpoint documentation with request and response examples
|
|
- Configuration examples alongside explanatory text
|
|
- Code samples that users reference while following instructions
|
|
- Before and after examples in tutorials
|
|
|
|
On mobile devices, `<RequestExample>` and `<ResponseExample>` components display as regular code blocks that users can scroll past.
|
|
|
|
<RequestExample>
|
|
|
|
```bash Request
|
|
curl --request POST \
|
|
--url https://dog-api.kinduff.com/api/facts
|
|
```
|
|
|
|
</RequestExample>
|
|
|
|
<ResponseExample>
|
|
|
|
```json Response
|
|
{ "status": "success" }
|
|
```
|
|
|
|
</ResponseExample>
|
|
|
|
## RequestExample
|
|
|
|
Use `<RequestExample>` to pin code examples in the right sidebar. This component works similarly to the [CodeGroup](/components/code-groups) component, but displays the code in the sidebar instead of inline.
|
|
|
|
You can include multiple code blocks inside a single `<RequestExample>`. Each code block must have a title attribute.
|
|
|
|
````mdx RequestExample
|
|
<RequestExample>
|
|
|
|
```bash Request
|
|
curl --request POST \
|
|
--url https://dog-api.kinduff.com/api/facts
|
|
```
|
|
|
|
</RequestExample>
|
|
````
|
|
|
|
## ResponseExample
|
|
|
|
The `<ResponseExample>` component pins code examples in the right sidebar beneath any `<RequestExample>` content on the same page.
|
|
|
|
````mdx ResponseExample
|
|
<ResponseExample>
|
|
|
|
```json Response
|
|
{ "status": "success" }
|
|
```
|
|
|
|
</ResponseExample>
|
|
````
|
|
|
|
## Properties
|
|
|
|
Both `<RequestExample>` and `<ResponseExample>` accept the following properties:
|
|
|
|
<ResponseField name="dropdown" type="boolean">
|
|
Display a language dropdown menu for switching between code blocks, instead of the default tab layout.
|
|
</ResponseField>
|