モヤシっ子改造計画

共有テンプレ更新情報です。

2014.08.11.Mon.06:03
共有テンプレート

  • meisai_01

  • waterdrop_Ver_1

を更新しました。

共に同じ機能を追加してあります。

一つは、タイトルエリアの右の部分を使えるようにしました。
ヘッダーエリア

このゾーンはプラグインカテゴリ3になります。

二つめは、
左カラム（プラグインカテゴリ1）及び
右カラム（プラグインカテゴリ2）の
一番最後のプラグインがフローティングメニューとなるようにしました。

フローティングメニューというのは、
スクロール時に見切れずにくっ付いてくるバナーとか、ああいうのです。


なお、くっ付いてくるのは初期状態では一番下のプラグインですが、
javascriptコードの簡単な修正で任意のプラグインに変更できます。

左カラムを例に変更方法を説明すると、、
テンプレートのHTMLコードの<head>タグ内に以下のような記述があります。

/******************** 左カラム制御 ********************/
$.event.add(window, "load", function(){ 
  offset = $("#sidebar_left .sidemenu:nth-last-of-type(1)").offset();
    $(window).scroll(function () {
      if($(window).scrollTop() > offset.top) {
        $("#sidebar_left .sidemenu:nth-last-of-type(1)").css({"position":"fixed","top":"0px","width":"215px","padding":"8px 8px 20px 8px","background":"none repeat scroll 0 0 rgba(255, 255, 255, 0.97)","border-radius":"0 0 10px 10px","box-sizing":"border-box"});
        $("#sidebar_left .sidebar_inner").css("padding","0");
        $("#sidebar_left").css("width","215px");
      } else {
        $("#sidebar_left .sidemenu:nth-last-of-type(1)").css({"position":"static","padding":"0px","width":"auto","background":"none","box-sizing":"content-box"});
        $("#sidebar_left .sidebar_inner").css("padding","8px");
        $("#sidebar_left").css("width","199px");
      }
    });
});
/******************** ここまで左カラム制御 ********************/


この中の$("#sidebar_left .sidemenu:nth-last-of-type(1)")という部分
3箇所ありますが、この :nth-last-of-type(1) とあるのが下から一番目という意味です。
例えば :nth-last-of-type(3) とすると、下から3番目のプラグインが
左カラムが見切れる際、フローティングメニューとなりくっついてきます。

記述は3箇所あります。一番最初のものは :nth-last-of-type(1)のままで、2箇所目と3箇所目を変更してください

これだけです。


三つめは、記事エリアからの画像のはみ出し防止です。
記事エリアからはみ出すサイズの画像は自動でリサイズします。

※大変不手際ながら waterdrop_Ver_1の 8/11修正版ではこの機能がうまく効いていませんでした。
8/15修正版として再度申請したものではしっかり動いていますので、8/11修正版を既に落とされた方や
このテンプレにご興味を持っていただいた方は8/15修正版が反映されましたら、そちらをダウンロードして下さい。
スポンサーサイト



Category： FC2ブログテンプレ | Comments(2) | Trackback(0)

共有テンプレ総ダウンロード数が1,000件超え

2014.08.10.Sun.01:35
まぁものすごく時間掛かったんですが（笑）
初めて承認されたのが2013年1月だったので、1年半掛かりました。

人気のあるテンプレなんかは、一ヶ月で単体で1000ダウンロード超えてますからね

でもこれからも作っていきます。
HTMLコーディングは好きなので（実はデザインはあんまり）

フォトショップ・イラレなどのDTPソフトもかなり使えるし、
コーディングも得意なんですが、デザインができないので
片手落ちとよく言われてました・・・




今後の目標は単体で1000ダウンロード超えです。

今のところ予定しているのは
・meisai_01とwaterdrop_Ver_1の微修正と、新機能実装
・迷彩の別バージョン
・2カラムのテンプレ

という感じです。
2カラムのテンプレは作ったことがないため、流用なしの更からのコーディングになるので出すまでに時間掛かりそうな雰囲気です
Category： FC2ブログテンプレ | Comments(0) | Trackback(0)

共有テンプレ追加しました。

2014.06.23.Mon.06:41
今回追加したのは

  • waterdrop_Ver_1

  • meisai_01


この二種類です。

━━━━━ waterdrop_Ver_1 ━━━━━━━━━━━━━━
先に公開したwaterdrop_Ver_0の派生で
記事エリアがウィンドウサイズに合わせて可変するようになっています。
あと、細かい点で言えばリンクの下線を非表示にしました。

waterdropはもう一つ派生を考えています。


━━━━━ meisai_01 ━━━━━━━━━━━━━━━━━
その名の通り、迷彩柄背景のテンプレートです。
シームレスの迷彩パターンの作成がテーマでした。
需要があれば、他パターンの迷彩(アーバン・デザート等)も作成しようと考えてたのですが
う～ん、どうだろう(笑)

meisai_01で使用した背景はご自由に使用していただいて構いません。
迷彩背景

ブログテンプレートに使う素材は、基本的に自作で
著作権は放棄しませんが、私用・商用に関わらず自由に使っていただいて構わないと考えています。


これまで、作りたいと思うものテンプレを作ってきましたが
あと一つ二つ同じノリで作った後は
ダウンロードの多いテンプレートを参考にして
自分との違いを発見していきたいと思っています。

やっぱり人気のあるテンプレートはデザインの良さと見易さを備えていて、
参考にすることで自分のUIデザインに足らないものを発見できるんじゃないかと思っています。
Category： FC2ブログテンプレ | Comments(0) | Trackback(0)

共有テンプレを更新しました。

2014.05.17.Sat.10:12
共有テンプレート waterdrop_Ver_0を更新しました。

スクロールしたときの背景のチラつきが気になっていたので、その部分を修正。
背景を固定にしようかとも考えましたが、それでは面白くないと思い
パララックスというものを取り入れました。

パララックスというのは、スクロール量の数値を使って何らかの処理を行うもので
コレを利用してスクロールと背景画像の動きに差をつけました。

javascript コード（jQueryの読み込みが必要）

$(function(){
　$(window).scroll(function(){
　　var y = $(this).scrollTop();
　　var value = "0 " + Math.round(-(y / 4.5)) + "px";
　　 $("body").css("background-position", value);
　});
});

スクロール量÷4.5 の量、背景画像を動かしています。

パララックスについては以下のサイトで非常に分かりやすく解説されています。
http://webdrawer.net/javascript/parallax.html

ちなみに、このテンプレートの派生をあと2種類考えていて
それらはVer_0 の更新ではなく Ver_1、Ver_2として出します。
Category： FC2ブログテンプレ | Comments(0) | Trackback(0)

ブログテンプレ

2014.03.08.Sat.01:05
久しぶりにブログテンプレの共有申請をしたんですが、不承認でした。
理由は外部に置いているjsファイルを参照しているためとの事。

jsファイルはfc2ホームページに置いておくようにしてたんですが、
上述のように外部にjsファイルを置くのはダメになったようです。

jsファイルはブログメニューのファイルアップロードでアップし
それを参照する形にして再申請しました。
Category： FC2ブログテンプレ | Comments(0) | Trackback(0)
 | HOME | Next »