Card

Define a rectangular component through Card.

Example Effect

Card Title

This is the card content

Code:

<Card title="Card Title"> 
This is the card content
</Card>

Card content follows Markdown syntax.

Set Icon

Card with Icon

This is the card content

Code:

<Card title="Card with Icon" icon="material-two-tone-storefront"> 
This is the card content
</Card>

Clickable Navigation Card

Clicking the card will navigate to the Apidog official website

Code:

<Card title="Clickable Navigation Card" href="https://apidog.com" icon="material-two-tone-storefront">
Clicking the card will navigate to the Apifox official website
</Card>

Parameter Description

Card

title

string

Title

required

Define the card title

href

string

URL address

optional

Define the card redirect URL

icon

string

Icon

optional

Define the icon. For details, refer to Icon

FAQ

How to use cards to link to various pages or endpoints within Apidog?

You can use href="doc-{docId}" within the card component.

<Card title="Click on me" href="doc-820686">
  Clicking on this card brings you to the doc page.
</Card>

<Card title="Click on me" href="endpoint-820686">
  Clicking on this card brings you to the endpoint page.
</Card>

<Card title="Click on me" href="folder-2878926">
  Clicking on this card brings you to the folder page.
</Card>

How to obtain the docId or endpointId ?
Click ( "Insert Endpoint/Markdown in the project" ) , the ID will be displayed.

Example Effect#

Set Icon#

Clickable Card for Navigation#

Parameter Description#

FAQ#

Example Effect

Set Icon

Clickable Card for Navigation

Parameter Description

FAQ