掲載バッジの貼り方
IDEAVALUに掲載した作品は、自分のサイトにバッジを貼れます。押すとIDEAVALUの作品ページが開き、Boost数が表示されます。公開した月のランキングで10位以内に入ると、バッジに順位が出ます。
あなたの作品のバッジ
ログインすると、自分の作品のバッジのコードをここでコピーできます。
ログインしてコードを取得どこに貼るといいか
- 作品の公式サイトやLPのフッター(どのページにも出るので、1か所貼れば済みます)
- トップページの下の方や、「メディア掲載」「紹介されたサイト」の欄
- GitHub の README の先頭(ほかのバッジと並べて置けます)
- 自分のポートフォリオサイトの作品紹介
同じサイトに何個も貼る必要はありません。1か所で十分です。
サイトの作り方別の手順
HTMLを自分で書いているサイト
- 上の「あなたの作品のバッジ」で形式「HTML」を選び、コードをコピーします。
- index.html などを開き、表示したい場所(
<footer>の中など)に貼り付けます。 - ファイルを保存して公開し、バッジが出ているか確認します。
React・Next.js・Vue などで作ったサイト
- 形式「React・Next.js」を選んでコピーします(width と height が
{224}の形になっています)。 - フッターなどのコンポーネントの中に貼り付けます。Vue や Svelte ではHTMLの形式をそのまま使えます。
- Next.js の
next/imageは外部画像の設定が必要になるので、コードのとおり<img>のままにしてください。
WordPress
- 形式「HTML」を選んでコピーします。
- 投稿・固定ページの編集画面で「+」を押し、「カスタムHTML」ブロックを追加して貼り付けます。全ページに出したいときは、ウィジェットやフッターの編集で同じブロックを使います。
- 更新して、公開ページで確認します。
STUDIO・Wix・ペライチなどのノーコードツール
- ツールに「HTML埋め込み」「コード埋め込み」の機能があれば、形式「HTML」のコードを貼ります。
- ない場合は形式「画像とリンク」を選び、画像を置いてから、画像のURL(またはアップロード)とリンク先のURLを設定します。
- 画像を保存してアップロードした場合、Boost数は保存した時点のまま変わりません。
GitHub の README
- 形式「Markdown」を選んでコピーします。
- README.md の先頭など、表示したい場所に貼り付けてコミットします。
App Store・Google Play だけで公開している
ストアの説明文には画像やリンクを貼れません。サポートページ、プライバシーポリシーのページ、GitHub の README など、自分で編集できるページがあればそこに貼ってください。
よくある質問
- 貼らないと掲載や順位に影響しますか?
- 影響しません。バッジは任意です。貼っていなくても、掲載・ランキング・メールでの紹介の扱いは同じです。
- Boost数がすぐに変わりません
- Boost数と順位は1時間ごとに更新されます。ブラウザに古い画像が残っていることもあるので、時間をおいて再読み込みしてください。
- 順位の表示はいつ出ますか?
- 公開した月(日本時間)のランキングで10位以内に入ると「2026年10月 3位」のように表示されます。その月に公開された作品が10件未満のときは出ません。貼り直す必要はありません。
- 色や大きさを変えられますか?
- 色は白と紺の2種類です。大きさは width と height の数字を同じ比率で変えれば縮小・拡大できます(例:168 と 42)。
- 外したいときは?
- 貼ったコードを消すだけです。IDEAVALU側の手続きはいりません。