パーツの見本

 

1 テキスト見本 参考URL

【アフィンガー公式】
https://the-money.net/wing-affinger5-writtingparts/
【参考サイト】
https://bvb-arigato.com/wing-standard-option/#st-toc-h-31

2-1 テキスト

赤字:サンプル

太字:サンプル

赤字(太字):サンプル

大文字:サンプル

小文字:サンプル

ドット字:サンプル

参照リンク:

サンプル

参考:サンプル

必須:サンプル

打ち消し:サンプル

code:サンプル

code風:サンプル

NoteSans(フォント):サンプル

RoundedM+1c(フォント):サンプル

 

2-2 アニメーション

45°揺れ: サンプル

ベル揺れ: サンプル

横揺れ: サンプル

縦揺れ: サンプル

点滅:

サンプル

バウンド:サンプル

回転:

サンプル

ふわふわ:サンプル

大小:サンプル

シェイク:サンプル

シェイク(強):サンプル

拡大(ゆれ):サンプル

過ぎる:サンプル

戻る:サンプル

バースト:サンプル

落ちる:サンプル

 

2-3 アイコン

はてな

注意

人物

チェック

メモ

王冠

初心者マーク

 

2-4 ランキング

ランキング1位

ランキング2位

ランキング3位

ランキング4位以下

 

2-5 マーカー

黄色マーカー

黄色マーカー(細)

赤マーカー

赤マーカー(細)

青マーカー

青マーカー(細)

鼠マーカー

鼠マーカー(細)

 

2-6 写真

【枠線】

【ボラロイド風】

【ワイド】

2-7 ボックス

黄色ボックス

サンプル

薄赤ボックス

サンプル

グレーボックス

サンプル

引用風ボックス

サンプル

ワイド背景

サンプル

ワイド背景(左寄せ)

サンプル

ワイド背景(右寄せ)

サンプル

 

2-8 リスト

【ドット下線リスト】

  • ダミーテキスト
  • ダミーテキスト
  • ダミーテキスト

 

【まるリスト】

  • ダミーテキスト
  • ダミーテキスト
  • ダミーテキスト

 

【まる+ドット下線リスト】

  • ダミーテキスト
  • ダミーテキスト
  • ダミーテキスト

 

【簡易チェックリスト】

  • ダミーテキスト
  • ダミーテキスト
  • ダミーテキスト

 

【簡易チェック+ドット下線リスト】

  • ダミーテキスト
  • ダミーテキスト
  • ダミーテキスト

 

【チェックリスト(番号なしリスト)】

  • ダミーテキスト
  • ダミーテキスト
  • ダミーテキスト

 

【チェックリスト(番号なしリスト)】

  • ダミーテキスト
  • ダミーテキスト
  • ダミーテキスト

 

【ナンバリング(番号ありリスト)】

  • ダミーテキスト
  • ダミーテキスト
  • ダミーテキスト

 

【ナンバリング四角(リスト)】

  • ダミーテキスト
  • ダミーテキスト
  • ダミーテキスト

 

【ナンバリング四角+ドット下線(リスト)】

  • ダミーテキスト
  • ダミーテキスト
  • ダミーテキスト

 

2-9 レイアウト

【センター寄せ】

センター寄せ

センター寄せ(スマホのみ)

【要素の下に「10px」余白】

下に余白

【カードスタイル】

カードスタイルを使ったブログ風カードの作り方:https://the-money.net/blogcard-huu/

2-10 テーブル

【テーブル横スクロール】

10
ダミーテキスト ダミーテキスト ダミーテキスト ダミーテキスト ダミーテキスト ダミーテキスト ダミーテキスト ダミーテキスト ダミーテキスト ダミーテキスト
ダミーテキスト ダミーテキスト ダミーテキスト ダミーテキスト ダミーテキスト ダミーテキスト ダミーテキスト ダミーテキスト ダミーテキスト ダミーテキスト

【中央配置】

ダミーテキスト ダミーテキスト ダミーテキスト ダミーテキスト
ダミーテキスト ダミーテキスト ダミーテキスト ダミーテキスト

【装飾なし】

ダミーテキスト ダミーテキスト ダミーテキスト ダミーテキスト
ダミーテキスト ダミーテキスト ダミーテキスト ダミーテキスト

 

 

3-1 テキストパーツ

【クリップメモ】

メモ

外部リンク

ブックマーク

お知らせ

はてな

コメント

コード

ポイント

ユーザー

初心者

注意文

注意文(グレー)

 

【ミニふきだし】

基本

オレンジ

ピンク

ブルー

グリーン

レッド

 

【複合】

自由なメモ

自由なメモ サンプル

ココがポイント

ココがポイント サンプル

ココがおすすめ

ココがおすすめ サンプル

ココがダメ

ココがダメ サンプル

ココに注意

ココに注意  サンプル

さらに詳しく

さらに詳しく  サンプル

◯才女性

女性コメント サンプル

◯才男性

男性コメント サンプル

 

【複合(アイコンなし)】

自由なメモ

自由なメモ サンプル

ココがポイント

ココがポイント サンプル

ココがおすすめ

ココがおすすめ サンプル

ココがダメ

ココがダメ サンプル

ココに注意

ココに注意 サンプル

もっと詳しく

もっと詳しく サンプル

つまづきポイント

はてなマーク サンプル

 

【まるもじ(小)】

基本 オレンジ ピンク ブルー うすい注意 注意

 

【まるもじ(大)】

基本

オレンジ

ピンク

ブルー

はてな

チェック

うすい注意

注意

 

【カスタムフォント】

サンプル

 

【カスタムフォント(白影)】

サンプル

 

【ステップ】

step
1
サンプル

step
2
サンプル

step
3
サンプル

 

【ポイント】

ポイント

 

【ラベル】

おすすめ

サンプル

 

【流れる文字】

流れる文字(marquee風)

 

3-2 ボックスデザイン

バナー風ボックス

【基本】

タイトル

基本サンプル

 

【背景なし(高さ400px)】

タイトル

背景なし(高さ400px)

 

【左寄せ】

タイトル

左寄せ

 

 

マイボックス

ポイント

基本サンプル

しかく(枠のみ)サンプル

まるみサンプル

参考

参考サンプル

関連

関連サンプル

メモ

メモサンプル

ポイント

ポイントサンプル

注意ポイント

注意ポイントサンプル

はてな

はてなサンプル

 

 

マイボックス(+css)

メモ

メモサンプル

メモ

メモ(下線のみ)サンプル

メモ

メモ(枠のみ)サンプル

メモ

メモ(下線・枠あり)サンプル

ここに注意

注意(下線のみ)サンプル

必要なモノ

  • 必要なモノダミーテキスト
  • 必要なモノダミーテキスト
  • 必要なモノダミーテキスト

必要なモノ

  • 必要なモノ(ドット下線)ダミーテキスト
  • 必要なモノ(ドット下線)ダミーテキスト
  • 必要なモノ(ドット下線)ダミーテキスト

チェックリスト

  • チェックリスダミーテキスト
  • チェックリスダミーテキスト
  • チェックリスダミーテキスト

チェックリスト

  • チェックリスト(ドット下線)ダミーテキスト
  • チェックリスト(ドット下線)ダミーテキスト
  • チェックリスト(ドット下線)ダミーテキスト

簡単な流れ

  • 簡単な流れダミーテキスト
  • 簡単な流れダミーテキスト
  • 簡単な流れダミーテキスト

簡単な流れ

  • 簡単な流れ(ドット下線)ダミーテキスト
  • 簡単な流れ(ドット下線)ダミーテキスト
  • 簡単な流れ(ドット下線)ダミーテキスト

 

 

見出し付きフリーボックス

見出し(全角15文字)

基本サンプル

注意

注意サンプル

はてな

はてなサンプル

ポイント

ポイントサンプル

メモ

メモサンプル

見出し(全角15文字)

基本(タイトル幅100%)サンプル

注意

注意(タイトル幅100%)サンプル

はてな

はてな(タイトル幅100%)サンプル

ポイント

ポイント(タイトル幅100%)サンプル

メモ

メモ(タイトル幅100%)サンプル

 

その他ボックス

【メモボックス】

メモ

メモボックスサンプル

 

【スライドボックス】

 

【チェックボックス(番号なしリスト)】

  • チェックボックス(番号なしリスト)ダミーテキスト
  • チェックボックス(番号なしリスト)ダミーテキスト
  • チェックボックス(番号なしリスト)ダミーテキスト

 

【こんな方におすすめ】

こんな方におすすめ

  • これはダミーのテキストです
  • これはダミーのテキストです

 

【こんな方におすすめ】

こんな方におすすめ

  • これはダミーのテキストです
  • これはダミーのテキストです

 

【ガイドマップメニュー】

 

【コード】

 html
preサンプル
 command
pre:terminalサンプル

 

 

3-3 カスタムボタン

【ノーマル】

ボタン

詳しくはコチラ

詳しくはコチラ

詳しくはコチラ

詳しくはコチラ

お問合せ

もっと詳しく

もっと詳しく

もっと詳しく

人気ランキング

ランキングはコチラ

【ミニ】

ボタン 詳しくはコチラ 詳しくはコチラ 詳しくはコチラ 詳しくはコチラ

 

【MCボタン】

太字のテキスト

今すぐ申し込む

※マイクロコピーを書いてみよう

太字のテキスト

今すぐ申し込む

※マイクロコピーを書いてみよう

太字のテキスト

今すぐ申し込む

※マイクロコピーを書いてみよう

太字のテキスト

今すぐ申し込む

※マイクロコピーを書いてみよう

 

【ボタンA・ボタンB】

 

【前のページ(履歴)に戻る】

 

 

3-4 会話吹き出し

会話1
会話2
友達

 

※最大8人まで設定可能

アイコンの設定は、Wordpress管理画面の「AFFINGER5 管理」>「会話・ファビコン等」と進み、「会話風アイコン」の項目から画像(60px以上の正方形)をアップロード。

参考ページ:  https://the-money.net/wing-affinger5-writtingparts/

 

3-5 ランキング

ランキング1位

ランキング2位

ランキング3位

ランキング4位以下

 

3-6 レイアウト

【PCとTab3分割】

左側のコンテンツ33%

真ん中のコンテンツ33%

右側のコンテンツ33%

 

【PCとTab左右40%:60%】

左側のコンテンツ40%

右側のコンテンツ60%

 

【PCとTab左右50%】

左側のコンテンツ50%

右側のコンテンツ50%

 

【全サイズ左右30%:70%】

左側のコンテンツ30%

右側のコンテンツ70%

 

【全サイズ左右50%】

左側のコンテンツ50%

右側のコンテンツ50%

 

【全サイズ左右free%】

左側のコンテンツ%

右側のコンテンツ%

 

【均等横並び】

  • 横並びコンテンツ
  • 横並びコンテンツ
  • 横並びコンテンツ

 

【背景ワイド】

背景ワイドサンプル

 

【div】

div

 

【マージン指定】

マージン

 

【table(シンプル)】

テキスト

 

【table(属性あり)】

テキスト

 

【タブ2つ】

タブ1のコンテンツ

タブ2のコンテンツ

 

【タブ3つ】

タブ1のコンテンツ

タブ2のコンテンツ

タブ3のコンテンツ

 

 

3-7 その他パーツ

【グーグルアイコン】

AFFINGER管理 > デザイン > Googleマテリアルアイコン > 使用するにチェック
すると使えるようになる

【スター】

星5つ:

星4.5つ:

星4つ:

星3.5つ:

星3つ:

星2つ:

星1つ:

 

【カウントダウン】

基本:  --時間---終了しました

日ループ:  --時間---

月ループ:  --時間---

 

【年月(自動更新)】

2024年12月

 

【画像付きコメント】

タイトル

◯代男性

画像サイズは60×60で設定する。

コメントコメントコメント

 

【アドセンス】

スポンサーリンク

 

【オリジナルショートコード】

 

【ユーチューブ】

 

【三角(下矢印)】

 

【スクロールナビ】

 

【目次(カスタム)】