mirror of
https://github.com/imfing/hextra.git
synced 2025-08-23 10:07:11 -04:00
docs: add a page for hextra shortcodes (#764)
* docs: add a page for hextra-home shortcodes * fix: add prefix
This commit is contained in:

committed by
GitHub

parent
5b6f4218be
commit
7b8e1bdfd1
@@ -26,4 +26,5 @@ Additional shortcodes provided by Hugo and Hextra:
|
|||||||
{{< cards >}}
|
{{< cards >}}
|
||||||
{{< card link="jupyter" title="Jupyter Notebook" icon="jupyter" tag="alpha" >}}
|
{{< card link="jupyter" title="Jupyter Notebook" icon="jupyter" tag="alpha" >}}
|
||||||
{{< card link="others" title="Others" icon="view-grid" >}}
|
{{< card link="others" title="Others" icon="view-grid" >}}
|
||||||
|
{{< card link="hextra" title="Hextra" icon="view-grid" >}}
|
||||||
{{< /cards >}}
|
{{< /cards >}}
|
||||||
|
175
exampleSite/content/docs/guide/shortcodes/hextra.fa.md
Normal file
175
exampleSite/content/docs/guide/shortcodes/hextra.fa.md
Normal file
@@ -0,0 +1,175 @@
|
|||||||
|
---
|
||||||
|
title: Hextra Shortcodes
|
||||||
|
linkTitle: Hextra
|
||||||
|
sidebar:
|
||||||
|
exclude: true
|
||||||
|
next: /docs/guide/deploy-site
|
||||||
|
---
|
||||||
|
|
||||||
|
الاستخدام الرئيسي لهذه الرموز المختصرة هو داخل التخطيط `hextra-home`.
|
||||||
|
|
||||||
|
## `hextra/feature-card`
|
||||||
|
|
||||||
|
رمز مختصر لعرض بطاقة مميزة.
|
||||||
|
|
||||||
|
### Usage
|
||||||
|
|
||||||
|
```
|
||||||
|
{{</* hextra/feature-card title="Title" subtitle="Subtitle" */>}}
|
||||||
|
```
|
||||||
|
|
||||||
|
### Options
|
||||||
|
|
||||||
|
| Parameter | Description |
|
||||||
|
|--------------|-------------------------|
|
||||||
|
| `title` | عنوان البطاقة. |
|
||||||
|
| `subtitle` | العنوان الفرعي للبطاقة. |
|
||||||
|
| `class` | فئة البطاقة. |
|
||||||
|
| `image` | صورة البطاقة. |
|
||||||
|
| `imageClass` | فئة الصورة. |
|
||||||
|
| `style` | نمط البطاقة. |
|
||||||
|
| `icon` | أيقونة البطاقة. |
|
||||||
|
| `link` | رابط البطاقة. |
|
||||||
|
|
||||||
|
## `hextra/feature-grid`
|
||||||
|
|
||||||
|
رمز مختصر لعرض شبكة الميزات.
|
||||||
|
|
||||||
|
### Usage
|
||||||
|
|
||||||
|
```
|
||||||
|
{{</* hextra/feature-grid cols="3" */>}}
|
||||||
|
{{</* hextra/feature-card title="One" */>}}
|
||||||
|
{{</* hextra/feature-card title="Two" */>}}
|
||||||
|
{{</* hextra/feature-card title="Three" */>}}
|
||||||
|
{{</* /hextra/feature-grid */>}}
|
||||||
|
```
|
||||||
|
|
||||||
|
### Options
|
||||||
|
|
||||||
|
| Parameter | Description |
|
||||||
|
|-----------|--------------|
|
||||||
|
| `cols` | عدد الأعمدة. |
|
||||||
|
| `style` | نمط الشبكة. |
|
||||||
|
|
||||||
|
## `hextra/hero-badge`
|
||||||
|
|
||||||
|
رمز مختصر لعرض شارة تحتوي على رابط.
|
||||||
|
|
||||||
|
### Usage
|
||||||
|
|
||||||
|
```
|
||||||
|
{{</* hextra/hero-badge */>}}
|
||||||
|
<div class="hx:w-2 hx:h-2 hx:rounded-full hx:bg-primary-400"></div>
|
||||||
|
<span>Free, open source</span>
|
||||||
|
{{</* icon name="arrow-circle-right" attributes="height=14" */>}}
|
||||||
|
{{</* /hextra/hero-badge */>}}
|
||||||
|
```
|
||||||
|
|
||||||
|
### Options
|
||||||
|
|
||||||
|
| Parameter | Description |
|
||||||
|
|-----------|--------------|
|
||||||
|
| `link` | رابط الشارة. |
|
||||||
|
| `class` | فئة الشارة. |
|
||||||
|
| `style` | شكل الشارة. |
|
||||||
|
|
||||||
|
## `hextra/hero-button`
|
||||||
|
|
||||||
|
رمز مختصر لعرض زر يحتوي على رابط.
|
||||||
|
|
||||||
|
### Usage
|
||||||
|
|
||||||
|
```
|
||||||
|
{{</* hextra/hero-button text="Get Started" link="/docs" */>}}
|
||||||
|
```
|
||||||
|
|
||||||
|
### Options
|
||||||
|
|
||||||
|
| Parameter | Description |
|
||||||
|
|-----------|-------------|
|
||||||
|
| `link` | رابط الزر. |
|
||||||
|
| `text` | نص الزر. |
|
||||||
|
| `style` | شكل الزر. |
|
||||||
|
|
||||||
|
## `hextra/hero-container`
|
||||||
|
|
||||||
|
حاوية بطل بسيطة مع صورة على الجانب الأيسر.
|
||||||
|
|
||||||
|
### Usage
|
||||||
|
|
||||||
|
```
|
||||||
|
{{</* hextra/hero-container image="images/logo.svg" imageTitle="title" */>}}
|
||||||
|
Content
|
||||||
|
{{</* /hextra/hero-container */>}}
|
||||||
|
```
|
||||||
|
|
||||||
|
### Options
|
||||||
|
|
||||||
|
| Parameter | Description |
|
||||||
|
|---------------|-----------------------------------------|
|
||||||
|
| `class` | فئة الحاوية. |
|
||||||
|
| `cols` | عدد الأعمدة (الافتراضي: `2`). |
|
||||||
|
| `image` | صورة الحاوية. |
|
||||||
|
| `imageCard` | عرض الصورة كبطاقة (الافتراضي: `false`). |
|
||||||
|
| `imageClass` | فئة الصورة. |
|
||||||
|
| `imageLink` | رابط الصورة. |
|
||||||
|
| `imageStyle` | شكل الصورة. |
|
||||||
|
| `imageTitle` | عنوان الصورة. |
|
||||||
|
| `imageWidth` | عرض الصورة (الافتراضي: `350`). |
|
||||||
|
| `imageHeight` | ارتفاع الصورة (الافتراضي: `350`). |
|
||||||
|
| `style` | شكل الحاوية. |
|
||||||
|
|
||||||
|
## `hextra/hero-headline`
|
||||||
|
|
||||||
|
رمز مختصر لعرض عنوان رئيسي.
|
||||||
|
|
||||||
|
### Usage
|
||||||
|
|
||||||
|
```
|
||||||
|
{{</* hextra/hero-headline */>}}
|
||||||
|
Build modern websites <br class="hx:sm:block hx:hidden" />with Markdown and Hugo
|
||||||
|
{{</* /hextra/hero-headline */>}}
|
||||||
|
```
|
||||||
|
|
||||||
|
### Options
|
||||||
|
|
||||||
|
| Parameter | Description |
|
||||||
|
|-----------|----------------|
|
||||||
|
| `style` | أسلوب العنوان. |
|
||||||
|
|
||||||
|
## `hextra/hero-section`
|
||||||
|
|
||||||
|
قسم بطل بسيط مع عنوان ونمط اختياري.
|
||||||
|
|
||||||
|
### Usage
|
||||||
|
|
||||||
|
```
|
||||||
|
{{</* hextra/hero-section heading="h3" */>}}Title{{</* /hextra/hero-section */>}}>
|
||||||
|
```
|
||||||
|
|
||||||
|
### Options
|
||||||
|
|
||||||
|
| Parameter | Description |
|
||||||
|
|-----------|--------------------------------|
|
||||||
|
| `heading` | مستوى العنوان (افتراضي: `h2`). |
|
||||||
|
| `style` | نمط العنوان. |
|
||||||
|
| `content` | محتوى العنوان. |
|
||||||
|
|
||||||
|
## `hextra/hero-subtitle`
|
||||||
|
|
||||||
|
رمز مختصر لعرض عنوان فرعي للبطل.
|
||||||
|
|
||||||
|
### Usage
|
||||||
|
|
||||||
|
```
|
||||||
|
{{</* hextra/hero-subtitle */>}}
|
||||||
|
Fast, batteries-included Hugo theme <br class="hx:sm:block hx:hidden" />for creating beautiful static websites
|
||||||
|
{{</* /hextra/hero-subtitle */>}}
|
||||||
|
```
|
||||||
|
|
||||||
|
### Options
|
||||||
|
|
||||||
|
| Parameter | Description |
|
||||||
|
|-----------|----------------|
|
||||||
|
| `style` | أسلوب الترجمة. |
|
175
exampleSite/content/docs/guide/shortcodes/hextra.ja.md
Normal file
175
exampleSite/content/docs/guide/shortcodes/hextra.ja.md
Normal file
@@ -0,0 +1,175 @@
|
|||||||
|
---
|
||||||
|
title: Hextra Shortcodes
|
||||||
|
linkTitle: Hextra
|
||||||
|
sidebar:
|
||||||
|
exclude: true
|
||||||
|
next: /docs/guide/deploy-site
|
||||||
|
---
|
||||||
|
|
||||||
|
これらのショートコードの主な使用場所は、レイアウト `hextra-home` 内です。
|
||||||
|
|
||||||
|
## `hextra/feature-card`
|
||||||
|
|
||||||
|
機能カードを表示するためのショートコード。
|
||||||
|
|
||||||
|
### Usage
|
||||||
|
|
||||||
|
```
|
||||||
|
{{</* hextra/feature-card title="Title" subtitle="Subtitle" */>}}
|
||||||
|
```
|
||||||
|
|
||||||
|
### Options
|
||||||
|
|
||||||
|
| Parameter | Description |
|
||||||
|
|--------------|-------------|
|
||||||
|
| `title` | カードのタイトル。 |
|
||||||
|
| `subtitle` | カードのサブタイトル。 |
|
||||||
|
| `class` | カードのクラス。 |
|
||||||
|
| `image` | カードの画像。 |
|
||||||
|
| `imageClass` | 画像のクラス。 |
|
||||||
|
| `style` | カードのスタイル。 |
|
||||||
|
| `icon` | カードのアイコン。 |
|
||||||
|
| `link` | カードのリンク。 |
|
||||||
|
|
||||||
|
## `hextra/feature-grid`
|
||||||
|
|
||||||
|
機能グリッドを表示するためのショートコード。
|
||||||
|
|
||||||
|
### Usage
|
||||||
|
|
||||||
|
```
|
||||||
|
{{</* hextra/feature-grid cols="3" */>}}
|
||||||
|
{{</* hextra/feature-card title="One" */>}}
|
||||||
|
{{</* hextra/feature-card title="Two" */>}}
|
||||||
|
{{</* hextra/feature-card title="Three" */>}}
|
||||||
|
{{</* /hextra/feature-grid */>}}
|
||||||
|
```
|
||||||
|
|
||||||
|
### Options
|
||||||
|
|
||||||
|
| Parameter | Description |
|
||||||
|
|-----------|-------------|
|
||||||
|
| `cols` | 列の数。 |
|
||||||
|
| `style` | グリッドのスタイル。 |
|
||||||
|
|
||||||
|
## `hextra/hero-badge`
|
||||||
|
|
||||||
|
リンク付きのバッジをレンダリングするためのショートコード。
|
||||||
|
|
||||||
|
### Usage
|
||||||
|
|
||||||
|
```
|
||||||
|
{{</* hextra/hero-badge */>}}
|
||||||
|
<div class="hx:w-2 hx:h-2 hx:rounded-full hx:bg-primary-400"></div>
|
||||||
|
<span>Free, open source</span>
|
||||||
|
{{</* icon name="arrow-circle-right" attributes="height=14" */>}}
|
||||||
|
{{</* /hextra/hero-badge */>}}
|
||||||
|
```
|
||||||
|
|
||||||
|
### Options
|
||||||
|
|
||||||
|
| Parameter | Description |
|
||||||
|
|-----------|-------------|
|
||||||
|
| `link` | バッジのリンク。 |
|
||||||
|
| `class` | バッジのクラス。 |
|
||||||
|
| `style` | バッジのスタイル。 |
|
||||||
|
|
||||||
|
## `hextra/hero-button`
|
||||||
|
|
||||||
|
リンク付きのボタンをレンダリングするためのショートコード。
|
||||||
|
|
||||||
|
### Usage
|
||||||
|
|
||||||
|
```
|
||||||
|
{{</* hextra/hero-button text="Get Started" link="/docs" */>}}
|
||||||
|
```
|
||||||
|
|
||||||
|
### Options
|
||||||
|
|
||||||
|
| Parameter | Description |
|
||||||
|
|-----------|-------------|
|
||||||
|
| `link` | ボタンのリンク。 |
|
||||||
|
| `text` | ボタンのテキスト。 |
|
||||||
|
| `style` | ボタンのスタイル。 |
|
||||||
|
|
||||||
|
## `hextra/hero-container`
|
||||||
|
|
||||||
|
左側に画像があるシンプルなヒーロー コンテナー。
|
||||||
|
|
||||||
|
### Usage
|
||||||
|
|
||||||
|
```
|
||||||
|
{{</* hextra/hero-container image="images/logo.svg" imageTitle="title" */>}}
|
||||||
|
Content
|
||||||
|
{{</* /hextra/hero-container */>}}
|
||||||
|
```
|
||||||
|
|
||||||
|
### Options
|
||||||
|
|
||||||
|
| Parameter | Description |
|
||||||
|
|---------------|-----------------------------------|
|
||||||
|
| `class` | コンテナのクラス。 |
|
||||||
|
| `cols` | 列数(デフォルト:`2`)。 |
|
||||||
|
| `image` | コンテナの画像。 |
|
||||||
|
| `imageCard` | 画像をカードとして表示するかどうか(デフォルト:`false`)。 |
|
||||||
|
| `imageClass` | 画像のクラス。 |
|
||||||
|
| `imageLink` | 画像のリンク。 |
|
||||||
|
| `imageStyle` | 画像のスタイル。 |
|
||||||
|
| `imageTitle` | 画像のタイトル。 |
|
||||||
|
| `imageWidth` | 画像の幅(デフォルト:`350`)。 |
|
||||||
|
| `imageHeight` | 画像の高さ(デフォルト:`350`)。 |
|
||||||
|
| `style` | コンテナのスタイル。 |
|
||||||
|
|
||||||
|
## `hextra/hero-headline`
|
||||||
|
|
||||||
|
ヒーローの見出しを表示するためのショートコード。
|
||||||
|
|
||||||
|
### Usage
|
||||||
|
|
||||||
|
```
|
||||||
|
{{</* hextra/hero-headline */>}}
|
||||||
|
Build modern websites <br class="hx:sm:block hx:hidden" />with Markdown and Hugo
|
||||||
|
{{</* /hextra/hero-headline */>}}
|
||||||
|
```
|
||||||
|
|
||||||
|
### Options
|
||||||
|
|
||||||
|
| Parameter | Description |
|
||||||
|
|-----------|-------------|
|
||||||
|
| `style` | 見出しのスタイル。 |
|
||||||
|
|
||||||
|
## `hextra/hero-section`
|
||||||
|
|
||||||
|
見出しとオプションのスタイルを備えたシンプルなヒーロー セクション。
|
||||||
|
|
||||||
|
### Usage
|
||||||
|
|
||||||
|
```
|
||||||
|
{{</* hextra/hero-section heading="h3" */>}}Title{{</* /hextra/hero-section */>}}>
|
||||||
|
```
|
||||||
|
|
||||||
|
### Options
|
||||||
|
|
||||||
|
| Parameter | Description |
|
||||||
|
|-----------|----------------------|
|
||||||
|
| `heading` | 見出しレベル(デフォルト: `h2`)。 |
|
||||||
|
| `style` | 見出しのスタイル。 |
|
||||||
|
| `content` | 見出しの内容。 |
|
||||||
|
|
||||||
|
## `hextra/hero-subtitle`
|
||||||
|
|
||||||
|
ヒーローのサブタイトルを表示するためのショートコード。
|
||||||
|
|
||||||
|
### Usage
|
||||||
|
|
||||||
|
```
|
||||||
|
{{</* hextra/hero-subtitle */>}}
|
||||||
|
Fast, batteries-included Hugo theme <br class="hx:sm:block hx:hidden" />for creating beautiful static websites
|
||||||
|
{{</* /hextra/hero-subtitle */>}}
|
||||||
|
```
|
||||||
|
|
||||||
|
### Options
|
||||||
|
|
||||||
|
| Parameter | Description |
|
||||||
|
|-----------|-------------|
|
||||||
|
| `style` | 字幕のスタイル。 |
|
175
exampleSite/content/docs/guide/shortcodes/hextra.md
Normal file
175
exampleSite/content/docs/guide/shortcodes/hextra.md
Normal file
@@ -0,0 +1,175 @@
|
|||||||
|
---
|
||||||
|
title: Hextra Shortcodes
|
||||||
|
linkTitle: Hextra
|
||||||
|
sidebar:
|
||||||
|
exclude: true
|
||||||
|
next: /docs/guide/deploy-site
|
||||||
|
---
|
||||||
|
|
||||||
|
The main usage of these shortcodes are within the layout `hextra-home`.
|
||||||
|
|
||||||
|
## `hextra/feature-card`
|
||||||
|
|
||||||
|
A shortcode for displaying a feature card.
|
||||||
|
|
||||||
|
### Usage
|
||||||
|
|
||||||
|
```
|
||||||
|
{{</* hextra/feature-card title="Title" subtitle="Subtitle" */>}}
|
||||||
|
```
|
||||||
|
|
||||||
|
### Options
|
||||||
|
|
||||||
|
| Parameter | Description |
|
||||||
|
|--------------|---------------------------|
|
||||||
|
| `title` | The title of the card. |
|
||||||
|
| `subtitle` | The subtitle of the card. |
|
||||||
|
| `class` | The class of the card. |
|
||||||
|
| `image` | The image of the card. |
|
||||||
|
| `imageClass` | The class of the image. |
|
||||||
|
| `style` | The style of the card. |
|
||||||
|
| `icon` | The icon of the card. |
|
||||||
|
| `link` | The link of the card. |
|
||||||
|
|
||||||
|
## `hextra/feature-grid`
|
||||||
|
|
||||||
|
A shortcode for displaying a feature grid.
|
||||||
|
|
||||||
|
### Usage
|
||||||
|
|
||||||
|
```
|
||||||
|
{{</* hextra/feature-grid cols="3" */>}}
|
||||||
|
{{</* hextra/feature-card title="One" */>}}
|
||||||
|
{{</* hextra/feature-card title="Two" */>}}
|
||||||
|
{{</* hextra/feature-card title="Three" */>}}
|
||||||
|
{{</* /hextra/feature-grid */>}}
|
||||||
|
```
|
||||||
|
|
||||||
|
### Options
|
||||||
|
|
||||||
|
| Parameter | Description |
|
||||||
|
|-----------|------------------------|
|
||||||
|
| `cols` | The number of columns. |
|
||||||
|
| `style` | The style of the grid. |
|
||||||
|
|
||||||
|
## `hextra/hero-badge`
|
||||||
|
|
||||||
|
A shortcode for rendering a badge with a link.
|
||||||
|
|
||||||
|
### Usage
|
||||||
|
|
||||||
|
```
|
||||||
|
{{</* hextra/hero-badge */>}}
|
||||||
|
<div class="hx:w-2 hx:h-2 hx:rounded-full hx:bg-primary-400"></div>
|
||||||
|
<span>Free, open source</span>
|
||||||
|
{{</* icon name="arrow-circle-right" attributes="height=14" */>}}
|
||||||
|
{{</* /hextra/hero-badge */>}}
|
||||||
|
```
|
||||||
|
|
||||||
|
### Options
|
||||||
|
|
||||||
|
| Parameter | Description |
|
||||||
|
|-----------|-------------------------|
|
||||||
|
| `link` | The link of the badge. |
|
||||||
|
| `class` | The class of the badge. |
|
||||||
|
| `style` | The style of the badge. |
|
||||||
|
|
||||||
|
## `hextra/hero-button`
|
||||||
|
|
||||||
|
A shortcode for rendering a button with a link.
|
||||||
|
|
||||||
|
### Usage
|
||||||
|
|
||||||
|
```
|
||||||
|
{{</* hextra/hero-button text="Get Started" link="/docs" */>}}
|
||||||
|
```
|
||||||
|
|
||||||
|
### Options
|
||||||
|
|
||||||
|
| Parameter | Description |
|
||||||
|
|-----------|--------------------------|
|
||||||
|
| `link` | The link of the button. |
|
||||||
|
| `text` | The text of the button. |
|
||||||
|
| `style` | The style of the button. |
|
||||||
|
|
||||||
|
## `hextra/hero-container`
|
||||||
|
|
||||||
|
A simple hero container with an image on the left side.
|
||||||
|
|
||||||
|
### Usage
|
||||||
|
|
||||||
|
```
|
||||||
|
{{</* hextra/hero-container image="images/logo.svg" imageTitle="title" */>}}
|
||||||
|
Content
|
||||||
|
{{</* /hextra/hero-container */>}}
|
||||||
|
```
|
||||||
|
|
||||||
|
### Options
|
||||||
|
|
||||||
|
| Parameter | Description |
|
||||||
|
|---------------|------------------------------------------------------------|
|
||||||
|
| `class` | The class of the container. |
|
||||||
|
| `cols` | The number of columns (default: `2`). |
|
||||||
|
| `image` | The image of the container. |
|
||||||
|
| `imageCard` | Whether to display the image as a card (default: `false`). |
|
||||||
|
| `imageClass` | The class of the image. |
|
||||||
|
| `imageLink` | The link of the image. |
|
||||||
|
| `imageStyle` | The style of the image. |
|
||||||
|
| `imageTitle` | The title of the image. |
|
||||||
|
| `imageWidth` | The width of the image (default: `350`). |
|
||||||
|
| `imageHeight` | The height of the image (default: `350`). |
|
||||||
|
| `style` | The style of the container. |
|
||||||
|
|
||||||
|
## `hextra/hero-headline`
|
||||||
|
|
||||||
|
A shortcode for displaying a hero headline.
|
||||||
|
|
||||||
|
### Usage
|
||||||
|
|
||||||
|
```
|
||||||
|
{{</* hextra/hero-headline */>}}
|
||||||
|
Build modern websites <br class="hx:sm:block hx:hidden" />with Markdown and Hugo
|
||||||
|
{{</* /hextra/hero-headline */>}}
|
||||||
|
```
|
||||||
|
|
||||||
|
### Options
|
||||||
|
|
||||||
|
| Parameter | Description |
|
||||||
|
|-----------|----------------------------|
|
||||||
|
| `style` | The style of the headline. |
|
||||||
|
|
||||||
|
## `hextra/hero-section`
|
||||||
|
|
||||||
|
A simple hero section with a heading and optional style.
|
||||||
|
|
||||||
|
### Usage
|
||||||
|
|
||||||
|
```
|
||||||
|
{{</* hextra/hero-section heading="h3" */>}}Title{{</* /hextra/hero-section */>}}>
|
||||||
|
```
|
||||||
|
|
||||||
|
### Options
|
||||||
|
|
||||||
|
| Parameter | Description |
|
||||||
|
|-----------|------------------------------------|
|
||||||
|
| `heading` | The heading level (default: `h2`). |
|
||||||
|
| `style` | The style of the heading. |
|
||||||
|
| `content` | The content of the heading. |
|
||||||
|
|
||||||
|
## `hextra/hero-subtitle`
|
||||||
|
|
||||||
|
A shortcode for displaying a hero subtitle.
|
||||||
|
|
||||||
|
### Usage
|
||||||
|
|
||||||
|
```
|
||||||
|
{{</* hextra/hero-subtitle */>}}
|
||||||
|
Fast, batteries-included Hugo theme <br class="hx:sm:block hx:hidden" />for creating beautiful static websites
|
||||||
|
{{</* /hextra/hero-subtitle */>}}
|
||||||
|
```
|
||||||
|
|
||||||
|
### Options
|
||||||
|
|
||||||
|
| Parameter | Description |
|
||||||
|
|-----------|----------------------------|
|
||||||
|
| `style` | The style of the subtitle. |
|
175
exampleSite/content/docs/guide/shortcodes/hextra.zh-cn.md
Normal file
175
exampleSite/content/docs/guide/shortcodes/hextra.zh-cn.md
Normal file
@@ -0,0 +1,175 @@
|
|||||||
|
---
|
||||||
|
title: Hextra Shortcodes
|
||||||
|
linkTitle: Hextra
|
||||||
|
sidebar:
|
||||||
|
exclude: true
|
||||||
|
next: /docs/guide/deploy-site
|
||||||
|
---
|
||||||
|
|
||||||
|
这些短代码的主要用途是在布局`hextra-home`内。
|
||||||
|
|
||||||
|
## `hextra/feature-card`
|
||||||
|
|
||||||
|
显示功能卡的短代码。
|
||||||
|
|
||||||
|
### Usage
|
||||||
|
|
||||||
|
```
|
||||||
|
{{</* hextra/feature-card title="Title" subtitle="Subtitle" */>}}
|
||||||
|
```
|
||||||
|
|
||||||
|
### Options
|
||||||
|
|
||||||
|
| Parameter | Description |
|
||||||
|
|--------------|-------------|
|
||||||
|
| `title` | 卡片的标题。 |
|
||||||
|
| `subtitle` | 卡片的副标题。 |
|
||||||
|
| `class` | 卡片的类别。 |
|
||||||
|
| `image` | 卡片的图片。 |
|
||||||
|
| `imageClass` | 图片的类别。 |
|
||||||
|
| `style` | 卡片的样式。 |
|
||||||
|
| `icon` | 卡片的图标。 |
|
||||||
|
| `link` | 卡片的链接。 |
|
||||||
|
|
||||||
|
## `hextra/feature-grid`
|
||||||
|
|
||||||
|
用于显示特征网格的短代码。
|
||||||
|
|
||||||
|
### Usage
|
||||||
|
|
||||||
|
```
|
||||||
|
{{</* hextra/feature-grid cols="3" */>}}
|
||||||
|
{{</* hextra/feature-card title="One" */>}}
|
||||||
|
{{</* hextra/feature-card title="Two" */>}}
|
||||||
|
{{</* hextra/feature-card title="Three" */>}}
|
||||||
|
{{</* /hextra/feature-grid */>}}
|
||||||
|
```
|
||||||
|
|
||||||
|
### Options
|
||||||
|
|
||||||
|
| Parameter | Description |
|
||||||
|
|-----------|-------------|
|
||||||
|
| `cols` | 列数。 |
|
||||||
|
| `style` | 网格的样式。 |
|
||||||
|
|
||||||
|
## `hextra/hero-badge`
|
||||||
|
|
||||||
|
用于呈现带有链接的徽章的短代码。
|
||||||
|
|
||||||
|
### Usage
|
||||||
|
|
||||||
|
```
|
||||||
|
{{</* hextra/hero-badge */>}}
|
||||||
|
<div class="hx:w-2 hx:h-2 hx:rounded-full hx:bg-primary-400"></div>
|
||||||
|
<span>Free, open source</span>
|
||||||
|
{{</* icon name="arrow-circle-right" attributes="height=14" */>}}
|
||||||
|
{{</* /hextra/hero-badge */>}}
|
||||||
|
```
|
||||||
|
|
||||||
|
### Options
|
||||||
|
|
||||||
|
| Parameter | Description |
|
||||||
|
|-----------|-------------|
|
||||||
|
| `link` | 徽章的链接。 |
|
||||||
|
| `class` | 徽章的类别。 |
|
||||||
|
| `style` | 徽章的样式。 |
|
||||||
|
|
||||||
|
## `hextra/hero-button`
|
||||||
|
|
||||||
|
用于呈现带有链接的按钮的短代码。
|
||||||
|
|
||||||
|
### Usage
|
||||||
|
|
||||||
|
```
|
||||||
|
{{</* hextra/hero-button text="Get Started" link="/docs" */>}}
|
||||||
|
```
|
||||||
|
|
||||||
|
### Options
|
||||||
|
|
||||||
|
| Parameter | Description |
|
||||||
|
|-----------|-------------|
|
||||||
|
| `link` | 按钮的链接。 |
|
||||||
|
| `text` | 按钮的文本。 |
|
||||||
|
| `style` | 按钮的样式。 |
|
||||||
|
|
||||||
|
## `hextra/hero-container`
|
||||||
|
|
||||||
|
一个简单的英雄容器,左侧有一个图像。
|
||||||
|
|
||||||
|
### Usage
|
||||||
|
|
||||||
|
```
|
||||||
|
{{</* hextra/hero-container image="images/logo.svg" imageTitle="title" */>}}
|
||||||
|
Content
|
||||||
|
{{</* /hextra/hero-container */>}}
|
||||||
|
```
|
||||||
|
|
||||||
|
### Options
|
||||||
|
|
||||||
|
| Parameter | Description |
|
||||||
|
|---------------|--------------------------|
|
||||||
|
| `class` | 容器的类。 |
|
||||||
|
| `cols` | 列数(默认值:`2`)。 |
|
||||||
|
| `image` | 容器的图片。 |
|
||||||
|
| `imageCard` | 是否将图片显示为卡片(默认值:`false`)。 |
|
||||||
|
| `imageClass` | 图片的类。 |
|
||||||
|
| `imageLink` | 图片的链接。 |
|
||||||
|
| `imageStyle` | 图片的样式。 |
|
||||||
|
| `imageTitle` | 图片的标题。 |
|
||||||
|
| `imageWidth` | 图片的宽度(默认值:`350`)。 |
|
||||||
|
| `imageHeight` | 图片的高度(默认值:`350`)。 |
|
||||||
|
| `style` | 容器的样式。 |
|
||||||
|
|
||||||
|
## `hextra/hero-headline`
|
||||||
|
|
||||||
|
显示英雄标题的短代码。
|
||||||
|
|
||||||
|
### Usage
|
||||||
|
|
||||||
|
```
|
||||||
|
{{</* hextra/hero-headline */>}}
|
||||||
|
Build modern websites <br class="hx:sm:block hx:hidden" />with Markdown and Hugo
|
||||||
|
{{</* /hextra/hero-headline */>}}
|
||||||
|
```
|
||||||
|
|
||||||
|
### Options
|
||||||
|
|
||||||
|
| Parameter | Description |
|
||||||
|
|-----------|-------------|
|
||||||
|
| `style` | 标题的样式。 |
|
||||||
|
|
||||||
|
## `hextra/hero-section`
|
||||||
|
|
||||||
|
带有标题和可选样式的简单英雄部分。
|
||||||
|
|
||||||
|
### Usage
|
||||||
|
|
||||||
|
```
|
||||||
|
{{</* hextra/hero-section heading="h3" */>}}Title{{</* /hextra/hero-section */>}}>
|
||||||
|
```
|
||||||
|
|
||||||
|
### Options
|
||||||
|
|
||||||
|
| Parameter | Description |
|
||||||
|
|-----------|-----------------|
|
||||||
|
| `heading` | 标题级别(默认值:`h2`)。 |
|
||||||
|
| `style` | 标题的样式。 |
|
||||||
|
| `content` | 标题的内容。 |
|
||||||
|
|
||||||
|
## `hextra/hero-subtitle`
|
||||||
|
|
||||||
|
显示英雄字幕的短代码。
|
||||||
|
|
||||||
|
### Usage
|
||||||
|
|
||||||
|
```
|
||||||
|
{{</* hextra/hero-subtitle */>}}
|
||||||
|
Fast, batteries-included Hugo theme <br class="hx:sm:block hx:hidden" />for creating beautiful static websites
|
||||||
|
{{</* /hextra/hero-subtitle */>}}
|
||||||
|
```
|
||||||
|
|
||||||
|
### Options
|
||||||
|
|
||||||
|
| Parameter | Description |
|
||||||
|
|-----------|-------------|
|
||||||
|
| `style` | 字幕的样式。 |
|
Reference in New Issue
Block a user