キャラ紹介（メカリギ）

◇◇　サブキャラ　◇◇

メカリギ　（職業：シューティングスター）　Lv60
　　　　～ 一人だけの軍隊 ～




ＤＮがβ版から本稼働して、初めての追加キャラクターって事で私もご多分に漏れずアカデミックを作ってみました。　初見の感想は「まぁ、カワイイ♪ｗ＾＾」でも、こんな幼女がモンスター相手に。。。。＾＾；　私が予告で一番目を引いたのは召喚兵！　ロボットが戦ってくれるなんて、ほぼ反則！素敵だわ♪ｗｗｗ　ただ、ロボの名前を自分で付けれなかったのが残念。（名付け親になれなかった。；；）

転職の選択肢が途中で増えるなんて、想像もしてなかった私はアルフ中心のスキル取りに。ｗｗｗ（わかっててもそうしたと思いますが、アルケミ系の破壊力は異常！＞＜）

で、実際やってみたら、他キャラで一度は通った道だけど強い！強い！ｗｗｗ　マスターソロ楽勝でグングンレベルが上がる。ｗ　レベルが上がって砲台含め召喚兵４機、まさに「一人だけの軍隊」。　デミ自身には飛び抜けた高火力スキルは無かったけど、Lv45でスプラッシュ取得したら、まぁ強烈な事！ｗｗｗ＾＾　ソサさんにエクセレかけてもらったら砲台だらけにするのが楽しみです♪ｗ＾＾

ただ、今の所この子は、数値的に火力がイマイチ。。。ＨＰは何故か凄くあるんですが。ｗ　物攻値は低いんですが、実際に戦闘に出たらほとんどそれを感じない凄さはあります。＾＾

この子を使っていると、何故か異常位置バグが良く出るのでＳＳ撮ってネタになる事が多いです。ｗ




実は、今のギルドにもメインのスマより先にこの子が入っていて、中にはどっちがメインだか解ってない人もいるかも。。。ｗｗｗ（私じゃあるまいしそんな人いないかな。ｗ＾＾；）

最近、やっとレアアバに身を包むことができ、メインと同格に扱っているキャラです。＾＾

---

あとまだ未カンストキャラがいくつかいますが、それはまたの機会に。ｗ
とりあえずキャラ紹介はここまでです。＾＾





ドラゴンネストランキング ←ドラネス関連の人気ブログが見れるよ！良かったら押してね♪

キャラ紹介（ノコロギ）

◇◇　メインキャラ　２　◇◇

ノコロギ　（職業：テンペスト）　Lv60
　　　～寂寥（せきりょう）たる雑技団～




最初にソサを作りキャデラックに入った頃、キャラによって始まる村が違うことを知り作ったのがこの娘です。ｗ　当時、オンゲと言えばチョコットランドしかやったことがなかった私には、サーバーの違いが解らず、何だろう？せっかくだから違うサバーに作ってみよ！って事でソサとは別のサーバーに作りました。

どうしてもセカンドキャラだったので、やる時間はメインに比べて少ないし、こっちはギルドにも入っていなければ、知り合いもいない。

ただ、アチャは可愛いのでｗイベとかの時に一気上げする感じで伸ばして来ると、やってて楽しくなってくるんよね。ｗｗｗ（打たれ弱いけど、動きは早いし手数で勝負っぽい所は楽しいｗ＾＾）

こちらはブログ繋がりがきっかけでギルドに入っていますが、バル鯖とは違って学生さんが多くてなかな時間があわなくて、ギルドに入っているもののほぼソロ状態。ｗｗｗ＾＾；
でも、たまに一緒になると手伝ってもらったり、一緒に遊んだりします。
ギルドでGD行ける程のパワーも人数もないので（個人ではGDに行ってる人はいるけどｗ）YD討伐目指すぞ！的な感じはありませんが、発展途上感が何かいいかな。ｗ＾＾

バル鯖のみんちゃはお師匠様。でもサーバーが違うので一緒にやることもできないし、追いつくどころか足元にも及ばない。ｗ　でも、テンペに関して疑問があれば真っ先に相談。＾＾

野良でGD行く勇気もないし、、、、誰かネル鯖でこの子をGDに連れて行って♪ｗ＾＾ｖ



ドラゴンネストランキング ←ドラネス関連の人気ブログが見れるよ！良かったら押してね♪

キャラ紹介（ノコリギ）

私の使っている主要キャラの紹介をしていきたいと思います♪＾＾

◇◇　メインキャラ　◇◇

ノコリギ　（職業：スマッシャー）　Lv60
　　　　　　～漂泊の破壊神～



ドラネスをはじめて最初に作ったキャラで今でも現役です。ｗ＾＾
ドラネスを始める前は、チョコットランドをずっとやっていたんですが、β版の頃に友達に誘われてやってみたのが始まりです。　誘ってくれた友達はアチャでプレリーから始まるので、ブログには綺麗な山や可愛い3Dのキャラが写っていて「私もやろ♪」ってなりました。　で、キャラを選ぶのに良く解らなかったので、チョコットランドでもメインキャラにしていた魔法使い（ソサ）が良いかなと思ってソサを選びました。

ゲームが始まって思ったのは「・・・暗い。。。」ｗ　おまけに雪が積もってって寒そう！＞＜
友達のブログにはあんなに明るくて可愛いキャラが楽しそうに・・・って思ったのに。。。
あ！でもレベ上げしていけば、あんな風になるんだ！と思いつつゲームを進めて行きました。

ソサのお師匠さんはS嬢のように冷たくてヒステリック。。。＾＾；　Lvが上がってきてようやく
キャデラックに行けるようになり、友達と合流して「違うんだ！」と気づきました。ｗｗｗ

そんな調子なので、もちろん武器の種類、冠詞、強化、紋章なんかの知識は皆無。ｗｗｗ
（まだLv30がﾚﾍﾞﾙｷｬｯﾌﾟだった頃だと思います。ｗ）
ただ友達と一緒に、ダンジョンに行ってワーワーチャットしてただけだったと思います。＾＾
（もちろんギルドなんて入ってないし、ましてや作ってもいません。）

一緒にやっていた友達も徐々に飽きてきてINしなくなりました。　でも、私は訳も分からないまま
1日１ダンジョンを続けていていました。（もちろん野良PTなんて入れません。ノーマルクリアのみ。）

一人じゃやっぱりキツイなぁ、、、って思っていたそんなある日、キャデラックでナンパされてｗｗｗ
初めてギルドと言うのに入りました。ｗ＾＾

そこで潜在コードや強化、冠詞、その他にも色々教わりましたが、物覚えの悪い＆PS低い私は
みんながﾚﾍﾞﾙｷｬｯﾌﾟに到達しているのになかなか追いつけない。。。
Lv40解放されて少ししてやっとLv30到達、皆よりも数か月遅れでLv40到達と亀レベルの遅さで
レベ上げしていきました。ｗ＾＾；

そんな中、当時のギルドにセイント（回復して戦える職）がいない、、、このままではギルドで
ネストに行けない等の理由から、大き目のギルドに吸収してもらおうという話が上がりました。

毎夜毎夜、どうするかってﾐｰﾃｨﾝｸﾞをして、幾つかギルドをピックアップして体験させてもらって
決めようと言う事になりました。　もちろん、その時に皆とは行かずに完全離脱する人もいました。

私もこの機会に、ブログで知り合ったなっちさんやみんちゃのギルドに引き取ってもらおうかなとか
思いましたが、何のご縁か、キャデラックで佇んでいる私を拾ってくれて、親切に色々と教えてもらい
少しは情がわいたのか、「この人がやめるまで付き合う！」と決めて付いて行く事にしました。
（この時、なっちさんには相談にのってもらい感謝しています。＞＜）

で、現在のギルドにいるわけなんですが、その時、私らを引き連れて移住したリダさんは早々に
ギルドを抜けちゃったのは内緒です。ｗｗｗ

人よりもかなり歩みは遅いですが、それが私のペース。ｗｗｗ
これからもマイペースで行きたいと思います。＾＾ｖ



ドラゴンネストランキング ←ドラネス関連の人気ブログが見れるよ！良かったら押してね♪

「テンプレートのカスタマイズ」 ～その４（最終回）～

「テンプレートのカスタマイズ」 ～その４（最終回）～

【配置や大きさを変えてみよう♪】

っという事で、ダラダラと今回が最終回ですがｗ、私もちょっと飽きてきたので（をぃ！ｗ＾＾；
これもかなり大雑把に見て行きたいと思います。ｗ

これも、スタイルシート編集で行えるので、直接数値を変えてみて、下のプレビューで
どんな風に変化したか直接確認してもいいかもしれません。＾＾
但し、バックアップも取って、これで決定と言う時以外は絶対に「更新」は押さないで下さい。
注）実際に変更する際は必ず複製を作るか、テキストにバックアップしてから行って下さい。

スタイルシートの中身を見て行きましょう♪＾＾
（/* Layoutと/* Headerの中だけですが。ｗ）

（上の方は端折ってます。）

/* Layout
------------------------------------------------------------ */

#wrapper {
width: 950px;
margin:0px auto;
text-align: center;
}

#container {
width: 100%;
margin-left: auto;
margin-right: auto;
text-align: center;
padding:0px;
background-image:url(http://blog-imgs-42.fc2.com/t/e/m/templates/dragonnest_bg.jpg);
background-position:center 800px;
background-position-y: 800px;
}

#header {
width: 100%;
overflow: hidden;
padding:0px;
background-image:url(http://blog-imgs-42.fc2.com/t/e/m/templates/dragonnest_header_bg.jpg);
background-position:center;
background-repeat:no-repeat;
height:800px; ←ヘッダー部自身の縦幅
margin-top:-10px;
position:relative;
}
#header_inner {
width:950px;　←ヘッダー部のブログタイトルの横幅
margin:0px auto;
}

#main {
float: right;　←ブログ本文の左右位置（right,left,center)
width: 660px !important;
width /* for IE5.5 */: 680px;
padding: 0px 0px 20px 0px;
overflow: hidden;
margin-top:-400px;　←ブログ本文の開始位置（高さ）
position:relative;
}

#sidemenu {
float: left; ←サイドメニューの左右位置、但し、ブログ本文の左右位置に影響（right,left,center)
width: 270px;　　　　　　　　　　　　
padding-bottom: 20px;
margin-top:-400px; ←サイドメニューの開始位置（高さ）
position:relative;
overflow:hidden;
}

#footer {
clear: both;
padding: 10px 0px;
width: 100%;
font-size: 85% !important; /* for Modern browser */
font-size: 90%; /* for IE6 */
}



/* Header
------------------------------------------------------------ */
.btn {
float:right;　←「いますぐPLAY」ボタンの左右位置(right,left,center)
margin:10px 20px 135px 0px;
}
#header h1 {
text-align: center; ←ブログタイトルの左右位置(right,left,center)
padding-bottom: 5px;
clear:both;
}
#header h1 a:link {
color:#FFF;
text-decoration:none;
}
#header h1 a:visited {
color:#FFF;
}

（ここから下も端折ってます。）


元の状態はこれです。



数値を変えるとこんな感じや

上にスペースが出来ましたね。


こんな感じになります。

デミの頭が切れちゃった！＞＜

---

これを使うと、例えばヘッダー部にもっと縦幅の短い画像を使ったり、
サイドメニューとブログ本文の位置を入れ替えたりすることもできます。＾＾

どう変化するかは、実際に数値を入れ替えてみてプレビューで見るのが
一番わかりやすいかなと思います。＾＾
（とりあえず、やっつけだけど何とかまとめれたか？？ｗ＾＾；）

---

さて、次回からはまともにドラネスブログかコマ漫画を載せようと
思います。ｗｗｗ＾＾；（あくまで予定は未定よ！ｗ）



ドラゴンネストランキング ←ドラネス関連の人気ブログが見れるよ！良かったら押してね♪

「テンプレートのカスタマイズ」 ～その３～

「テンプレートのカスタマイズ」 ～その３～

【画像ファイルのアップロード】

差し替えたい画像ファイルが用意できたところで、設定ファイルを触って行こうかと思いますが、
その前に、作ったファイルをアップロードしておきましょう。＾＾

「管理画面」の左のメニューの中、一番上の「ホーム」グループの中に「ファイルアップロード」が
あるので、これをポチッと押すとファイルのアップロード画面が出るので差し替える画像を
アップロードしておきましょう。　正常にアップロードできると下に表示されます。＾＾

ファイル情報の欄には、ファイル名、容量（サイズ）、日付、ファイルが置いてあるURL、が表示
されています。「ファイルが置いてあるURL」は、後で設定ファイルを書き換える際に必要になるので
別のメモ帳か何かにコピーしておくと便利でしょう。＾＾


【設定ファイルの修正】

いよいよ設定ファイルの修正を始めましょう♪＾＾
画面左のメニューの中の設定グループの中に「テンプレートの設定」があるのでこれをポチッと♪

テンプレートの設定画面をゆっくり降りて行くと（下にスクロールさせていくと）、、、、

「PCテンプレート [dragonnest_2column] 適用中」（カッコの中は現在適用しているテンプレ名）
というのがあると思います。　そのすぐ下辺りに「適用」、「テンプレート名/プレビュー」、
「ﾌﾟﾗｸﾞｲﾝ対応」、「HTML CSS」、「複製」、「削除」という項目の表があると思いますが、
その表の中の「dragonnest_2column」の複製を作成し、その複製されたテンプレート名の左側の
ラジオボタンにチェックして「適用」を押してください。　適用されましたら「HTML CSS」の編集を
クリックしましょう。

画面を更に下がっていくと、「～のHTML編集」・・・そしてテキストボックスの中にわけの分からない
アルファベットがずらずら・・・、そしてその下に「～のスタイルシート編集」・・・そしてまたもや
テキストボックスの中にわけの分からないアルファベットがずらずら・・・ってあると思います。

今回は、「～のスタイルシート編集」の下のテキストボックスの中を修正していきます。＾＾
アルファベットだらけだけど、触る所は少しだけなので恐れる事はありません！ｗｗｗ

テキストボックスの中を直接修正していってもいいんですが、とっても見にくいのでメモ帳にコピー
して大きくして見ましょう。＾＾

まずは、「スタート」-「すべてのプログラム」-「アクセサリ」の中から「メモ帳」を開きましょう。
FC2の画面に戻って「スタイルシート編集」の下のテキストボックスの中をどこでも良いのでｸﾘｯｸして
キーボードで「Ctrl+A」（全選択のｼｮｰﾄｶｯﾄ）を押して下さい。　テキストボックスの中の文字が全て
青反転していると思います。この状態で「Ctrl+C」(コピー)でコピーして、メモ帳の中をどこかｸﾘｯｸ
して「Ctrl+V」（貼り付け）メモ帳に貼り付けてください。

メモ帳の中は、訳の分からないアルファベットだらけになったと思います。ｗｗｗ


※豆知識※
これがCSS（Cascading Style Sheets）といって、HTMLやXHTMLなどで作成されるウェブページ
のレイアウトや文字の色や形、大きさ、画像の表示範囲、画像のあり場所等々、まさしくスタイリ
ストみたいな役割をするファイルです。

メモ帳に貼り付けたのは、「広くて見易い」ってのもあるんですが、メモ帳には検索機能、
置換機能があるので、場所を探したり、置換をするのに便利です。＾＾

では、さっそくコピってきたメモ帳の中身を見て行きましょう♪＾＾
ざぁーと眺めてみると、↓のように色んなセクションが点線で区切られていることが解ります。

/* Reset　←これがセクション名ね＾＾
-------------------------------------------- */

とか

/* Image　←これもセクション名ね＾＾
-------------------------------------------- */

とか

/* Layout　←こんな風なやつね＾＾
-------------------------------------------- */

とか

/* Header　←点線の上に書いてあるのね＾＾
-------------------------------------------- */

こんな風な感じに点線で区切られて、その下に各々の設定が書かれています。

では、早速書き換えて行きましょう！
※注意※　一言一句間違えないように書き換えて下さい。　極力、手で入力するのは避けて
　コピー＆ペーストで書き換えるとミスは減ります。（但し、正確にコピペね。ｗ＾＾）

◆◆　全体背景　◆◆


「/* Layout」の中に「#container」って項目があると思います。その中の

background-image:url(http://blog-imgs-42.fc2.com/t/e/m/templates/dragonnest_bg.jpg);

これの、「http://blog-imgs-42.fc2.com/t/e/m/templates/dragonnest_bg.jpg」の部分を

ファイルアップロードの「ファイルが置いてあるURL」をコピーして書き換えましょう


こんな感じで、アップロードしたファイルのURLを置き換えて行きます。


◆◆　ヘッダー部の背景　◆◆



「/* Layout」の中の「#header」って項目の中の

background-image:url(http://blog-imgs-42.fc2.com/t/e/m/templates/dragonnest_header_bg.jpg);の

「http://blog-imgs-42.fc2.com/t/e/m/templates/dragonnest_header_bg.jpg」の部分。


◆◆　ブログ本文がある場所の背景　◆◆
ここは、上部、真ん中、下部の３つがあります。　それから、コメントやトラックバックも同じ物を
使っているので、そこも修正します。

　◇◇　上部　◇◇



①「/* Main Contents」の中の「h2.entry_header」の中の

　background-image:url(http://blog-imgs-42.fc2.com/t/e/m/templates/dragonnest_entry_top.png);の

　「http://blog-imgs-42.fc2.com/t/e/m/templates/dragonnest_entry_top.png」の部分。

②「* Comment, Trackback, Entry list」の中の「.sub_header」の中の

　background-image:url(http://blog-imgs-42.fc2.com/t/e/m/templates/dragonnest_entry_top.png);の

　「http://blog-imgs-42.fc2.com/t/e/m/templates/dragonnest_entry_top.png」の部分。


　◇◇　真ん中　◇◇



①「/* Main Contents」の中の「.entry_body」の中の

　background-image:url(http://blog-imgs-42.fc2.com/t/e/m/templates/dragonnest_entry_body.png);の

　「http://blog-imgs-42.fc2.com/t/e/m/templates/dragonnest_entry_body.png」の部分。


②「* Comment, Trackback, Entry list」の中の「.list_body」の中の

　background-image:url(http://blog-imgs-42.fc2.com/t/e/m/templates/dragonnest_entry_body.png);の

　「http://blog-imgs-42.fc2.com/t/e/m/templates/dragonnest_entry_body.png」の部分。


　◇◇　真ん中(body2)連結用　◇◇



①「* Comment, Trackback, Entry list」の中の「.sub_title」の中の

　background-image:url(http://blog-imgs-42.fc2.com/t/e/m/templates/dragonnest_entry_body2.png);の

　「http://blog-imgs-42.fc2.com/t/e/m/templates/dragonnest_entry_body2.png」の部分。

②「* Comment, Trackback, Entry list」の中の「.sub_body」の中の

　background-image:url(http://blog-imgs-42.fc2.com/t/e/m/templates/dragonnest_entry_body2.png);の

　「http://blog-imgs-42.fc2.com/t/e/m/templates/dragonnest_entry_body2.png」の部分。

③「* Comment, Trackback, Entry list」の中の「.sub_footer」の中の

　background-image:url(http://blog-imgs-42.fc2.com/t/e/m/templates/dragonnest_entry_body2.png);の

　「http://blog-imgs-42.fc2.com/t/e/m/templates/dragonnest_entry_body2.png」の部分。

④「* Comment, Trackback, Entry list」の中の「.form」の中の

　background-image:url(http://blog-imgs-42.fc2.com/t/e/m/templates/dragonnest_entry_body2.png);

　「http://blog-imgs-42.fc2.com/t/e/m/templates/dragonnest_entry_body2.png」の部分。


◇◇　下部　◇◇



①「/* Main Contents」の中の「.entry_footer」の中の

　background-image:url(http://blog-imgs-42.fc2.com/t/e/m/templates/dragonnest_entry_bottom.png);の

　「http://blog-imgs-42.fc2.com/t/e/m/templates/dragonnest_entry_bottom.png」の部分。

②「* Comment, Trackback, Entry list」の中の「.list_foote」の中の

　background-image:url(http://blog-imgs-42.fc2.com/t/e/m/templates/dragonnest_entry_bottom.png);の

　「http://blog-imgs-42.fc2.com/t/e/m/templates/dragonnest_entry_bottom.png」


◆◆　サイドメニュー　◆◆
ここも、上部、真ん中、下部の３つがあります。

　◇◇　サイドメニュー上部　◇◇



　「/* Sidemenu (Plugin)」の中の「.sidemenu_body .plg_title」の中の

　background-image:url(http://blog-imgs-42.fc2.com/t/e/m/templates/dragonnest_side_content_top.png);の

　「http://blog-imgs-42.fc2.com/t/e/m/templates/dragonnest_side_content_top.png」の部分。

　◇◇　サイドメニュー真ん中　◇◇



①「/* Sidemenu (Plugin)」の中の「.sidemenu_body .plg_header」の中の

　background-image:url(http://blog-imgs-42.fc2.com/t/e/m/templates/dragonnest_side_content_body.png);の

　「http://blog-imgs-42.fc2.com/t/e/m/templates/dragonnest_side_content_body.png」の部分。

②「/* Sidemenu (Plugin)」の中の「.sidemenu_body .plg_body」の中の

　background-image:url(http://blog-imgs-42.fc2.com/t/e/m/templates/dragonnest_side_content_body.png);の

　「http://blog-imgs-42.fc2.com/t/e/m/templates/dragonnest_side_content_body.png」の部分。

③「/* Sidemenu (Plugin)」の中の「.sidemenu_body .plg_footer」の中の

　background-image:url(http://blog-imgs-42.fc2.com/t/e/m/templates/dragonnest_side_content_body.png);の

　「http://blog-imgs-42.fc2.com/t/e/m/templates/dragonnest_side_content_body.png」の部分。

　◇◇　サイドメニュー下部　◇◇



　「/* Sidemenu (Plugin)」の中の「.sidemenu_body .side_bottom」の中の

　background-image:url(http://blog-imgs-60.fc2.com/n/o/k/nokorigi/side_content_bottom.png);の

　「http://blog-imgs-60.fc2.com/n/o/k/nokorigi/side_content_bottom.png」の部分。


◆◆　ページトップへボタン　◆◆



「/* Main Contents」の中の「.pagetop a」の中の

background-image:url(http://blog-imgs-42.fc2.com/t/e/m/templates/dragonnest_top_btn.jpg);の

「http://blog-imgs-42.fc2.com/t/e/m/templates/dragonnest_top_btn.jpg」の部分。

---

ずらずらと書きましたが、メモ帳の「置換」機能を使って、一気に置き換えてもOKです。＾＾

①ここまで書き換えたら、メモ帳の中で「Ctrl+A」（全選択）→「Ctrl+C」（コピー）します。
②テンプレートの管理画面で、書き換えるテンプレート名の横の「編集」という文字をクリック。
③スタイルシート編集の下のテキストボックスの中をどこでも良いのでクリック。
④「Ctrl+A」（全選択）→「Ctrl+V」（貼り付け）　で全文書き換えます。
⑤テキストボックスの下に「プレビュー」ボタンがあるので、これをクリックして表示させてチェックして下さい。
⑥チェックしてOKなら「更新」ボタンを押して保存完了です。

---

これで、大まかには完成ですが、次回はオマケで「位置変更」を少し書いてみます。



ドラゴンネストランキング ←ドラネス関連の人気ブログが見れるよ！良かったら押してね♪

「テンプレートのカスタマイズ」 ～その２～

「テンプレートのカスタマイズ」 ～その２～

【背景画像を用意しよう♪】

「用意する背景」
・ヘッダー部の背景
・全体背景
・ブログ本文がある場所の背景
・サイドメニューの背景
・ページトップへボタン

背景画像を用意するのに注意する点が幾つかあります。
・画像サイズ（容量、縦横の大きさ）
・画像ファイルの種類
・色合い等

◇画像サイズ◇
各部の背景には、１枚の画像や複数の画像を組み合わせて１枚の画像にしている物があります。
容量は、「ファイルのアップロード」の制限で500kbまでとなっています。

▼△ ヘッダー部 ▼△

テンプレート[dragonnest_2column]のヘッダー部の画像は

http://blog-imgs-42.fc2.com/t/e/m/templates/dragonnest_header_bg.jpg

にあります。　画像のサイズ（横×縦）は

1800(pix)×798(pix)　と、かなり大きいです。

ここまで大きくなくてもよいと思うんですが、ヘッダー部の横幅が小さすぎると全体背景の
中に浮かんでいるようになってしまうので、それを避けるために大きなサイズになっていると
思います。　試しに画面表示を30%位にしてみるとこんな感じです。




▼△ 全体背景 ▼△

テンプレート[dragonnest_2column]の全体背景の画像は

http://blog-imgs-42.fc2.com/t/e/m/templates/dragonnest_bg.jpg

にあります。　画像のサイズ（横×縦）は

1800(pix)×1584(pix)と、これもかなり大きいです。

ただこの背景画像は、（縦横）サイズが小さかったら繰り返しでタイル状に表示されるので、
模様やベタな色だけなら小さめの画像で十分かと思います。

※背景画像は壁紙みたいな物なので、この上にサイドメニューや本文、広告等がのっかる感じです。


▼△ ブログ本文がある場所の背景 ▼△

テンプレート[dragonnest_2column]のブログ本文がある場所の背景は、
上部(top)、真ん中(body)（真ん中2(body2)連結用）、下部(bottom)の3つの画像を
合体させて作られています。　そして、ファイルの種類はPNGという画像形式のファイルに
なっています。それぞれの画像は、

上部(top)　　　サイズ：660(pix)×800(pix)
http://blog-imgs-42.fc2.com/t/e/m/templates/dragonnest_entry_top.png

真ん中(body) サイズ：660(pix)×827(pix)
http://blog-imgs-42.fc2.com/t/e/m/templates/dragonnest_entry_body.png

真ん中2(body2)連結用 サイズ：660(pix)×21(pix)
http://blog-imgs-42.fc2.com/t/e/m/templates/dragonnest_entry_body2.png

下部(bottom) サイズ：660(pix)×80(pix)
http://blog-imgs-42.fc2.com/t/e/m/templates/dragonnest_entry_bottom.png

にあります。　並べるとこんな感じですね。




この画像はPNG形式の画像ファイルを使っています。
（透過色を使わなければJPGファイルやブラウザで表示できる他の形式のファイルでも可）


※PNG形式の画像ファイル
透過色の設定ありの画像ファイル形式。　透明色を使えるということで、背景が透けて
見えます。例えば50円玉の絵を書いた時、真ん中の穴が開いた部分と四隅の三角の部分は
透けて向こうが見えて欲しいですよね。そういう時に使います。




Win7のペイントで開くことはできますが、透過色の指定をすることはできません。＞＜

※私は、上部(top)のダックをウルフに書き換えただけで、他はそのまま使っています。

※この上にブログの文章がのっかるので、あまりゴチャゴチャした感じだと読みにくくなるかもです。
　絵を載せるにしても背景色と同系色の薄い感じが良いかもです。＾＾


▼△ サイドメニューの背景変更 ▼△

サイドメニューも上部(side_top)、真ん中(side_body)、下部(side_bottom)の3つの画像を
合体させて作られています。 そしてこれもPNG形式の画像ファイルを使っています。
テンプレート[dragonnest_2column]のサイドメニューの背景は

上部(side_content_top)　サイズ：183(pix)×39(pix)
http://blog-imgs-42.fc2.com/t/e/m/templates/dragonnest_side_content_top.png

真ん中(side_content_body)　サイズ：183(pix)×39(pix)
http://blog-imgs-42.fc2.com/t/e/m/templates/dragonnest_side_content_body.png

下部(side_content_bottom)　サイズ：183(pix)×39(pix)
http://blog-imgs-42.fc2.com/t/e/m/templates/dragonnest_side_content_bottom.png

にあります。

※これもPNG形式の画像ファイルで真ん中(side_content_body)の左側に透過色が使われています。
　私は、下部(side_content_bottom)のデミを自分のキャラに置き換えただけで、他はそのまま
　使っています。


こんな感じです。＾＾





▼△ ページトップへボタン ▼△

テンプレート[dragonnest_2column]のページトップへボタンはここです。

ページトップへボタン(top_btn)　サイズ：183(pix)×39(pix)
http://blog-imgs-42.fc2.com/t/e/m/templates/dragonnest_top_btn.jpg

※あくまで画面TOPに飛ぶだけの機能なのでそんなに大きくなくて良いと思います。
　好きなマークやロゴとかでも良いと思います。＾＾


※画像のサイズですが、テンプレート[dragonnest_2column]の画像ファイルを一度PCに保存して
何かペイント（レタッチ）ソフトで開いて、その中で書き換えたりしていくと、大きさは
キープできるので良いかもです。＾＾　その辺りはやり易い方法でどうぞ♪＾＾



さて、画像が用意できたら、次回は設定ファイルの中身を触っていきます。



ドラゴンネストランキング ←ドラネス関連の人気ブログが見れるよ！良かったら押してね♪

「テンプレートのカスタマイズ」 ～その１～

「テンプレートのカスタマイズ」 ～その１～

いきなりドラネスと直接関連の無い内容ですが、私の覚書も兼ねて、テンプレートの
画像、位置の変更に関して少し書いてみようと思います。
良かったら（自己責任でｗ）参考にして頂ければと思います。＾＾

ベースになるテンプレートは、[dragonnest_2column]を使います。
（現在[dragonnest_2column]を使っている場合は、「複製」作成して元に戻せるように
　しておく事をお薦めします。）

【公式テンプレートの適用の方法】

「FC2ブログ」→「管理画面」の画面左のメニューの中の「設定」の中の「テンプレートの設定」
画面の上の方にある「テンプレート管理」の中のPC用で「公式テンプレート追加」をクリック。

下の方に「dragonnest_2column」ってテンプレートが出てるかもしれませんが、無ければ
名前インデックスで「D」をクリックして探してください。

「詳細」をクリックして「ダウンロード」をクリックして下さい。

ダウンロードできたら、画面左のメニューから「テンプレートの設定」をクリックして下さい。


「PCテンプレート[dragonnest_2column]適用中」になっていればOK♪
（なってなかったら、ラジオボタンにチェックを入れて「適用」ボタンをポチッ！）

これで「dragonnest_2column」のテンプレートが適用されているので、ブログを確認すると
デミの大きな画像があるブログページが現れるはずです。

このまま使ってもいいのですが、今回はこの[dragonnest_2column]をベースにして
少しだけ改造してみたいと思います。


【テンプレートの各部の説明】
１枚に見えるブログページも色んなパーツの寄せ集めでできていて、各部分部分で設定制御
されています。　ややこしそうですが、触るのは一部なのでまずはどんな部分分けがされているのか
見てみましょう。（ややこしくならないように、かなり大雑把に分けています。ｗ＾＾；）




①ヘッダー部（header）
②ブログタイトル
③全体背景(container)
④ブログ本分のある場所（entry）
⑤サイドメニュー(sidemenu)
⑥トップへアイコン

からなっています。　今回、手を加えるのは

・ヘッダー部の背景の変更
・全体背景の変更
・ブログタイトルの位置変更
・ブログ本文がある場所の背景変更
・サイドメニューの背景変更
・トップへアイコンの変更

を行いたいと思います。（主に背景変更だけですね。ｗ＾＾；）


以上を踏まえて、次は画像を用意してみましょう。＾＾



ドラゴンネストランキング ←ドラネス関連の人気ブログが見れるよ！良かったら押してね♪

ブログページ作成完了！

ブログページ作成完了！　　　・・・とりあえず。ｗ

というわけで、ポチポチと書いて行けたらと思います。＾＾



ドラゴンネストランキング ←ドラネス関連の人気ブログが見れるよ！良かったら押してね♪