vanillaice (Akira)

vanillaice (Akira)

grungew.jpg


名称 GrungeFlower_respW
GrungeFlower_respB
カラム数 1
プラグイン対応 ○(サイドバー集約型)
レスポンシブ対応
サイドバー 左横からスライド
記事幅 可変 最大1000px(内寸 940px)
サイドバー幅 デバイス幅依存 最大350px(内寸 310px)
任意個人設定 レスポンシブ利用 = スマホ版非表示設定
SNSシェアボタン利用 = メタタグ設定
その他 FC2検索バー非表示推奨
Browser SupportIn principle, current and previous version

Chrome

Firefox

Safari

Opera

Edge

IE11

License
Required 必須事項
・Designer Note and Backlink 製作者表記と当ブログへのリンク (Designed by)
Permitted 許可事項
・Modification 改変
・Personal Use 個人利用
・Commercial Use 商用利用
Forbidden 禁止事項
・Distribution 再配布
・Hold Liable 使用にあたっての損害・損失に対する責の一切を負いません
推奨カスタム 背景変更 メインカラム横幅変更


valid-html5.png


更新履歴 2017.1.25


・ SNSシェアリンクのUTF-8エンコード

参考記事
SNSシェアリンクのエンコード


--------- 以下本文



更新履歴 2016.10.11


不具合修正
・ Windows10 IE11及びMicrosoft Edgeのスクロールバグに対処
・ 主要公式プラグインの整形
・ 関連記事サムネイルの整形
・ ベンダープレフィックスの整理
・その他微調整

Windows10でスクロールした際に背景画像がガクガクと震えるバグを再度hackしました
根本的な修正はMicrosoftの対応待ちです
ご迷惑をおかけします よろしくお願いします


更新履歴 2016.1.8


フッター構造を変更しました
タイトルタグを微調整しました(SEO対策)


--------- 以下本文



2015.11.23 申請致しました


アドベンチャータイムのDVD宣伝がいろいろヤバい (´・ω・`)

ぐらんじふらわー れすぷ (だぶりゅ, びー) (*'-'*)ン

過去作品のレスポンシブ版であり 色違いです
今回はレスポンシブですのでおそろいスマホ版リリースの予定はありません
過去のピンクとイエローから切り替えされます際には 記事末尾掲載のCSSファイルをご利用ください


TOP PAGE DEMO
ARTICLE DEMO
respB(ブルー背景)
DOWNLOAD

respW(ホワイト背景)
DOWNLOAD

FAQ



以前のシリーズからの変更点を含めた仕様
・サイドバーをCSSからJqueryに変更しました
・右上のナビゲーションの動作を改善しました(押しやすくなりました)
・その他細かいデザイン上の変更
・カスタマイズ指南はCtrl+Fキー検索 注) で出てきますので
カスタマイズ前に一度目を通して頂けると助かります


お受けできないご質問・ご相談(申し訳ございません 自己責任・自己努力でお願いします)
・サイドバーの形状変更(スライド→下へ流す)
・レスポンシブを固定幅化
・カラム数やサイドバー位置変更


ブラウザサポートについて


IE10以下はサポート外としてありますが 理由としてはWindows10 IE及びEdgeに於ける固定背景のバグをJSで制御しています
基本的には最新とそのひとつ前までのバージョンをサポート という形にしておりますので
Edgeを最新としてIE11が一つ前のバージョン という捉え方でお願いしますー (´・ω・`)
IE9までバグの面倒をみようと思うと正しい表示ができるブラウザでは不要コードですのであまりよろしくないかと思います
Windows10 OSにアップグレードしていない場合にはIE9までOKですが....


サイドバーについて


以前のものはCSSでの折りたたみを実装していましたが今回Jqueryに変更しました
open/ closeのボタンを固定しましたので ページのどこに居てもすぐに開けるようになりました
スマホでの動作もCSSよりスムーズかと思います
そしてAndroid OSを持つ Xperia(ソニー製)の機種固有バグへの対処でもあります

サイドバープラグインへの横幅指定はpxではなく%でお願いします
タブレットやスマホではデバイス幅によってサイドバーの幅が変化します
大きい画面では最大350px以上にはなりませんが 比較的小さめのiPhone5あたりに注意
サイドバーの外側をタップしても閉じることができますので
その為の余白確保を優先しています


記事幅変更について


シングルカラムですので簡単に変更できます
対応箇所は以下を目印に(Ctrl+Fキー検索)

/* 注)記事の最大横幅指定 */


個別記事のページ送りについて


記事内容のすぐ下にある左右矢印では「カテゴリ内移動」になっています
一方ページ下の方は「時系列での移動」です
遷移先が異なると困る という方はいずれか一方と内容を揃えてください
(わかりにくければお尋ねください)
一応記事下矢印の方はtitle属性によるツールチップで「カテゴリ移動」であることを表示するようになってます

239r8r4l.jpg



旧作から特に目立つ変更はありません
そして遅くなりましてすみませんです (_ _;)
やるやると言いながらなかなか... こう... 意欲が ( ̄∀ ̄;)
背景色変えてようやくやる気出したみたいな感じ ^^;




ご質問 不備・不具合のご報告はお気軽にどうぞ
その際には
・ ご自身のブログアドレスの明記
・ 該当テンプレートを設定状態に
・ 右クリック禁止の解除
上記3点を必ずお守りください
お守り頂けない場合にはお答え致しませんので 自己解決でお願いします


いつもありがとうございます ∩(・ω・)∩


旧作から移行される方用CSSファイル
(新作を公式からDL後 CSSソース差し替え)
2017.1.25 最新版 この日付以前にDLされました方はお手数ですが公式より再DLの上CSS差し替えをお願い致します

ピンク
file

イエロー
file



---------- 追記 2015.11.28


訪問者コメントと管理人コメントを分ける方


CSSソース末尾にそれぞれ以下を追加

respB (ブルー)

.管理人ハンドルネーム {
  background: url(//blog-imgs-83.fc2.com/v/a/n/vanillaice000/flower30_32we.png) left center no-repeat;
}

デフォルト(訪問者) 全パターン共通
sample

管理人
sample

respW (ペイルピンク), respP (ピンク)

.管理人ハンドルネーム {
  background: url(//blog-imgs-83.fc2.com/v/a/n/vanillaice000/flower30_32wee.png) left center no-repeat;
}

管理人


respY (イエロー)

.管理人ハンドルネーム {
  background: url(//blog-imgs-83.fc2.com/v/a/n/vanillaice000/flower30_32y.png) left center no-repeat;
}

管理人
sample

管理人ハンドルネーム の部分を普段コメント欄でお使いの文字列に書き換えてください
裏ワザ的なCSSでの実装ですのでご利用頂けない場合もあります
使用不可のハンネパターンは以下の通り(一例です)

・文字列最初の文字が「記号」
・最初の文字が「数字」
・文字列中に「-」(ハイフン)「_」(アンダースコア)以外の記号(半角スペース, 全角スペース含む)


関連記事

Comments 2

There are no comments yet.
-  
管理人のみ閲覧できます

このコメントは管理人のみ閲覧できます

2015/11/27 (Fri) 14:19 | EDIT | REPLY |   
Akira  
To BeHappyスライドの件 内緒さん

ありがとうございます

こちら別テンプレートのページですので、お手数ですがこちらクリックで移動お願いします。
http://vanillaice000.blog.fc2.com/blog-entry-241.html

2015/11/27 (Fri) 21:53 | EDIT | REPLY |   

Leave a reply

テンプレートに関するご質問・不具合のご報告の際はご自身のブログアドレス記載必須です
ご質問の前に必ずお読みください ↓
FC2テンプレート ご利用時のお願い