困ったときのStrawMan Template総合案内板

この記事は、漫画ホームページ制作サービスStrawMan Templateの案内板ライクなリンク集になります。



このテンプレ気になるんだけどどんな感じなん？
ここをカスタマイズしたいんだけど調べ方がわかんない。


そんなときは、下記のもくじを御活用ください。

漫画特化型テンプレート『StrawMan Template』について

テンプレートの紹介など、導入を迷う方向けのプレゼン記事へのリンク集

StrawMan Templateの紹介

エモーショナルな視点での紹介

無料で始めるweb漫画サイトを作る方法


技術的視点での紹介

Web漫画作家さん向けFC2テンプレート「straw_man」を作りました

---

StrawMan Templateと亜種の配布

漫画ビューワー付きFC2テンプレート『StrawMan Template』と亜種の配布

---

StrawMan Templateの機能の紹介

エモーショナルな視点での機能紹介

漫画特化型テンプレートStrawMan Templateの機能の紹介


技術的視点での機能紹介

組み込み機能詳細

---

見本サイト

サンプルサイト
StrawMan Template sample

カスタマイズを施したサンプルサイト
ヤマノス

---

SEO対策

StrawMan TemplateのSEO対策の解説

SEO対策など

---

仕様一覧

StrawMan Templateの技術的仕様

他仕様一覧

---

テンプレートの開発者たちと権利

開発者と権利者について

スタッフクレジット

---

StrawMan Templateの導入（チュートリアル１）

FC2との契約からテンプレートの有効化までの解説

FC2ブログとの契約

FC2との契約のチュートリアル

FC2との契約

---

StrawMan Templateのダウンロード

テンプレートのダウンロード方法

StrawMan Templateのダウンロード

---

FC2側でStrawMan Templateを有効にする初期設定

テンプレートを有効化する手順

StrawMan Templateの初期設定

---

FC2の地雷機能をOFFにする

使いにくい？それいる？
そういうレベルではありません、使うだけで機能不全を起こすアルバム機能。

地雷機能アルバムの無効化

---

SSL化でセキュリティを強化する

これからの主流はSSLで間違いなし。
とにもかくにもSSL化してしまおう！

SSL（https）を有効にする

---

テンプレート導入初期のカスタマイズ（チュートリアル２）

導入後、最低限必要なカスタマイズ方法のリンクです。

straw_manテンプレート初期導入設定解説記事

TOP画像の差し替え

・サイト上部の画像の差し替え方

1: ヘッダー画像差し替え


・TOP画像に推奨される画像サイズ

1.2: ヘッダー画像の推奨画像サイズリスト

---

カスタムテーマの設定

・カスタムテーマの設定方法

2: スマホ版カスタムテーマ画像差し替え


・カスタムテーマに推奨される画像サイズ

2.1: カスタムテーマ背景画像の推奨サイズ


・ライト・ダークテーマ２種のカスタムテーマ設定

2.2: ライトテーマとダークテーマで違うカスタムテーマ背景画像を指定する


・メニューにかかるフィルターの設定

2.3: 初期状態で適用されている各種マスクについて

2.4: ダークテーマ時のグレイスケールフィルタ解除


・その他カスタムテーマのカスタマイズ

2.5: その他カスタムテーマ機能カスタマイズ

---

グローバルナビゲーション（メニュー）の設定

・メニュー項目の設定方法

3: グローバルナビゲーション部位の差し替え

3.1: 単一リンクの記述方法

3.2: 入れ子項目の記述方法

3.3: グローバルナビゲーションについての注意点1
3.3: グローバルナビゲーションについての注意点2

---

各種カスタマイズ

StrawMan Templateのカスタマイズのリンクです。
カスタマイズしたい個所の名称がわからない場合は画像から探すカスタマイズを参照ください。

見た目のカスタマイズ

各カラー、区切り線、文字、表示幅などの外観に関するカスタマイズ。
背景色の変更（暫定版）

見出し・目次・ジャンプ機能で見た目を整える。
StrawMan Templateで大事な記事の見た目を整える方法

サイドバーの見た目を変える（タイトル/区切り線/余白）
サイドバーのプチカスタマイズ（暫定版）

コメントアイコンを変える
straw_manテンプレートコメントアバター設定解説記事

レイアウトを着せ替えする
straw_manテンプレート見た目変更ペルソナ導入解説記事

ファビコンを設置する
StrawMan Templateでファビコンを設置する方法

記事の行間と本文記事概要の表示行数の調整
StrawMan Templateで文字のレイアウトを整える方法

機能のカスタマイズ

記事編集リンクを追加する
StrawMan Templateの個別記事に記事編集リンクを追加する方法

---

画像から探すカスタマイズ

ここをこう変えたい！
ここだよここ、えーとなんて言えばいいんだろう？？？

そんなときは案内画像を御活用ください。

PCホームの案内画像

①
1: ヘッダー画像差し替え
1.2: ヘッダー画像の推奨画像サイズリスト

②
3: グローバルナビゲーション部位の差し替え
3.1: 単一リンクの記述方法

③
3.2: 入れ子項目の記述方法
3.3: グローバルナビゲーションについての注意点1
3.3: グローバルナビゲーションについての注意点2
アニメーションジャンプの設定

④
タイトル文字のサイズ変更

⑤
StrawMan Templateで文字のレイアウトを整える方法

⑥
背景色の変更（暫定版）

⑦
右カラムの設定
広告の設定
サイドバー、タイトル/区切り線/余白のカスタマイズ（暫定版）

⑧
プロフィールの設定


⑨
本文の表示幅・右カラムの表示幅・本文カラム区切り幅の変更
straw_manテンプレート見た目変更ペルソナ導入解説記事

---

スマホ/タブレットホームの案内画像

①
1: ヘッダー画像差し替え
1.2: ヘッダー画像の推奨画像サイズリスト

②
3: グローバルナビゲーション部位の差し替え
3.1: 単一リンクの記述方法

③
3.2: 入れ子項目の記述方法
3.3: グローバルナビゲーションについての注意点1
3.3: グローバルナビゲーションについての注意点2
アニメーションジャンプの設定

④
タイトル文字のサイズ変更

⑤
StrawMan Templateで文字のレイアウトを整える方法

⑥
背景色の変更（暫定版）
straw_manテンプレート見た目変更ペルソナ導入解説記事

---

カスタムテーマの案内画像

①
ボーダーライン・アイコン・文字カラーの変更

②
2: スマホ版カスタムテーマ画像差し替え
2.1: カスタムテーマ背景画像の推奨サイズ
2.2: ライトテーマとダークテーマで違うカスタムテーマ背景画像を指定する

③
2.3: 初期状態で適用されている各種マスクについて
2.4: ダークテーマ時のグレイスケールフィルタ解除
カスタムテーマ内のカラーフィルターの変更

---

記事内の案内画像

①
StrawMan Templateで文字のレイアウトを整える方法
StrawMan Templateで大事な記事の見た目を整える方法

②
SNSの追加と変更

③
StrawMan Templateの個別記事に記事編集リンクを追加する方法

④
タグの設定


⑤
FC2ランキングへの登録


⑥
straw_manテンプレートコメントアバター設定解説記事

---

各機能の使い方

StrawMan Templateに搭載された、各機能の使い方と設定の解説です。

漫画ビューワーlaymic

見開き表示・縦横ページ送り・ページ進捗バー・サムネイルなど、マンガを公開するうえで最上を目指した高機能ビューワーです。
ビューワーの習熟度による各種設定が可能なため、読者の閲覧スタイルに応じたカスタマイズにも対応しています。

さらに、SNSより直接ビューワーの起動が可能なためSNSで最高の状態での漫画公開も可能です。


html/cssが編集可能なサービスで利用できるlaymicスクリプトが公開されました。

https://t.co/8PXiANFZHX

laymic最新版をgithubに上げました。これでもうstraw_man以外のサイトでも使える状態なのですが、導入説明が不親切気味なので、ここについてはまた記事を書こうと思っています。

— リラ (@dettalant) January 13, 2020

dettalant/laymic

Contribute to dettalant/laymic development by creating an account on GitHub.

github.com

laymicビューワーの汎用サイト向け導入説明記事

straw_man以外のサイトに対して、laymicビューワーを導入するための説明をしていきます。

yamanosu.com

laymicスクリプトの詳細は製作者にお願いします。



主な機能
・全画面表示
・横読み縦読みの変更
・サムネイルによる全ページ表示とジャンプ機能
・カスタムサムネイル画像の設定
・ページ進捗バーによる残ページ表示
・SNSからのビューワー起動
・作者が想定した見せ方を初期設定に固定
・ビューワー内のガイドアイコンのON/OFF
・左始まり・右始まりの変更
・横セリフ・英訳に対応した右ページ送り
・各種設定の統合設定
・HTMLの使用可
・告知ページの追加
・ズーム機能
※ピンチ操作と拡大機能はv2.0からの対応になります。
※laymicビューワーは時機を見てオープンソース化しますので、FC2以外のhtml/cssが編集可能なサービスでもご利用いただけます。（2020/01/13 v2にて対応しました）

確認されている不具合について
2020/01/13：laymic_v2にて修正いたしました
・ビューワーのラストページが単ページの場合、一つ前のページと原稿が重複する。
→工数の関係からｖ2.0での対応とさせてください。

・暫定的な対応策
最後が単ページになった場合は、白紙画像（たとえば2life9999.pngという白紙画像）や透過pngを挿入し見開きにすることで対応願います。
（単行本のページ調整に白紙ページをはさむ要領）

解説とサンプルはコチラ
漫画ビューワーlaymic

使い方はコチラ
基本的な使用方法

webマンガビューワーlaymic完全攻略ガイド

---

ライトボックス

ページを移動せず、画像を１～複数枚拡大表示する機能です。

主な機能
・画像の拡大表示
・複数枚画像のスライド表示
・画像へのテキスト追加
・サムネイル画像への装飾によるライトボックスリンクの提示


1: 基本的な使用方法

2: ヤマノスで使っているライトボックス装飾カスタマイズコード

2.1: ライトボックス装飾コード適用時のhtmlコード書き方

---

ギャラリー

画面の表示幅に合わせ、自動で整列する画像の一覧機能です。

主な機能
・画像の自動揃え
・透明ボックスによるサムネイル崩れの防止
・テキストの併記
・画像のみのタイトなパネル表示

ギャラリーの表示見本

3: アートギャラリー用カスタマイズコード

3.3: ギャラリー用HTMLコードテンプレート

---

アニメーションジャンプ

アニメーションを使い、ページ内を移動する機能です。

straw_manテンプレートスムーススクロール機能設定解説記事

---

ペルソナ

ペルソナ機能とは、StrawMan Templateの見た目を変える着せ替え機能です。
cssへの追記でレイアウトを変えるため、テンプレートを変更せずにご利用いただけます。


ペルソナ：super_flatサンプルサイト

ヤマノス

マンガ投稿サイトの解説・アマ作家向けのマネタイズと発信支援・漫画特化型テンプレートstraw_manと漫画ビューワーlaymicのサポート。土着信仰/神道/民俗学をベースにした秋田県推しweb漫画『神様セカンドライフ』の発信基地。

yamanosu.com

多摩ノ巣

東京は三多摩地域に住む人の徒然日記。

tamanosu.fc2.net

雲梨恋愛漫画

恋愛漫画を公開してますここを拠点にきゅんきゅんからドロドロまで配信中！

cumori.jp

straw_manテンプレート見た目変更ペルソナ導入解説記事

---

オススメ外部機能

漫画公開にオススメな外部サービスの紹介と導入方法へのリンク集。

googleアナリティクス

googleアナリティクスの契約から導入まで

---

Search Console

Search Consoleの契約から導入まで

---

Push7

プッシュ通知送信サービス『Push7』

---

サイト運営の豆知識

サイト作りからサイト運営まで、見落としがちなヒント集。

使ってはいけないFC2の地雷機能

使いにくい？それいる？
そういうレベルではありません、使うだけで機能不全を起こすアルバム機能。

地雷機能アルバムの無効化

---

レスポンシブとサイドバーの関係

PC/タブレット/スマホ。
表示幅で変わるレイアウトと変動するサイドバーについての豆知識。

レスポンシブデザインとサイドバーの位置

---

サイドバープラグインのまとめ方

サイドバーを整理する方法の豆知識。

サイドバープラグインのまとめ方

---

サイト運営と広告の関係

StrawMan Templateの広告設置ガイドと広告の考え方。

サイト運営と広告の関係

---

作家のためのサイト集客術

読者を集め充実した創作ライフを！

ファンと作家のためのサイト集客術

---

大事な記事の見た目を整える

コピペで完成、見た目を整え読者とgoogleに猛烈アピール！

StrawMan Templateで大事な記事の見た目を整える方法

---

ファビコンでオリジナリティを出す

小さなおしゃれで目立たせる

StrawMan Templateでファビコンを設置する方法

---

記事編集リンクを追加する

気付いたときに即編集！

・StrawMan Templateの個別記事に記事編集リンクを追加する方法

---

文字でデザインを引き締める

サイトに合わせた余白デザイン

・StrawMan Templateで文字のレイアウトを整える方法

---

引用ルールを守りドメインを強くする

慣れれば簡単引用ルール、ドメイン強化で一歩リード

・正しい著作物の引用とリンク設定でドメインパワーを上げる方法

関連記事
・あまねさーん！google検索から人を引っ張れー！！

---

ファンコミュニティを作る

ファンと一緒に創作活動

・ファンコミュニティを作り創作を長続きさせる方法

---

記事一覧

ディレクターの記事

・困ったときのStrawMan Template総合案内板
・無料で始めるweb漫画サイトを作る方法
・漫画特化テンプレートStrawMan Templateの機能の紹介
・[StrawMan Template]FC2ブログの契約と初期設定ガイド
・StrawMan Templateの各種機能の表示見本
・[FC2ブログ対応] オススメ外部機能の紹介と実装方法
・FC2ブログとstraw_manの運用に役立つヒント集
・StrawMan Templateで大事な記事の見た目を整える方法
・StrawMan Templateの簡易コード置き場
・StrawMan Templateでファビコンを設置する方法
・漫画ビューワーlaymicのアップデートとスクリプト版配信のお知らせ
・StrawMan Templateの個別記事に記事編集リンクを追加する方法
・webマンガビューワーlaymic完全攻略ガイド
・StrawMan Templateで文字のレイアウトを整える方法
・あまねさーん！google検索から人を引っ張れー！！
・正しい著作物の引用とリンク設定でドメインパワーを上げる方法
・ファンコミュニティを作り創作を長続きさせる方法
・StrawMan Templateとlaymic解説記事の移植とビターな話

エンジニアの記事

・Web漫画作家さん向けFC2テンプレート「straw_man」を作りました
・straw_manテンプレート初期導入設定解説記事
・straw_manテンプレートライトボックス関連設定解説記事
・straw_manテンプレートスムーススクロール機能設定解説記事
・straw_manテンプレートコメントアバター設定解説記事
・straw_manテンプレート見た目変更ペルソナ導入解説記事
・straw_manテンプレートlaymicビューワー関連設定解説記事
・straw_manテンプレートでの修正済み不具合一覧記事
・laymicスクリプト配布ページ
・laymicビューワーの汎用サイト向け導入説明記事
・straw_manテンプレートlazyload設定解説記事

他のサイトの記事

・ブログつくり日記　1　２　３　 ４　５
・straw_manテンプレート友の会
・漫画ブログ作ろ！

---

関連記事

• 漫画ビューワー付きFC2テンプレート『StrawMan Template』と亜種の配布
• [StrawMan Template] FC2ブログの契約と初期設定ガイド
• 困ったときのStrawMan Template総合案内板
• laymicビューワーの汎用サイト向け導入説明記事
• straw_manテンプレートでの修正済み不具合一覧記事