アフィンガー

アフィンガーの記事パーツの備忘録

更新日:

私は長年サイト作成をしていますが、全て独学で必要な事だけ学んで来ましたので、詳しい事はプロの方ほど知りません。作業効率もプロの方には敵いません。

しかしこれでも数千のサイトを作ってきました。もちろんペラサイトも合わせてですが・・・

駆け出しは、HTMLのテンプレートなどを利用して手打ちでサイトを作っていました。そのうちSIRIUSなるサイト作成ソフトに出会い、数千のサイトの管理のし易さと、本格的サイトを簡単に作れる事からSIRIUSが手放せなくなりました。

ですので、長らくの間WordPressに触れることなくサイト作成してきましたので、2018年にやっと勉強しだしたところです。

なるほどSIRIUSには出来ない様々な便利な機能があり、まずはSIRIUSからの移行作業から入りました。

移行作業はある程度の回数を経ると、MultiReplaceという無料ソフトを使えば簡単にできるようになるのですが、移行した後の追加や編集し直しの際に、Affingerのビュジュアルエディターでしか出ないツールなどを使った際に、テキストエディターに戻すとPタグやbrタグが消えたりと(TinymceAdvancedを使っても解決しない場合がある)面倒なことになるので、テキストエディターだけで編集できるようソースコードの備忘録が必要になりましたので作りました。

WordPressテーマ 「WING(AFFINGER5)」

Contents

ビジュアルエディタ>スタイル

ビジュアルエディタ>スタイル>で装飾できます

アニメーション

横揺れ

<span class="faa-horizontal animated fa st-animate">横揺れ</span>

45°揺れ

<span class="fa faa-wrench animated st-animate">45°揺れ</span>

ベル揺れ

<span class="fa faa-ring animated st-animate">ベル揺れ</span>

縦揺れ

<span class="fa faa-vertical animated st-animate">縦揺れ</span>

点滅

<span class="fa faa-flash animated st-animate">点滅</span>

バウンド

<span class="fa faa-bounce animated st-animate">バウンド</span>

回転

<span class="fa faa-spin animated st-animate">回転</span>

ふわふわ

<span class="fa faa-float animated st-animate">ふわふわ</span>

大小

<span class="fa faa-pulse animated st-animate">大小</span>

シェイク

<span class="fa faa-shake animated st-animate">シェイク</span>

シェイク(強)

<span class="st-shake st-animate">シェイク(強)</span>

拡大(ゆれ)

<span class="fa faa-tada animated st-animate">拡大(ゆれ)</span>

過ぎる

<span class="fa faa-passing animated st-animate">過ぎる</span>

戻る

<span class="fa faa-passing-reverse animated st-animate">戻る</span>

バースト

<span class="fa faa-passing-reverse animated st-animate">バースト</span>

落ちる

<span class="fa faa-falling animated st-animate">落ちる</span>

写真

枠線

<p style="text-align:center;"><span class="photoline"><img src="写真URL" alt="" /></span></p>

ポラロイド風

<p style="text-align:center;"><span class="st-photohu"><img src="写真URL" alt="" /></span></p>

ワイド

<div class="st-eyecatch-width"><img src="写真URL" alt="" /></div>

ボックス

 

<div class="yellowbox">
<p>&nbsp;</p>
</div>

 

<div class="redbox">
<p>&nbsp;</p>
</div>

 

<div class="graybox">
<p>&nbsp;</p>
</div>

 

<div class="inyoumodoki">
<p>&nbsp;</p>
</div>

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

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

<div class="st-square-checkbox st-square-checkbox-nobox">
<ul>
<li>これはダミーのテキストです</li>
<li>これはダミーのテキストです</li>
</ul>
</div>

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

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

<div class="maruck">
<ul>
<li>これはダミーのテキストです</li>
<li>これはダミーのテキストです</li>
</ul>
</div>

ナンバリング(番号付きリスト)

  1. これはダミーのテキストです
  2. これはダミーのテキストです

<div class="maruno">
<ol>
<li>これはダミーのテキストです</li>
<li>これはダミーのテキストです</li>
</ol>
</div>

レイアウト

回り込み解除

センター寄せ

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

下に余白

カードスタイル

※記事ID2で設定されています(ない場合は適宜変更して下さい)

ブログカードに別のデザインを設定します(全サイズで縦型)

カードスタイルB

ブログカードに別のデザインを設定します(PC、タブレット閲覧時のみ縦型)

ランキングボックス

「ランキング一覧背景色」と同じスペースを設定します

width100%リセット

max-width: initial; display: inline;を設定してmax-widthをリセットします。

imgインラインボックス

display: inline;を指定します。

テーブル

横スクロール

スティンガー アッフィンガー アッフィンガーEX

中央配置

スティンガー アッフィンガー アッフィンガーEX

装飾なし

スティンガー アッフィンガー アッフィンガーEX

マーカー

アッフィンガー

アッフィンガー

アッフィンガー

アッフィンガー

アッフィンガー

アッフィンガー

アッフィンガー

アッフィンガー

ビジュアルエディタ>タグ

テキストパーツ

クリップメモ

外部リンク

[st-cmemo fontawesome="fa-external-link" iconcolor="#BDBDBD" bgcolor="#fafafa" color="#757575" iconsize="100"]外部リンク[/st-cmemo]

ブックマーク

[st-cmemo fontawesome="fa-bookmark" iconcolor="#BDBDBD" bgcolor="#fafafa" color="#757575" iconsize="100"]ブックマーク[/st-cmemo]

おしらせ

[st-cmemo fontawesome="fa-bullhorn" iconcolor="#FFEB3B" bgcolor="#FFFDE7" color="#000000" iconsize="100"]おしらせ[/st-cmemo]

はてな

[st-cmemo fontawesome="fa-question-circle" iconcolor="#4FC3F7" bgcolor="#E1F5FE" color="#000000" iconsize="100"]はてな[/st-cmemo]

コメント

[st-cmemo fontawesome="fa-comments" iconcolor="#F48FB1" bgcolor="#FCE4EC" color="#000000" iconsize="100"]コメント[/st-cmemo]

コード

[st-cmemo fontawesome="fa-code" iconcolor="#919191" bgcolor="#fafafa" color="#000000" iconsize="150"]コード[/st-cmemo]

ポイント

[st-cmemo fontawesome="fa-lightbulb-o" iconcolor="#FFA726" bgcolor="#FFF3E0" color="#000000" iconsize="100"]ポイント[/st-cmemo]

ユーザー

[st-cmemo fontawesome="fa-user" iconcolor="#4FC3F7" bgcolor="#E1F5FE" color="#000000" iconsize="150"]ユーザー[/st-cmemo]

初心者

[st-cmemo fontawesome="fa-user" iconcolor="#4FC3F7" bgcolor="#E1F5FE" color="#000000" iconsize="150"]ユーザー[/st-cmemo]

注意文

[st-cmemo fontawesome="fa-exclamation-circle" iconcolor="#ef5350" bgcolor="#ffebee" color="#000000" iconsize="100"]注意文[/st-cmemo]

注意文(グレー)

[st-cmemo fontawesome="fa-exclamation-circle" iconcolor="#919191" bgcolor="#fafafa" color="#000000" iconsize="100"]注意文(グレー)[/st-cmemo]

ショートコードガイド



[st-cmemo fontawesome="Webアイコン" iconcolor="アイコンの色" bgcolor="背景色" color="文字色" iconsize="アイコンサイズ(%)"]

ミニふきだし

基本

[st-minihukidashi fontawesome="" fontsize="" fontweight="" bgcolor="#f3f3f3" color="#000000" margin="0 0 20px 0"]基本[/st-minihukidashi]

オレンジ

[st-minihukidashi fontawesome="" fontsize="" fontweight="" bgcolor="#FFB74D" color="#fff" margin="0 0 20px 0"]オレンジ[/st-minihukidashi]

ピンク

[st-minihukidashi fontawesome="" fontsize="" fontweight="" bgcolor="#F48FB1" color="#fff" margin="0 0 20px 0"]ピンク[/st-minihukidashi]

ブルー

[st-minihukidashi fontawesome="" fontsize="" fontweight="" bgcolor="#4FC3F7" color="#fff" margin="0 0 20px 0"]ブルー[/st-minihukidashi]

グリーン

[st-minihukidashi fontawesome="" fontsize="" fontweight="" bgcolor="#7CB342" color="#fff" margin="0 0 20px 0"]グリーン[/st-minihukidashi]

レッド

[st-minihukidashi fontawesome="" fontsize="" fontweight="" bgcolor="#f44336" color="#fff" margin="0 0 20px 0"]レッド[/st-minihukidashi]

ショートコードガイド



[st-minihukidashi fontawesome="Webアイコン" fontsize="文字サイズ(%)" fontweight="文字の太さ(bold)" bgcolor="背景色" color="文字色" margin="余白(上 右 下 左)"]

複合

自由なメモ


コメント

[st-minihukidashi fontawesome="" fontsize="80" fontweight="" bgcolor="#FFC107" color="#fff" margin="0 0 0 -6px"]自由なメモ[/st-minihukidashi]

[st-cmemo fontawesome="fa-file-text-o" iconcolor="#FFC107" bgcolor="#FFFDE7" color="#000000" iconsize="200"]コメント[/st-cmemo]

ココがポイント


コメント

[st-minihukidashi fontawesome="" fontsize="80" fontweight="" bgcolor="#3F51B5" color="#fff" margin="0 0 0 -6px"]ココがポイント[/st-minihukidashi]

[st-cmemo fontawesome="fa-hand-o-right" iconcolor="#3F51B5" bgcolor="#E8EAF6" color="#000000" iconsize="200"]コメント[/st-cmemo]

ココがおすすめ


コメント

[st-minihukidashi fontawesome="" fontsize="80" fontweight="" bgcolor="#3F51B5" color="#fff" margin="0 0 0 -6px"]ココがおすすめ[/st-minihukidashi]

[st-cmemo fontawesome="fa-thumbs-o-up" iconcolor="#3F51B5" bgcolor="#E8EAF6" color="#000000" iconsize="200"]コメント[/st-cmemo]

ココがダメ


コメント

[st-minihukidashi fontawesome="" fontsize="80" fontweight="" bgcolor="#3F51B5" color="#fff" margin="0 0 0 -6px"]ココがダメ[/st-minihukidashi]

[st-cmemo fontawesome="fa-thumbs-o-down" iconcolor="#3F51B5" bgcolor="#E8EAF6" color="#000000" iconsize="200"]コメント[/st-cmemo]

ココに注意


コメント

[st-minihukidashi fontawesome="" fontsize="80" fontweight="" bgcolor="#ef5350" color="#fff" margin="0 0 0 -6px"]ココに注意[/st-minihukidashi]

[st-cmemo fontawesome="fa-exclamation-circle" iconcolor="#ef5350" bgcolor="#ffebee" color="#000000" iconsize="200"]コメント[/st-cmemo]

もっと詳しく


コメント

[st-minihukidashi fontawesome="" fontsize="80" fontweight="" bgcolor="#66BB6A" color="#fff" margin="0 0 0 -8px"]もっと詳しく[/st-minihukidashi]

[st-cmemo fontawesome="fa-search" iconcolor="#66BB6A" bgcolor="#E8F5E9" color="#000000" iconsize="200"]コメント[/st-cmemo]

女性コメント


コメント

[st-minihukidashi fontawesome="" fontsize="80" fontweight="" bgcolor="#F06292" color="#fff" margin="0 0 0 -9px"]女性コメント[/st-minihukidashi]

[st-cmemo fontawesome="fa-user" iconcolor="#F06292" bgcolor="#FCE4EC" color="#000000" iconsize="200"]コメント[/st-cmemo]

男性コメント


コメント

[st-minihukidashi fontawesome="" fontsize="80" fontweight="" bgcolor="#42A5F5" color="#fff" margin="0 0 0 -9px"]男性コメント[/st-minihukidashi]

[st-cmemo fontawesome="fa-user" iconcolor="#42A5F5" bgcolor="#E3F2FD" color="#000000" iconsize="200"]コメント[/st-cmemo]

複合(アイコンなし)

自由なメモ


コメント

[st-minihukidashi fontawesome="fa-file-text-o" fontsize="90" fontweight="bold" bgcolor="#FFC107" color="#fff" margin="0 0 0 0"]自由なメモ[/st-minihukidashi]

[st-mybox title="" fontawesome="" color="#757575" bordercolor="" bgcolor="#FFFDE7" borderwidth="0" borderradius="5" titleweight="bold" fontsize=""]コメント[/st-mybox]

ココがポイント


コメント

[st-minihukidashi fontawesome="fa-hand-o-right" fontsize="90" fontweight="bold" bgcolor="#3F51B5" color="#fff" margin="0 0 0 0"]ココがポイント[/st-minihukidashi]

[st-mybox title="" fontawesome="" color="#757575" bordercolor="" bgcolor="#E8EAF6" borderwidth="0" borderradius="5" titleweight="bold" fontsize=""]コメント[/st-mybox]

ココがおすすめ


コメント

[st-minihukidashi fontawesome="fa-circle-o" fontsize="90" fontweight="bold" bgcolor="#3F51B5" color="#fff" margin="0 0 0 0"]ココがおすすめ[/st-minihukidashi]

[st-mybox title="" fontawesome="" color="#757575" bordercolor="" bgcolor="#E8EAF6" borderwidth="0" borderradius="5" titleweight="bold" fontsize=""]コメント[/st-mybox]

ココがダメ


コメント

[st-minihukidashi fontawesome="fa-times" fontsize="90" fontweight="bold" bgcolor="#3F51B5" color="#fff" margin="0 0 0 0"]ココがダメ[/st-minihukidashi]

[st-mybox title="" fontawesome="" color="#757575" bordercolor="" bgcolor="#E8EAF6" borderwidth="0" borderradius="5" titleweight="bold" fontsize=""]コメント[/st-mybox]

ココに注意


コメント

[st-minihukidashi fontawesome="fa-exclamation-circle" fontsize="90" fontweight="bold" bgcolor="#ef5350" color="#fff" margin="0 0 0 0"]ココに注意[/st-minihukidashi]

[st-mybox title="" fontawesome="" color="#757575" bordercolor="" bgcolor="#ffebee" borderwidth="0" borderradius="5" titleweight="bold" fontsize=""]コメント[/st-mybox]

もっと詳しく


コメント

[st-minihukidashi fontawesome="fa-search" fontsize="90" fontweight="bold" bgcolor="#66BB6A" color="#fff" margin="0 0 0 0"]もっと詳しく[/st-minihukidashi]

[st-mybox title="" fontawesome="" color="#757575" bordercolor="" bgcolor="#E8F5E9" borderwidth="0" borderradius="5" titleweight="bold" fontsize=""]コメント[/st-mybox]

はてなマーク


コメント

[st-minihukidashi fontawesome="fa-question-circle" fontsize="90" fontweight="bold" bgcolor="#03A9F4" color="#fff" margin="0 0 0 0"]はてなマーク[/st-minihukidashi]

[st-mybox title="" fontawesome="" color="#757575" bordercolor="" bgcolor="#E1F5FE" borderwidth="0" borderradius="5" titleweight="bold" fontsize=""]コメント[/st-mybox]

まるもじ(小)

基本

[st-marumozi fontawesome="" bgcolor="#f3f3f3" color="#000000" radius="30" margin="0 10px 0 0"]基本[/st-marumozi]

オレンジ

[st-marumozi fontawesome="" bgcolor="#FFB74D" color="#fff" radius="30" margin="0 10px 0 0"]オレンジ[/st-marumozi]

ピンク

[st-marumozi fontawesome="" bgcolor="#F48FB1" color="#fff" radius="30" margin="0 10px 0 0"]ピンク[/st-marumozi]

ブルー

[st-marumozi fontawesome="" bgcolor="#4FC3F7" color="#fff" radius="30" margin="0 10px 0 0"]ブルー[/st-marumozi]

うすい注意

[st-marumozi fontawesome="fa-exclamation-circle" bgcolor="#ffebee" color="#ef5350" radius="30" margin="0 10px 0 0"]うすい注意[/st-marumozi]

注意

[st-marumozi fontawesome="fa-exclamation-circle" bgcolor="#ef5350" color="#fff" radius="30" margin="0 10px 0 0"]注意[/st-marumozi]

ショートコードガイド



[st-marumozi fontawesome="Webアイコン" bgcolor="背景色" color="文字色" radius="角丸(px)" margin="余白(上 右 下 左)"]

まるもじ(大)

基本

[st-marumozi-big fontawesome="" bgcolor="#f3f3f3" color="#000000" radius="30" margin="0 10px 10px 0"]基本[/st-marumozi-big]

オレンジ

[st-marumozi-big fontawesome="" bgcolor="#FFB74D" color="#fff" radius="30" margin="0 10px 10px 0"]オレンジ[/st-marumozi-big]

ピンク

[st-marumozi-big fontawesome="" bgcolor="#F48FB1" color="#fff" radius="30" margin="0 10px 10px 0"]ピンク[/st-marumozi-big]

ブルー

[st-marumozi-big fontawesome="" bgcolor="#4FC3F7" color="#fff" radius="30" margin="0 10px 10px 0"]ブルー[/st-marumozi-big]

はてな

[st-marumozi-big fontawesome="fa-question-circle" bgcolor="#4FC3F7" color="#fff" radius="30" margin="0 10px 10px 0"]はてな[/st-marumozi-big]

チェック

[st-marumozi-big fontawesome="fa-check-circle" bgcolor="#FFB74D" color="#fff" radius="30" margin="0 10px 10px 0"]チェック[/st-marumozi-big]

うすい注意

[st-marumozi-big fontawesome="fa-exclamation-circle" bgcolor="#ffebee" color="#ef5350" radius="30" margin="0 10px 10px 0"]うすい注意[/st-marumozi-big]

注意

[st-marumozi-big fontawesome="fa-exclamation-circle" bgcolor="#ef5350" color="#fff" radius="30" margin="0 10px 10px 0"]注意[/st-marumozi-big]

ショートコードガイド



[st-marumozi-big fontawesome="Webアイコン" bgcolor="背景色" color="文字色" radius="角丸(px)" margin="余白(上 右 下 左)"]

カスタムフォント

カスタムフォント

[st-designfont myclass="" fontawesome="" fontsize="150" fontweight="bold" color="#000" textshadow="" webfont="" margin="0 0 20px 0"]カスタムフォント[/st-designfont]

カスタムフォント白影

カスタムフォント白影

[st-designfont myclass="" fontawesome="" fontsize="150" fontweight="bold" color="#fff" textshadow="#424242" webfont="on" margin="0 0 20px 0"]カスタムフォント白影[/st-designfont]

ステップ

step
1
1


step
2
2


step
3
3

[st-step step_no="1"]1[/st-step]

[st-step step_no="2"]2[/st-step]

[st-step step_no="3"]3[/st-step]

ポイント

ポイント

[st-point fontsize="" fontweight="bold" bordercolor=""]ポイント[/st-point]

ラベル

おすすめ


[st-label label="おすすめ" bgcolor="#FBC02D" color="#FFFFFF"]]

ラベル

ラベル

ラベル

ラベル

[[/st-label]

流れる文字

流れる文字

<div class="st-marquee">
<p>流れる文字</p>
</div>

ボックスデザイン

バナー風ボックス

基本

[st-flexbox url="" rel="nofollow" target="" fontawesome="" title="基本" width="" height="" color="#fff" fontsize="200" radius="0" shadow="#424242" bordercolor="#ccc" borderwidth="1" bgcolor="#ccc" backgroud_image="" blur="on" left="" margin_bottom="0"]]

[[/st-flexbox]

背景なし高さ400px

[st-flexbox url="" rel="nofollow" target="" fontawesome="" title="背景なし高さ400px" width="" height="400" color="#fff" fontsize="200" radius="0" shadow="#424242" bordercolor="" borderwidth="0" bgcolor="" backgroud_image="" blur="" left="" margin_bottom="0"]]

[[/st-flexbox]

左寄せ

[st-flexbox url="" rel="nofollow" target="" fontawesome="" title="左寄せ" width="" height="" color="#fff" fontsize="120" radius="0" shadow="#424242" bordercolor="#ccc" borderwidth="1" bgcolor="#29B6F6" backgroud_image="" blur="" left="on" margin_bottom="0"]]

[[/st-flexbox]

ショートコードガイド



[st-flexbox url="リンク先URL" rel="nofollow" target="リンクを新しく開く(target)" fontawesome="Webアイコン" title="タイトル" width="幅(%)" height="高さ(px)" color="文字色" fontsize="文字サイズ(%)" radius="角丸(px)" shadow="タイトルの影色" bordercolor="枠線カラー" borderwidth="枠線の太さ(px)" bgcolor="背景色" backgroud_image="背景画像のURL" blur="背景画像のぼかし" left="左寄せ(on)" margin_bottom="下の余白(px)"]

マイボックス

基本

[st-mybox title="基本" fontawesome="fa-check-circle" color="#757575" bordercolor="#BDBDBD" bgcolor="#ffffff" borderwidth="2" borderradius="5" titleweight="bold" fontsize="" myclass="st-mybox-class" margin="25px 0 25px 0"]]

[[/st-mybox]

しかく(枠のみ)


title部分に文字入れなければ枠のみになります。

[st-mybox title="しかく(枠のみ)" fontawesome="" color="#757575" bordercolor="#ccc" bgcolor="#ffffff" borderwidth="2" borderradius="2" titleweight="bold" fontsize="" myclass="st-mybox-class" margin="25px 0 25px 0"]]

[[/st-mybox]

まるみ

[st-mybox title="まるみ" fontawesome="" color="#757575" bordercolor="#BDBDBD" bgcolor="#f3f3f3" borderwidth="0" borderradius="5" titleweight="bold" fontsize="" myclass="st-mybox-class" margin="25px 0 25px 0"]]

[[/st-mybox]

参考

[st-mybox title="参考" fontawesome="fa-file-text-o" color="#757575" bordercolor="" bgcolor="#fafafa" borderwidth="0" borderradius="5" titleweight="bold" fontsize="" myclass="st-mybox-class" margin="25px 0 25px 0"]]

[[/st-mybox]

関連

[st-mybox title="関連" fontawesome="fa-file-text-o" color="#757575" bordercolor="" bgcolor="#fafafa" borderwidth="0" borderradius="5" titleweight="bold" fontsize="" myclass="st-mybox-class" margin="25px 0 25px 0"]]

[[/st-mybox]

メモ

[st-mybox title="メモ" fontawesome="fa-file-text-o" color="#757575" bordercolor="" bgcolor="#fafafa" borderwidth="0" borderradius="5" titleweight="bold" fontsize="" myclass="st-mybox-class" margin="25px 0 25px 0"]]

[[/st-mybox]

ポイント

[st-mybox title="ポイント" fontawesome="fa-check-circle" color="#FFD54F" bordercolor="#FFD54F" bgcolor="#FFFDE7" borderwidth="2" borderradius="5" titleweight="bold" fontsize="" myclass="st-mybox-class" margin="25px 0 25px 0"]]

[[/st-mybox]

注意ポイント

[st-mybox title="注意ポイント" fontawesome="fa-exclamation-circle" color="#ef5350" bordercolor="#ef9a9a" bgcolor="#ffebee" borderwidth="2" borderradius="5" titleweight="bold" fontsize="" myclass="st-mybox-class" margin="25px 0 25px 0"]]

[[/st-mybox]

はてな

[st-mybox title="はてな" fontawesome="fa-question-circle" color="#03A9F4" bordercolor="#B3E5FC" bgcolor="#E1F5FE" borderwidth="2" borderradius="5" titleweight="bold" fontsize="" myclass="st-mybox-class" margin="25px 0 25px 0"]]

[[/st-mybox]

ショートコードガイド



[st-mybox title="見出し" fontawesome="Webアイコン" color="見出し色" bordercolor="枠線カラー" bgcolor="背景色" borderwidth="枠線の太さ(px)" borderradius="角丸(px)" titleweight="見出しの太さ(bold)" fontsize="見出しのフォントサイズ" myclass="オリジナルクラス" margin="マージン"]

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

基本


見出しは全角15文字まで

[st-midasibox title="基本" fontawesome="" bordercolor="" color="" bgcolor="" borderwidth="" borderradius="" titleweight="bold"]]

見出しは全角15文字まで

[[/st-midasibox]

注意

[st-midasibox title="注意" fontawesome="fa-exclamation-circle faa-flash animated" bordercolor="#f44336" color="" bgcolor="#ffebee" borderwidth="" borderradius="5" titleweight="bold"]]

[[/st-midasibox]

はてな

[st-midasibox title="はてな" fontawesome="fa-question-circle faa-ring animated" bordercolor="#03A9F4" color="#fff" bgcolor="#E1F5FE" borderwidth="" borderradius="5" titleweight="bold"]]

[[/st-midasibox]

ポイント

[st-midasibox title="ポイント" fontawesome="fa-check-circle faa-ring animated" bordercolor="#FFC107" color="" bgcolor="#FFFDE7" borderwidth="" borderradius="5" titleweight="bold"]]

[[/st-midasibox]

メモ

[st-midasibox title="メモ" fontawesome="fa-file-text-o faa-float animated" bordercolor="#757575" color="" bgcolor="#FAFAFA" borderwidth="" borderradius="5" titleweight="bold"]]

[[/st-midasibox]

メモボックス

メモ

 

<div class="st-memobox2">
<p class="st-memobox-title">メモ</p>
<p>&nbsp;</p>
</div>

スライドボックス

+ クリックして下さい

[st-slidebox text="+ クリックして下さい" bgcolor="" color="#1a1a1a" margin_bottom="20"]]

[[/st-slidebox]

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

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

[st-square-checkbox bgcolor="" bordercolor="" fontweight="" borderwidth="3"]]

<ul>
<li>これはダミーのテキストです</li>
<li>これはダミーのテキストです</li>
</ul>

[[/st-square-checkbox]

こんな方におすすめ(v)

こんな方におすすめ

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

<div class="st-blackboard">
<p class="st-blackboard-title-box"><span class="st-blackboard-title">こんな方におすすめ</span></p>
<ul class="st-blackboard-list st-no-ck-off">
<li>これはダミーのテキストです</li>
<li>これはダミーのテキストです</li>
</ul>
</div>

こんな方におすすめ[v]

こんな方におすすめ

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

<div class="st-blackboard square-checkbox">
<p class="st-blackboard-title-box"><span class="st-blackboard-title">こんな方におすすめ</span></p>
<ul class="st-blackboard-list st-no-ck-off">
<li>これはダミーのテキストです</li>
<li>これはダミーのテキストです</li>
</ul>
</div>

ガイドマップメニュー

<div class="st-link-guide st-link-guide-post">
<ul class="st-link-guide-menu">
<li><a href="#">ダミーリンク</a></li>
<li><a href="#">ダミーリンク</a></li>
<li><a href="#">ダミーリンク</a></li>
</ul>
</div>

カスタムボタン

ノーマル

基本

[st-mybutton url="#" title="基本" rel="" fontawesome="" target="" color="#000000" bgcolor="#FFF" bgcolor_top="" bordercolor="#CCC" borderwidth="3" borderradius="0" fontsize="" fontweight="" width="100" fontawesome_after="" shadow="" ref=""]

詳しくはコチラ(オレンジ)

[st-mybutton url="#" title="詳しくはコチラ(オレンジ)" rel="" fontawesome="" target="" color="#fff" bgcolor="#FFD54F" bgcolor_top="#ffdb69" bordercolor="#FFEB3B" borderwidth="1" borderradius="5" fontsize="" fontweight="bold" width="" fontawesome_after="fa-angle-right" shadow="#FFB300" ref="on"]

詳しくはコチラ(レッド)

[st-mybutton url="#" title="詳しくはコチラ(レッド)" rel="" fontawesome="" target="_blank" color="#fff" bgcolor="#e53935" bgcolor_top="#f44336" bordercolor="#e57373" borderwidth="1" borderradius="5" fontsize="" fontweight="bold" width="" fontawesome_after="fa-angle-right" shadow="#c62828" ref="on"]

詳しくはコチラ(グリーン)

[st-mybutton url="#" title="詳しくはコチラ(グリーン)" rel="" fontawesome="" target="_blank" color="#fff" bgcolor="#43A047" bgcolor_top="#66BB6A" bordercolor="#81C784" borderwidth="1" borderradius="5" fontsize="" fontweight="bold" width="" fontawesome_after="fa-angle-right" shadow="#388E3C" ref="on"]

詳しくはコチラ(ブルー)

[st-mybutton url="#" title="詳しくはコチラ(ブルー)" rel="" fontawesome="" target="_blank" color="#fff" bgcolor="#039BE5" bgcolor_top="#29B6F6" bordercolor="#4FC3F7" borderwidth="1" borderradius="5" fontsize="" fontweight="bold" width="" fontawesome_after="fa-angle-right" shadow="#039BE5" ref="on"]

お問合せ

[st-mybutton url="#" title="お問合せ" rel="" fontawesome="fa-envelope" target="" color="#fff" bgcolor="#03A9F4" bgcolor_top="#14b4fc" bordercolor="#039BE5" borderwidth="1" borderradius="5" fontsize="" fontweight="" width="90" fontawesome_after="" shadow="#039BE5" ref="on"]

もっと詳しく(オレンジ)

[st-mybutton url="#" title="もっと詳しく(オレンジ)" rel="" fontawesome="" target="" color="#fff" bgcolor="#FFD54F" bgcolor_top="#ffdb69" bordercolor="#FFEB3B" borderwidth="1" borderradius="30" fontsize="85" fontweight="" width="90" fontawesome_after="fa-angle-right" shadow="" ref="on"]

もっと詳しく(ピンク)

[st-mybutton url="#" title="もっと詳しく(ピンク)" rel="" fontawesome="" target="" color="#fff" bgcolor="#F48FB1" bgcolor_top="#f6a6c1" bordercolor="#F48FB1" borderwidth="1" borderradius="30" fontsize="85" fontweight="" width="90" fontawesome_after="fa-angle-right" shadow="" ref="on"]

もっと詳しく(ブルー)

[st-mybutton url="#" title="もっと詳しく(ブルー)" rel="" fontawesome="" target="" color="#fff" bgcolor="#4FC3F7" bgcolor_top="#67cbf8" bordercolor="#4FC3F7" borderwidth="1" borderradius="30" fontsize="85" fontweight="" width="90" fontawesome_after="fa-angle-right" shadow="" ref="on"]

人気ランキング

[st-mybutton url="#" title="人気ランキング" rel="" fontawesome="st-svg-oukan" target="" color="#fff" bgcolor="#FBC02D" bgcolor_top="#fbc846" bordercolor="#FBC02D" borderwidth="1" borderradius="5" fontsize="110" fontweight="bold" width="90" fontawesome_after="" shadow="" ref="on"]

ランキングはコチラ

[st-mybutton url="#ranking" title="ランキングはコチラ" rel="" fontawesome="fa-angle-double-down" target="" color="#1a1a1a" bgcolor="#fdef4e" bgcolor_top="" bordercolor="#fceb1c" borderwidth="1" borderradius="" fontsize="95" fontweight="" width="" fontawesome_after="" shadow="" ref=""]

ショートコードガイド



[st-mybutton url="リンク先URL" title="ボタンテキスト" rel="nofollow" fontawesome="Webアイコン(前)" target="リンク先を新しく開く(blank)" color="文字色" bgcolor="背景色(下)" bgcolor_top="背景色(上)" bordercolor="枠線カラー" borderwidth="枠線の太さ(px)" borderradius="角丸(px)" fontsize="文字サイズ(%)" fontweight="文字の太さ(bold)" width="幅(%)" fontawesome_after="Webアイコン(後)" shadow="ボタンの影色" ref="光る演出(on)"]

ミニ

基本

[st-mybutton-mini url="#" title="基本" rel="" fontawesome="" target="" color="#000000" bgcolor="#f3f3f3" bgcolor_top="" borderradius="3" fontsize="" fontweight="" fontawesome_after="" shadow="#BDBDBD" ref=""]

詳しくはコチラ(オレンジ)

[st-mybutton-mini url="#" title="詳しくはコチラ(オレンジ)" rel="" fontawesome="" target="" color="#fff" bgcolor="#FFB74D" bgcolor_top="" borderradius="5" fontsize="" fontweight="" fontawesome_after="fa-angle-right" shadow="#FFB300" ref=""]

詳しくはコチラ(レッド)

[st-mybutton-mini url="#" title="詳しくはコチラ(レッド)" rel="" fontawesome="" target="_blank" color="#fff" bgcolor="#ef5350" bgcolor_top="" borderradius="5" fontsize="" fontweight="" fontawesome_after="fa-angle-right" shadow="#f44336" ref=""]

詳しくはコチラ(グリーン)

[st-mybutton-mini url="#" title="詳しくはコチラ(グリーン)" rel="" fontawesome="" target="_blank" color="#fff" bgcolor="#9CCC65" bgcolor_top="" borderradius="5" fontsize="" fontweight="" fontawesome_after="fa-angle-right" shadow="#8BC34A" ref=""]

詳しくはコチラ(ブルー)

[st-mybutton-mini url="#" title="詳しくはコチラ(ブルー)" rel="" fontawesome="" target="_blank" color="#fff" bgcolor="#4FC3F7" bgcolor_top="" borderradius="5" fontsize="" fontweight="" fontawesome_after="fa-angle-right" shadow="#03A9F4" ref=""]

MCボタン

太字のテキスト

今すぐ申し込む

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

[st-mcbutton url="#" title="今すぐ申し込む" rel="" fontawesome="" target="" color="#fff" bgcolor="#e53935" bgcolor_top="#f44336" bordercolor="#e57373" borderwidth="1" borderradius="5" fontweight="bold" fontsize="120" width="90" fontawesome_after="fa-chevron-right" shadow="#c62828" ref="on" mcbox_bg="#fafafa" mcbox_color="" mcbox_title="太字のテキスト"]※マイクロコピーを書いてみよう[/st-mcbutton]

会話ふきだし( r『半角スペース・小文字r』で反転)

INAZUMA
会話1

[st-kaiwa1]会話1[/st-kaiwa1]

会話2

[st-kaiwa2]会話2[/st-kaiwa2]

会話3

[st-kaiwa3]会話3[/st-kaiwa3]

会話4

[st-kaiwa4]会話4[/st-kaiwa4]

会話5

[st-kaiwa5]会話5[/st-kaiwa5]

会話6

[st-kaiwa6]会話6[/st-kaiwa6]

会話7

[st-kaiwa7]会話7[/st-kaiwa7]

会話8

[st-kaiwa8]会話8[/st-kaiwa8]

会話1
INAZUMA

[st-kaiwa1 r]会話1[/st-kaiwa1]

ランキング見出し一覧

[st-rank rankno="1" bgcolor="" color="#000" bordercolor="#ccc" radius="" star=""][/st-rank]

[st-rank rankno="2" bgcolor="" color="#000" bordercolor="#ccc" radius="" star=""][/st-rank]

[st-rank rankno="3" bgcolor="" color="#000" bordercolor="#ccc" radius="" star=""][/st-rank]

[st-rank rankno="4" bgcolor="" color="#000" bordercolor="#ccc" radius="" star=""][/st-rank]

ショートコードガイド



[st-rank rankno="ランキング(1~3又は空)" bgcolor="背景色" color="文字色" bordercolor="枠線カラー" radius="角丸(px)" star="スター(5,4,3,2,1)"]ここにテキスト[/st-rank]

レイアウト

PCとtab三分割

左側のコンテンツ33%

真ん中のコンテンツ33%

右側のコンテンツ33%

<div class="clearfix responbox33">
<div class="lbox">
<p>左側のコンテンツ33%</p>
</div>
<div class="lbox">
<p>真ん中のコンテンツ33%</p>
</div>
<div class="lbox">
<p>右側のコンテンツ33%</p>
</div>
</div>

PCとtab40%:60%

左側のコンテンツ40%

右側のコンテンツ60%

<div class="clearfix responbox">
<div class="lbox">
<p>左側のコンテンツ40%</p>
</div>
<div class="rbox">
<p>右側のコンテンツ60%</p>
</div>
</div>

PCとtab50%:50%

左側のコンテンツ50%

右側のコンテンツ50%

<div class="clearfix responbox50">
<div class="lbox">
<p>左側のコンテンツ50%</p>
</div>
<div class="rbox">
<p>右側のコンテンツ50%</p>
</div>
</div>

全サイズ30%:70%

左側のコンテンツ30%

右側のコンテンツ70%

<div class="clearfix responbox30 smart30">
<div class="lbox">
<p>左側のコンテンツ30%</p>
</div>
<div class="rbox">
<p>右側のコンテンツ70%</p>
</div>
</div>

全サイズ50%:50%

左側のコンテンツ50%

右側のコンテンツ50%

<div class="clearfix responbox50 smart50">
<div class="lbox">
<p>左側のコンテンツ50%</p>
</div>
<div class="rbox">
<p>右側のコンテンツ50%</p>
</div>
</div>

全サイズfree%

左側のコンテンツ%

右側のコンテンツ%

<div class="clearfix responboxfree smartfree">
<div class="lbox" style="width: 50%;">
<p>左側のコンテンツ%</p>
</div>
<div class="rbox" style="width: 50%;">
<p>右側のコンテンツ%</p>
</div>
</div>

均等並び

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

<div class="kintou">
<ul>
<li>横並びコンテンツ</li>
<li>横並びコンテンツ</li>
<li>横並びコンテンツ</li>
</ul>
</div>

マージン

[st-margin margin="0 0 20px 0"]]

[[/st-margin]

テーブル(シンプル)

テキスト

[st-table][st-tr][st-td]テキスト[/st-td][/st-tr][/st-table]

テーブル(属性あり)

テキスト

[st-table width="100" bordercolor=""][st-tr bgcolor="" color="" fontweight="" center=""][st-td width="" bordercolor="" bgcolor="" color="" fontweight="" center="" colspan=""]テキスト[/st-td][/st-tr][/st-table]

タブ(2つ)

タブ1のコンテンツ

タブ2のコンテンツ

[st-tab-content memo="全体を包むボックスです"][st-input-tab text="タブ1" bgcolor="#fff" color="#1a1a1a" fontweight="" width="45" value="1" checked="checked"][st-input-tab text="タブ2" bgcolor="#fff" color="#1a1a1a" fontweight="" width="45" value="2" checked=""][st-tab-main bgcolor="" bordercolor="" value="1"]

タブ1のコンテンツ
[/st-tab-main][st-tab-main bgcolor="" bordercolor="" value="2"]

タブ2のコンテンツ
[/st-tab-main][/st-tab-content]

タブ(3つ)

タブ1のコンテンツ

タブ2のコンテンツ

タブ3のコンテンツ

[st-tab-content memo="全体を包むボックスです"][st-input-tab text="タブ1" bgcolor="#fff" color="#1a1a1a" fontweight="" width="30" value="1" checked="checked"][st-input-tab text="タブ2" bgcolor="#fff" color="#1a1a1a" fontweight="" width="30" value="2" checked=""][st-input-tab text="タブ3" bgcolor="#fff" color="#1a1a1a" fontweight="" width="30" value="3" checked=""][st-tab-main bgcolor="" bordercolor="" value="1"]

タブ1のコンテンツ
[/st-tab-main][st-tab-main bgcolor="" bordercolor="" value="2"]

タブ2のコンテンツ
[/st-tab-main][st-tab-main bgcolor="" bordercolor="" value="3"]

タブ3のコンテンツ
[/st-tab-main][/st-tab-content]

ワイドデザインforEX


ワイド(1カラム・LP用)

[st-widecolumn bgcolor="" shadow="on"]]

ワイド(1カラム・LP用)

[[/st-widecolumn]


ワイドカラー(1カラム・LP用)

[st-widecolumn bgcolor="#fafafa" shadow="on"]]

ワイドカラー(1カラム・LP用)

[[/st-widecolumn]

ワイドアイキャッチ(左右影あり)

<div class="st-lp-wide-eyecatch">ワイドアイキャッチ(左右影あり)</div>

その他パーツ

スター

[star5]

[star45]

[star4]

[star35]

[star3]

[star2]

[star1]

年月(自動更新)

2019年10月

[st-date]

画像付きコメント

画像(60×60)

タイトル

◯代男性

[st-user-comment-box title="タイトル" user_text="◯代男性" color="" star="5"]画像(60×60)[/st-user-comment-box]

アドセンス

スポンサーリンク

[adsense]

オリジナルシュートコード

[originalsc]

youtube

[youtube id=]

三角(下矢印)

[st-under-t color="#000"]

目次(カスタム)

<div id="st_toc_container">
<p class="st_toc_title">目次</p>
<ol class="st_toc_list st-original-toc">
<li><a href="#">これはダミーです</a></li>
<li><a href="#">これはダミーです</a></li>
<li><a href="#">これはダミーです</a></li>
</ol>
</div>

目次(toc+)

toc(前後に[]を付けてください)

記事一覧

記事一覧

デザイン済みデータ

2019/04/12  

アフィンガーにはあらかじめデザインされたテンプレートがあり、無料で配布されています。 関連デザイン済みデータ配布サイト 私のおすすめはINAZUMAなんですが、使い方が分かり辛い。だいたいアフィンガー ...

検索システム『サプラス』に関する備忘録

2019/03/06  

サプラスのサーバー引越し サプラスの対応サーバーはエックスサーバーとさくらサーバーということになっていますが、テンプレートの変更などは出来ないですがロリポップでも動かす事は出来ます。 しかしPHPの7 ...

ワードプレスのサーバー引越しの際の備忘録

2019/03/06  

ワードプレスのサーバー引越しの際はまず、 PHPMyAdominでデータベースのデータをバックアップする ワードプレスのファイルを丸ごとダウンロードしてバックアップする 以上の手順となります。 バック ...

サイトにコードやソースを表示したいときの備忘録

2019/02/04  

Crayon Syntax Highlighterを使う HTMLやCSS・PHPなどの解説サイトで、よくソースやコード例をキレイに表示してくれているサイトがありますよね? このように表示するには、W ...

賢威のデザインパーツ・スタイルの備忘録

2019/02/03  

このサイトはWING(AFFINGER5)をテーマに使っており、デザイン済みデータのINAZUMAを適用しています。 わざわざ賢威のデザインパーツ・スタイルの備忘録の為にマルチテーマ化するのも面倒なの ...

アフィンガーの記事パーツの備忘録

2019/02/02  

私は長年サイト作成をしていますが、全て独学で必要な事だけ学んで来ましたので、詳しい事はプロの方ほど知りません。作業効率もプロの方には敵いません。 しかしこれでも数千のサイトを作ってきました。もちろんペ ...

[st-postgroup id="" rank="" slide="off" slides_to_show="3,3,2" slide_date="" slide_more="ReadMore" slide_center="off"]

カテゴリ一覧

デザイン済みデータ

アフィンガーにはあらかじめデザインされたテンプレートがあり、無料で配布されています。 関連デザイン済みデータ配布サイト 私のおすすめはINAZUMAなんですが、使い方が分かり辛い。だいたいアフィンガー ...

検索システム『サプラス』に関する備忘録

サプラスのサーバー引越し サプラスの対応サーバーはエックスサーバーとさくらサーバーということになっていますが、テンプレートの変更などは出来ないですがロリポップでも動かす事は出来ます。 しかしPHPの7 ...

ワードプレスのサーバー引越しの際の備忘録

ワードプレスのサーバー引越しの際はまず、 PHPMyAdominでデータベースのデータをバックアップする ワードプレスのファイルを丸ごとダウンロードしてバックアップする 以上の手順となります。 バック ...

サイトにコードやソースを表示したいときの備忘録

Crayon Syntax Highlighterを使う HTMLやCSS・PHPなどの解説サイトで、よくソースやコード例をキレイに表示してくれているサイトがありますよね? このように表示するには、W ...

賢威のデザインパーツ・スタイルの備忘録

このサイトはWING(AFFINGER5)をテーマに使っており、デザイン済みデータのINAZUMAを適用しています。 わざわざ賢威のデザインパーツ・スタイルの備忘録の為にマルチテーマ化するのも面倒なの ...

[st-catgroup cat="0" page="5" order="desc" orderby="id" child="on" slide="off" slides_to_show="3,3,2" slide_date="" slide_more="ReadMore" slide_center="off"]

カテゴリ一覧(スライドショー)

2019/4/12

デザイン済みデータ

アフィンガーにはあらかじめデザインされたテンプレートがあり、無料で配布されています。 関連デザイン済みデータ配布サイト 私のおすすめはINAZUMAなんですが、使い方が分かり辛い。だいたいアフィンガー自体が、購入サイトや公式サイト、マニュアルサイトなどありややこしいので、どこに何が書いてあるのか分かり辛い節があります。 導入方法も少し難解で、やり方はこちらに書かれています。 関連デザインサンプルDLページ(β)の使い方と注意事項 ここまで来ても、初めからあるヘッダー部分のリンクとか、コンテンツトップにある ...

ReadMore

2019/4/12

検索システム『サプラス』に関する備忘録

サプラスのサーバー引越し サプラスの対応サーバーはエックスサーバーとさくらサーバーということになっていますが、テンプレートの変更などは出来ないですがロリポップでも動かす事は出来ます。 しかしPHPの7以上のバージョンには対応していないので、アップデートされるのを待つしかありません。 今回ロリポップからエックスサーバーへの引越し。それ程難しくはありません。することは、 サプラスの本体のsearchフォルダをダウンロード サプラスのデータベースをバックアップ 以上を新しいサーバー(エックスサーバー)にアップす ...

ReadMore

2019/4/12

ワードプレスのサーバー引越しの際の備忘録

ワードプレスのサーバー引越しの際はまず、 PHPMyAdominでデータベースのデータをバックアップする ワードプレスのファイルを丸ごとダウンロードしてバックアップする 以上の手順となります。 バックアップする場合の注意点 ロリポップのライトプランだと、データベースは一つになるので複数ワードプレスを運用する時は、テーブル接頭辞を変えなければならない場合もあるので注意が必要です。 なのでロリポップのライトプランのデータベースをバックアップする際は、エクスポート方法を詳細にして、バックアップするデータのテーブ ...

ReadMore

2019/2/4

サイトにコードやソースを表示したいときの備忘録

Crayon Syntax Highlighterを使う HTMLやCSS・PHPなどの解説サイトで、よくソースやコード例をキレイに表示してくれているサイトがありますよね? このように表示するには、WordPressなら『Crayon Syntax Highlighter』というプラグインが便利です。プラグインから検索してダウンロードして有効化します。 そのままでは英語表示なので、日本語化したい方はFTPソフトで二つのファイルを削除してください。 削除するファイル crayon-syntax-highli ...

ReadMore

2019/2/4

賢威のデザインパーツ・スタイルの備忘録

このサイトはWING(AFFINGER5)をテーマに使っており、デザイン済みデータのINAZUMAを適用しています。 わざわざ賢威のデザインパーツ・スタイルの備忘録の為にマルチテーマ化するのも面倒なので、このページだけ賢威(8.0)が適用されるように設定しました。 賢威は発売当初のHTML手打ちのテンプレ(もう相当昔ですよね・・・)から持っていたのですが、使いにくかったので殆ど使っていませんでした。 ほどなくしてSIRIUSが販売されましたので、かなり多いドメインのFTPなどの管理や検索でサイトを探せるな ...

ReadMore

[st-catgroup cat="0" page="5" order="desc" orderby="id" child="on" slide="on" slides_to_show="3,3,1" slide_date="" slide_more="ReadMore" slide_center="on"]

タグ一覧

デザイン済みデータ

アフィンガーにはあらかじめデザインされたテンプレートがあり、無料で配布されています。 関連デザイン済みデータ配布サイト 私のおすすめはINAZUMAなんですが、使い方が分かり辛い。だいたいアフィンガー ...

検索システム『サプラス』に関する備忘録

サプラスのサーバー引越し サプラスの対応サーバーはエックスサーバーとさくらサーバーということになっていますが、テンプレートの変更などは出来ないですがロリポップでも動かす事は出来ます。 しかしPHPの7 ...

ワードプレスのサーバー引越しの際の備忘録

ワードプレスのサーバー引越しの際はまず、 PHPMyAdominでデータベースのデータをバックアップする ワードプレスのファイルを丸ごとダウンロードしてバックアップする 以上の手順となります。 バック ...

サイトにコードやソースを表示したいときの備忘録

Crayon Syntax Highlighterを使う HTMLやCSS・PHPなどの解説サイトで、よくソースやコード例をキレイに表示してくれているサイトがありますよね? このように表示するには、W ...

賢威のデザインパーツ・スタイルの備忘録

このサイトはWING(AFFINGER5)をテーマに使っており、デザイン済みデータのINAZUMAを適用しています。 わざわざ賢威のデザインパーツ・スタイルの備忘録の為にマルチテーマ化するのも面倒なの ...

[st-taggroup tag="0" page="5" order="desc" orderby="id" slide="off" slides_to_show="3,3,2" slide_date="" slide_more="ReadMore" slide_center="off"]

タグ一覧(スライドショー)

2019/4/12

デザイン済みデータ

アフィンガーにはあらかじめデザインされたテンプレートがあり、無料で配布されています。 関連デザイン済みデータ配布サイト 私のおすすめはINAZUMAなんですが、使い方が分かり辛い。だいたいアフィンガー自体が、購入サイトや公式サイト、マニュアルサイトなどありややこしいので、どこに何が書いてあるのか分かり辛い節があります。 導入方法も少し難解で、やり方はこちらに書かれています。 関連デザインサンプルDLページ(β)の使い方と注意事項 ここまで来ても、初めからあるヘッダー部分のリンクとか、コンテンツトップにある ...

ReadMore

2019/4/12

検索システム『サプラス』に関する備忘録

サプラスのサーバー引越し サプラスの対応サーバーはエックスサーバーとさくらサーバーということになっていますが、テンプレートの変更などは出来ないですがロリポップでも動かす事は出来ます。 しかしPHPの7以上のバージョンには対応していないので、アップデートされるのを待つしかありません。 今回ロリポップからエックスサーバーへの引越し。それ程難しくはありません。することは、 サプラスの本体のsearchフォルダをダウンロード サプラスのデータベースをバックアップ 以上を新しいサーバー(エックスサーバー)にアップす ...

ReadMore

2019/4/12

ワードプレスのサーバー引越しの際の備忘録

ワードプレスのサーバー引越しの際はまず、 PHPMyAdominでデータベースのデータをバックアップする ワードプレスのファイルを丸ごとダウンロードしてバックアップする 以上の手順となります。 バックアップする場合の注意点 ロリポップのライトプランだと、データベースは一つになるので複数ワードプレスを運用する時は、テーブル接頭辞を変えなければならない場合もあるので注意が必要です。 なのでロリポップのライトプランのデータベースをバックアップする際は、エクスポート方法を詳細にして、バックアップするデータのテーブ ...

ReadMore

2019/2/4

サイトにコードやソースを表示したいときの備忘録

Crayon Syntax Highlighterを使う HTMLやCSS・PHPなどの解説サイトで、よくソースやコード例をキレイに表示してくれているサイトがありますよね? このように表示するには、WordPressなら『Crayon Syntax Highlighter』というプラグインが便利です。プラグインから検索してダウンロードして有効化します。 そのままでは英語表示なので、日本語化したい方はFTPソフトで二つのファイルを削除してください。 削除するファイル crayon-syntax-highli ...

ReadMore

2019/2/4

賢威のデザインパーツ・スタイルの備忘録

このサイトはWING(AFFINGER5)をテーマに使っており、デザイン済みデータのINAZUMAを適用しています。 わざわざ賢威のデザインパーツ・スタイルの備忘録の為にマルチテーマ化するのも面倒なので、このページだけ賢威(8.0)が適用されるように設定しました。 賢威は発売当初のHTML手打ちのテンプレ(もう相当昔ですよね・・・)から持っていたのですが、使いにくかったので殆ど使っていませんでした。 ほどなくしてSIRIUSが販売されましたので、かなり多いドメインのFTPなどの管理や検索でサイトを探せるな ...

ReadMore

[st-taggroup tag="0" page="5" order="desc" orderby="id" slide="on" slides_to_show="3,3,1" slide_date="" slide_more="ReadMore" slide_center="on"]

スライドショー画像のみ(※クラス)

<div class="st-slider-img"> </div>

おすすめ記事一覧

RECOMMEND

[st-osusume]

条件表示

コメントアウト

[st-out]コメントアウト[/st-out]

PC閲覧時のみ表示

PC閲覧時のみ表示

[pc]PC閲覧時のみ表示[/pc]

PC閲覧時のみ非表示

[nopc]PC閲覧時のみ非表示[/nopc]

AMPページのみ表示

[st-amp]AMPページのみ表示[/st-amp]

AMPページのみ非表示

AMPページのみ非表示

[st-no-amp]AMPページのみ非表示[/st-no-amp]

フロントページのみ表示

[frontonly]フロントページのみ表示[/frontonly]

フロントページのみ非表示

フロントページのみ非表示

[no-frontonly]フロントページのみ非表示[/no-frontonly]

指定したカテゴリIDのみ非表示

指定したカテゴリIDのみ非表示

[catonly cat="0"]指定したカテゴリIDのみ非表示[/catonly]

ショートコード補助

Webアイコン(クラス)

左側のアイコンのclass名です。

fa-file-text-o

fa-check-circle

st-svg-checkbox

fa-exclamation-circle

fa-question-circle

fa-search

fa-search-plus

fa-chevron-right

fa-chevron-down

fa-angle-double-right

fa-angle-double-down

fa-heart

fa-user

fa-comments

fa-lightbulb-o

fa-bullhorn

fa-envelope

fa-code

fa-gift

fa-diamond

fa-download

fa-twitter

fa-facebook-square

fa-youtube-play

fa-amazon

st-svg-oukan

st-svg-bigginer_l

見出し一覧

これはh2タグの見出しです

これはh3タグの見出しです

これはh4タグの見出しです

これはh5タグの見出しです

抜粋

これは抜粋のダミーです

スクロールテーブル

ダミーのテキスト ダミーのテキスト ダミーのテキスト ダミーのテキスト
ダミーのテキスト ダミーのテキスト ダミーのテキスト ダミーのテキスト
これはh5タグの見出しです

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

これはh5タグの見出しです

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

これはh4タグの見出しです

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

これはh5タグの見出しです

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

これはh5タグの見出しです

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

これはh2タグの見出しです

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

これはh3タグの見出しです

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

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

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

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

  1. これはダミーのテキストです
  2. これはダミーのテキストです
  3. これはダミーのテキストです

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

これはh3タグの見出しです

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

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

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

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

  1. これはダミーのテキストです
  2. これはダミーのテキストです
  3. これはダミーのテキストです

これはh4タグに「カウント」を設定しています

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

これはh4タグに「カウント」を設定しています

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

これはh4タグに「カウント」を設定しています

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

これは「まとめ用」の見出しです

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

RECOMMEND

-アフィンガー

Copyright© 零細企業社長の調査による本物の情報があるサイト , 2019 All Rights Reserved.