NotByAI バッジ#

ドキュメントサイトでは、ページが人の手で書かれたことを示す必要があることがあります。 <NotByAI /> はオプトインの執筆開示バッジです。状態ラベルではありません。

beta や deprecated などの状態ラベルはインラインバッジ（{badge:tip}）を使います。この機能は公式の Not By AI アートワークだけを静的 HTML として出します。

オプション	型	既定
`notByAi`	`boolean` / `NotByAiOptions`	`false`

import { oxContent } from "@ox-content/vite-plugin";

export default {
  plugins: [
    oxContent({
      notByAi: true,
    }),
  ],
};

false または省略はソースを変えません。true またはオブジェクトでバッジをオンにします。クライアント JavaScript も hydration もありません。

書き方#

正式な形は <NotByAI /> です。空白なしの自己閉じも受け付けます。

このページは人が書いています。

<NotByAI />

このページは人が書いています。

既定のアクセシブルラベルは Written by human, not by AI です。既定のリンクは https://notbyai.fyi です。どちらも上書きできます。

oxContent({
  notByAi: {
    label: "ドキュメントチームが執筆",
    href: "https://example.com/authorship",
  },
});

安全でない href（javascript:、data:、プロトコル相対 URL）は公式 URL に戻します。label と href は HTML エスケープされます。

フェンス、インデントコード、インラインコード、HTML コメントは書き換えません。不正または閉じていないタグはリテラルのままです。.md と .mdx は同じ静的マークアップを出します。NotByAI は予約済みなので、MDX は island にしません。

ライト / ダークのアートワーク#

バッジは公式のライト / ダーク SVG を含みます。組み込み SSG の CSS は prefers-color-scheme とホストのカラースキームクラス（[data-theme]、 .dark、.light）で切り替えます。カスタムホストは同じシートを import します。

@import "@ox-content/vite-plugin/styles/not-by-ai.css";

コンポーネント CSS を見てください。

サイト側プリプロセッサからの移行#

サイトがすでに <NotByAI /> をプレースホルダに置き換え、描画後にベンダー済み SVG を差し込んでいる場合（ryoppippi.com の形）、notByAi をオンにしてそのプリプロセッサ、SVG import、描画後の置換、保護テストを削除できます。

NotByAI バッジ#

書き方#

ライト / ダークのアートワーク#

サイト側プリプロセッサからの移行#

関連#