人物紹介:羽村鳥太
鳥巣株式会社の新入社員。
パソコンに詳しくないホームページ担当。
人物紹介:猫先生
特別顧問のしゃべる猫。
パソコンやホームページに詳しい。
人物紹介:羽雲つぐみ
鳥太の部署の先輩。
特技はたとえ話と除霊。
【第13回】ページ作成を進めていこう!つかってみようFeather cloud
ホームページ作成は知識がないと難しい、そう思っている方におすすめのBIGLOBEホームページサービス『Feather cloud』。きれいなホームページを、かんたんな操作で作ることができます。
この第十三回では、ホームページの完成に向けて、『Feather cloud』でページを作りこんでいきます。
完成に向けてその2☆華麗にビフォーアフター!の巻
おはよッス! 猫先生、つぐみ先輩!!
今日も張り切っていくッスよ!!
おはよう、鳥太くん。気合入ってるわね!
猫先生、おはようと同時に額のあたりを前足で撫でて萌えポーズしてますけど、どうしたんですか?
これは萌えポーズじゃないニャ! 顔を洗ってるんだニャ。
くっ、台風の季節はいつもこうニャ……。
そっか~、毎朝サービスしてるんじゃないんッスね!
じゃあ、次に台風が近づいてたら激写しとくッス!
……鳥太くん。予告したら激写にならないんじゃないかな?
うっ、そ、そうッスね。。
ってことで猫先生、さっきの話は聞かなかったことにして下さい!
ばっちり聞いたニャ。
今後は早起きして、存分に顔を洗ってから出勤するニャ。
そ、そんな……ひどいッスよ~。
気が向いたら写真集用に撮り下ろし撮影を許可するから、そう気を落とすニャ、鳥太。
まずは今日のレクチャーをビシバシ進めるニャ。
本当ッスか!
オレ、がんばるッスよ!!
写真集も今日のレクチャーも楽しみね!

ということで、今日は前回メニューを編集したこのページの中身と、他のページの中身を作りこんでいくニャ。
でも、画像とかテキストとか、全部考えるのって大変ッスよね。
他の部署にも、書き方があってるか、確認しないとな箇所もあるし……。。
うむ。個人や風通しの良い中小企業などはすぐ確認できそうだが、会社の規模や体制次第では、社内確認に時間がかかることも多いニャ。
画像は、吾輩が事前に各部署のOKをもらっておいたニャ。
テキストは、現行のページで公開されているものと同じでいい、と社長のOKを得ているニャ。
さすが特別顧問さん、事前準備ばっちりね!
ページを作ることも大事だけど、下準部も大切なのね♪
うむ!!
では、まず現行の古いページを見ながらテキストを配置していくニャ!

じゃ、猫先生が指示してくれた、ここのブロックエディタを開くッスね!
よいしょー!
ブロックエディタの開き方は、第7回を参考にしてね!

まず「タイトル」だが、これは古いページのグレーの部分の「巣立ち、出会い、また巣をつくる」でいいだろう。
コピー&ペーストするニャ。
コピペ? 手打ちじゃダメなんッスか??
オレ、なにげに打つの好きなんッスけど。
まったく同じ文章なら、手打ちよりコピペのほうが正確になると思うわ♪
漢字変換を間違えちゃったりすると、ときどき悲惨になるし……そうよね、猫先生?
うむ。
入力ミスの削減と効率化のために、吾輩もコピペをおすすめするニャ。
了解ッス!
ベストオブおべんとうを消して……よいしょー。
次に「本文」だが、ここはタイトルの下にある小さめの文字の部分ニャ。
古いページで、次に入っているのは「鳥巣株式会社は、お客様との出会いから巣立ちまでをサポートいたします。」だから、これをコピペで入れるニャ。
はーい! よいしょー。
その下の「リンク画像」っていうのはどうするの?
ここは、新しい画像を用意したニャ。
この「経営理念の詳細」に画像を変更するニャ、鳥太。
おっ、シンプルだけどかっこいい画像ッスね! どっこいしょー!!
画像の変更のしかたは、第8回を参考にしてほしいッス!
よし!
では、次の横長の画像ふたつのブロックは削除するニャ。
テンプレートの画像だから、これは使うことができないニャ。
そっか、テンプレートに使われてる画像は、借り物のイメージ画像だから使っちゃいけないのね?
うむ。
実際にページを公開する前に、自分で用意した画像に差し替えないといけないニャ。
なるほど……了解ッス!
じゃあ、ぽちぽちっとー!
よし。
では、ここまでで一旦確認してみるニャ。

では、次は画像を足すニャ。
横に二つ画像を並べるんだが……まず、ブロックを追加するニャ。
はーい。 ……って、あの、猫先生……。。
画像を横に2つ並べるテンプレート、ないっぽいんですけど……。
うむ、そうなんだニャ。
「スマートモード」で作るのは難しいので、ここは「エディタモード」を使うニャ。
「エディタモード」の「画像/ギャラリー」をクリックして、「フォトレビュー」をクリックし、最後に「適用」ニャ。

だ、大丈夫っすかね…… ぽ、ぽちぽちっと。。
なんだか、見慣れないブロックエディタ画面が出てきたッスよ。。
うむ。恐れることはないニャ、鳥太。それがエディタモードの画面ニャ。
吾輩の指示通りに進めていけば大丈夫ニャ。

うーん、スマートモードよりちょっと難しそうね。
でも、間違って消しちゃったりしても、また新しいブロックをこのテンプレートで作ればいいだけよね?
そのとおりニャ、つぐみ。
もし操作が怖い場合は、第9回で学んだ、ブロックの複製をしておくのも良いニャ。
わ、わかったッス!
ビビッてないでガンガンいくッス! ぽちぽちっとー!!
あっ、なんだかふっきれたわね、鳥太くん!
……よし! できたッス!!

うむ!
この調子でどんどん進めるニャ、鳥太!!
はーい!
次はここっすね! ぽちっと~!!
サクサク作り進めてるわね!
ファイト、鳥太くん!
……………………
よし! 編集が完了したニャ、鳥太!!
プレビューを押すニャ!!!
はい!!
いきまーす!

おおお……!
と、鳥巣株式会社のページになったッスね……!!
ほんとね!
最初にこのテンプレートを見たときは、旅行会社っぽかったのに……!!
うむ……!!
ついにここまできたニャ……感無量ニャ……。
さて、1ページで感動に浸っているヒマはないニャ!
鳥巣株式会社のページは、「会社のご紹介」「経営理念」「事業情報」……など、まだまだあるニャ。
このページを複製して、他のページも作っていくニャ!!
猫先生、オレ、ようやくホームページ担当の仕事ができてる気がするッス……!!
この調子で進めていくならできるッス! がんばるッスよ!!
疲れたらわたしも手伝うわ、鳥太くん!
来週までにがんばって他のページも作りましょ♪
うむ、チーム一丸となって進むニャ……!!
次回は、これがあれば募集もアンケートもらくらく! 採用ページのお申し込みフォームを作っていくニャ!!
次回「世界とコンタクト☆お申し込みフォーム作成!!」お楽しみに!
人物紹介:羽村鳥太
鳥巣株式会社の新入社員。
パソコンに詳しくないホームページ担当。
人物紹介:猫先生
特別顧問のしゃべる猫。
パソコンやホームページに詳しい。
人物紹介:羽雲つぐみ
鳥太の部署の先輩。
特技はたとえ話と除霊。
ホームページ作成は知識がないと難しい、そう思っている方におすすめのBIGLOBEホームページサービス『Feather cloud』。きれいなホームページを、かんたんな操作で作ることができます。
この第十三回では、ホームページの完成に向けて、『Feather cloud』でページを作りこんでいきます。
完成に向けてその2☆華麗にビフォーアフター!の巻
おはよッス! 猫先生、つぐみ先輩!!
今日も張り切っていくッスよ!!
おはよう、鳥太くん。気合入ってるわね!
猫先生、おはようと同時に額のあたりを前足で撫でて萌えポーズしてますけど、どうしたんですか?
これは萌えポーズじゃないニャ! 顔を洗ってるんだニャ。
くっ、台風の季節はいつもこうニャ……。
そっか~、毎朝サービスしてるんじゃないんッスね!
じゃあ、次に台風が近づいてたら激写しとくッス!
……鳥太くん。予告したら激写にならないんじゃないかな?
うっ、そ、そうッスね。。
ってことで猫先生、さっきの話は聞かなかったことにして下さい!
ばっちり聞いたニャ。
今後は早起きして、存分に顔を洗ってから出勤するニャ。
そ、そんな……ひどいッスよ~。
気が向いたら写真集用に撮り下ろし撮影を許可するから、そう気を落とすニャ、鳥太。
まずは今日のレクチャーをビシバシ進めるニャ。
本当ッスか!
オレ、がんばるッスよ!!
写真集も今日のレクチャーも楽しみね!
ということで、今日は前回メニューを編集したこのページの中身と、他のページの中身を作りこんでいくニャ。
でも、画像とかテキストとか、全部考えるのって大変ッスよね。
他の部署にも、書き方があってるか、確認しないとな箇所もあるし……。。
うむ。個人や風通しの良い中小企業などはすぐ確認できそうだが、会社の規模や体制次第では、社内確認に時間がかかることも多いニャ。
画像は、吾輩が事前に各部署のOKをもらっておいたニャ。
テキストは、現行のページで公開されているものと同じでいい、と社長のOKを得ているニャ。
さすが特別顧問さん、事前準備ばっちりね!
ページを作ることも大事だけど、下準部も大切なのね♪
うむ!!
では、まず現行の古いページを見ながらテキストを配置していくニャ!
じゃ、猫先生が指示してくれた、ここのブロックエディタを開くッスね!
よいしょー!
ブロックエディタの開き方は、第7回を参考にしてね!
まず「タイトル」だが、これは古いページのグレーの部分の「巣立ち、出会い、また巣をつくる」でいいだろう。
コピー&ペーストするニャ。
コピペ? 手打ちじゃダメなんッスか??
オレ、なにげに打つの好きなんッスけど。
まったく同じ文章なら、手打ちよりコピペのほうが正確になると思うわ♪
漢字変換を間違えちゃったりすると、ときどき悲惨になるし……そうよね、猫先生?
うむ。
入力ミスの削減と効率化のために、吾輩もコピペをおすすめするニャ。
了解ッス!
ベストオブおべんとうを消して……よいしょー。
次に「本文」だが、ここはタイトルの下にある小さめの文字の部分ニャ。
古いページで、次に入っているのは「鳥巣株式会社は、お客様との出会いから巣立ちまでをサポートいたします。」だから、これをコピペで入れるニャ。
はーい! よいしょー。
その下の「リンク画像」っていうのはどうするの?
ここは、新しい画像を用意したニャ。
この「経営理念の詳細」に画像を変更するニャ、鳥太。
おっ、シンプルだけどかっこいい画像ッスね! どっこいしょー!!
画像の変更のしかたは、第8回を参考にしてほしいッス!
よし!
では、次の横長の画像ふたつのブロックは削除するニャ。
テンプレートの画像だから、これは使うことができないニャ。
そっか、テンプレートに使われてる画像は、借り物のイメージ画像だから使っちゃいけないのね?
うむ。
実際にページを公開する前に、自分で用意した画像に差し替えないといけないニャ。
なるほど……了解ッス!
じゃあ、ぽちぽちっとー!
よし。
では、ここまでで一旦確認してみるニャ。
では、次は画像を足すニャ。
横に二つ画像を並べるんだが……まず、ブロックを追加するニャ。
はーい。 ……って、あの、猫先生……。。
画像を横に2つ並べるテンプレート、ないっぽいんですけど……。
うむ、そうなんだニャ。
「スマートモード」で作るのは難しいので、ここは「エディタモード」を使うニャ。
「エディタモード」の「画像/ギャラリー」をクリックして、「フォトレビュー」をクリックし、最後に「適用」ニャ。
だ、大丈夫っすかね…… ぽ、ぽちぽちっと。。
なんだか、見慣れないブロックエディタ画面が出てきたッスよ。。
うむ。恐れることはないニャ、鳥太。それがエディタモードの画面ニャ。
吾輩の指示通りに進めていけば大丈夫ニャ。
うーん、スマートモードよりちょっと難しそうね。
でも、間違って消しちゃったりしても、また新しいブロックをこのテンプレートで作ればいいだけよね?
そのとおりニャ、つぐみ。
もし操作が怖い場合は、第9回で学んだ、ブロックの複製をしておくのも良いニャ。
わ、わかったッス!
ビビッてないでガンガンいくッス! ぽちぽちっとー!!
あっ、なんだかふっきれたわね、鳥太くん!
……よし! できたッス!!
うむ!
この調子でどんどん進めるニャ、鳥太!!
はーい!
次はここっすね! ぽちっと~!!
サクサク作り進めてるわね!
ファイト、鳥太くん!
……………………
よし! 編集が完了したニャ、鳥太!!
プレビューを押すニャ!!!
はい!!
いきまーす!
おおお……!
と、鳥巣株式会社のページになったッスね……!!
ほんとね!
最初にこのテンプレートを見たときは、旅行会社っぽかったのに……!!
うむ……!!
ついにここまできたニャ……感無量ニャ……。
さて、1ページで感動に浸っているヒマはないニャ!
鳥巣株式会社のページは、「会社のご紹介」「経営理念」「事業情報」……など、まだまだあるニャ。
このページを複製して、他のページも作っていくニャ!!
猫先生、オレ、ようやくホームページ担当の仕事ができてる気がするッス……!!
この調子で進めていくならできるッス! がんばるッスよ!!
疲れたらわたしも手伝うわ、鳥太くん!
来週までにがんばって他のページも作りましょ♪
うむ、チーム一丸となって進むニャ……!!
次回は、これがあれば募集もアンケートもらくらく! 採用ページのお申し込みフォームを作っていくニャ!!
次回「世界とコンタクト☆お申し込みフォーム作成!!」お楽しみに!