箱の中の猫

@xoxo_humpheryのブログです

構築記事テンプレート

構築記事について見やすいという言葉を頂くことが多かったので,最後に遺産として記事のテンプレートを残すことにしました.

使用に際しては無許可で大丈夫ですので,気兼ねなくご利用ください.

htmlコードを記載しています.

PCからの編集で「HTML編集」で下のhtmlコードを張り付けてご使用ください.

このような赤字の部分を変えればそのまま記事にできるようなつくりです.

筆者は,このhtmlを載せたものを下書き記事にして,「記事をコピーする」で使って手間が省いています.

以下htmlコードとなります.

 


<p>S〇〇での使用構築です.</p>
<p>全部は読まなくてもいいやという方は<a href="#f">6.要旨・総括</a>をご覧下さい.</p>
<p><a name="h"></a>                                                                                               </p>
<p><span style="font-size: 150%;">目次</span>(項目・アイコンをクリックすると各記載箇所にとべます。)</p>
<p><a href="#a">1.構築経緯と概要</a></p>
<p><a href="#b">2.個別詳細</a>ー<a href="#u"><アイコンのURL①,img clas~~~p:plain" /みたいなやつをこの赤字の部分を消して入れてください></a><a href="#v"><アイコン②></a><a href="#w"><アイコン③></a><a href="#x"><アイコン④></a><a href="#y"><アイコン⑤></a><a href="#z"><アイコン⑥></a></p>
<p><a href="#c">3.選出パターン・運用</a></p>
<p><a href="#d">4.重いポケモン・構築</a></p>
<p><a href="#e">5.あとがたり</a></p>
<p><a href="#f">6.要旨・総括</a></p>
<p><a href="#g">7.参考文献</a></p>
<p><a name="a"></a> </p>
<p><span style="font-size: 150%;">1.構築経緯と概要</span></p>

最初に構築の全体を一覧の形で載せます.

f:id:NateArchibald:20180802163734p:plain

自分はこんな感じの表にしたりしてますが,テキストでも十分だと思います.
次に個々の採用経緯と理由を書いています.

最初に全体像を見た方がその後読む内容が頭に入りやすい,構築の全体を見たいだけの方,全体を見ただけで理解できる方もいるので,最初に構築の内容を見せるのはお勧めです.
<p><a name="b"></a></p>
<p><span style="font-size: 150%;">2.型、選出・勝率</span></p>
<p><a name="u"></a>  
<p>2.1.一匹目@持ち物</p>
<section><!-- h2 要素はここから -->
<h2 class="h2-sticky"><筆者はここに横に長いカードを入れています.,このstickyというのは,スクロールしたときに上に残るアレです.cssという後述の簡単ですが少し特殊な設定がいります.不要な場合は次の</h2>というものの次にぽけふぁんさんの個体概要などを入れてください></h2>

f:id:NateArchibald:20180802150709p:plain

こんなのをExcelでつくっています.


ここに

・技の採用理由

・調整意図

・使用感

を書いています.

以下では6匹分の繰り返しです.
<!-- ここまで fixed する --></section>
<p><a name="v"></a></p>
<p>2.2.2匹目@持ち物</span></p>
<section><!-- h2 要素はここから -->
<h2 class="h2-sticky"><2匹目のカード></h2>
解説
<!-- ここまで fixed する --></section>
<p><a name="w"></a> </p>
<p>2.3.3匹目@持ち物</p>
<section><!-- h2 要素はここから -->
<h2 class="h2-sticky"><3匹目のカード></h2>
解説
<!-- ここまで fixed する --></section>
<p><a name="x"></a>  </p>
<p>2.4.4匹目@持ち物</span></p>
<section><!-- h2 要素はここから -->
<h2 class="h2-sticky"><4匹目カード></h2>

解説
<!-- ここまで fixed する --></section>
<p><a name="y">
<p>2.5.5匹目@持ち物</p>
<section><!-- h2 要素はここから -->
<h2 class="h2-sticky"><5匹目カード></h2>
解説
<!-- ここまで fixed する --></section>
<p><a name="z"></a> </p>
<p>2.6.6匹目@持ち物</p>
<section><!-- h2 要素はここから -->
<h2 class="h2-sticky"><6匹目カード></h2>
解説
<!-- ここまで fixed する --></section>
<p><a name="c"></a></p>
<p><span style="font-size: 150%;">3.選出パターン・運用</span></p>
<p>〇選出パターン</p>
選出パターンを書いています.

どういう選出でそういう相手に出していたかを書いています.
<p><a name="d"></a>  </p>
<p><span style="font-size: 150%;">4.重いポケモン、構築、KP等のデータ</span>
<p>1.重いポケモン</p>
重い理由を書いています
<p><a name="e"></a>   </p>
<p><span style="font-size: 150%;">5.あとがたり</span></p>
構築全体の使った感想などを書いています.
<p><a name="f"></a> </p>
<p><span style="font-size: 150%;">6.要旨</span>(常体)</p>
<p><コンセプト></p>
<p><構築経緯></p>
<p> <運用></p>
<p><span style="font-size: 150%;">7.参考文献</span></p>
<p>1.著者の名前(USUMS7みたいな書かれた時期):<リンクURL>参考にした記事のタイトル</a>,どこを参考にしたか</p>

 

 

以上が記事のテンプレートになります.

以下先述しましたcssの設定について記載します.

 「デザイン」を押します.

f:id:NateArchibald:20180921004055p:plain

このスパナのマークをおします.

f:id:NateArchibald:20180921004115p:plain

 

f:id:NateArchibald:20180921004133p:plain

デザインcssという箇所に以下のコードを記入します.

 

 .h2-sticky {
position: -webkit-sticky; /* Safari */
position: sticky;
top: 0;

}

 

最後に,次の「詳細設定」のなかの「レスポンシブデザイン」にチェックします.

f:id:NateArchibald:20180921004150p:plain

このcssは先述のstickyというやつを有効にするもので,不要な方はいれなくて大丈夫です.

レスポンシブデザインというのはこの設定をスマホで有効にするためのものです.

 

以上がテンプレートになります.

趣味でいろいろ埋め込んで設定してあるので,よければ使ってみて頂ければ幸いです.