icon_torita-gj.png人物紹介:羽村鳥太

鳥巣株式会社の新入社員。
ホームページ担当らしくなった?

icon_neko-1.png

人物紹介:猫先生

特別顧問のしゃべる猫。
パソコンやホームページに詳しい。

icon_tugumi-gj.png

人物紹介:羽雲つぐみ

鳥太の部署の先輩。
特技はたとえ話と除霊。

 

【第15回】最終回!リンクの設定&公開作業をしよう!!つかってみようFeather cloud

ホームページ作成は知識がないと難しい、そう思っている方におすすめのBIGLOBEホームページサービス『Feather cloud』。きれいなホームページを、かんたんな操作で作ることができます。
今回はついに最終回!これまで作ってきたページのリンクを設定して、ホームページを公開します!!

最終回も徹底レクチャー!鳥巣株式会社のホームページついに完成!!の巻

 

icon_torita-5.pngおはようございます……猫先生、つぐみ先輩。

 

icon_neko-1.pngおはようニャ、鳥太、つぐみ。鳥太、そんな暗い顔のうえに敬語でどうしたニャ。

 

icon_tugumi-3.pngおはよう、鳥太くん、猫先生!ほら、鳥太くんも笑顔笑顔!!

 

icon_torita-1.pngだって、今回でこのコラムの連載もついに終わりッスよ。。いままで毎週載ってきたのに、来週からはこの丸窓から顔を出して話さないんだなって思うと……。

 

icon_neko-2.pngメタなことを言いつつ寂寥感に浸るのはやめるニャ、鳥太。丸窓なら某SNSのアイコンも同様だ、今後はそこでつぶやくといいニャ。

 

icon_tugumi-gj.png自分の写真をSNSのアイコンにするって、けっこうハードル高いですけどね♪ さて、今日もさくさくレクチャーいきましょ!

 

icon_torita-1.pngうっ……。。 この強引な展開、最後まで雑談する尺が足りないんッスね……。。

 

icon_neko-5.pngうむ! しかし、最終回だからきっと多めに見てくれるニャ!では、最後もびしばしレクチャーしていくニャ!!まずは完成したトップページを開くニャ!

img_fcblog_15-1.jpg

 

icon_tugumi-1.png鳥太くんががんばって作ってきたけど、こうして完成形を見ると、改めて嬉しくなるわね♪

 

icon_torita-2.pngへへ、そう言ってもらえると嬉しいッス!なんか照れるッスね~。

 

icon_neko-2.pngうむ、鳥太も笑顔になって何よりニャ。
だが、このページには重要なモノが足りていないんだニャ。。
鳥太、「プレビュー」を押して、メニューをクリックしてみるニャ。

 

icon_torita-3.pngえっ!? 重要なモノが…!?
り、了解ッス! ぽちっとー!!

img_fcblog_15-2.jpg

 

icon_torita-5.pngあれ…… メニューはあるのに、クリックできないッス。。
これ、他のページを見てる時に出くわすと、一番残念なやつッスね。

 

icon_neko-3.pngうむ。
【第12回】メニューを編集しよう!で見た目は作ったが、ページ同士をつなげる設定はしていなかったんだニャ。

 

icon_tugumi-1.png確か『この機能の編集は、後日「リンクの設定」でも行うから、今日は聞き流していいニャ。』って言ってたわね?

 

icon_neko-3.pngそのとおりニャ、つぐみ。
ということで、まずはブロックエディタを開いて画像をクリックし、右メニューを出すニャ、鳥太。

 

icon_torita-2.pngはーい。ぽちっとー。 ブロックエディタ開いて画像クリックは、もう完璧ッスよ!
ブロックエディタ??って思ったら、第7回を参考にして欲しいッス!!

img_fcblog_12-4.jpg

 

icon_tugumi-3.pngスムーズに右メニューまで開いたわね♪
メニュー編集のときは、「テキスト」だけ変更したのよね。

 

icon_neko-2.pngうむ。今回はその下の「リンク先」を編集していくニャ。
鳥太、「リンク先」と書かれた下の、プルダウンをクリックするニャ。

 

icon_torita-1.pngこれッスね? ぽちっと……
お、項目がたくさん出てきたッス。

 

icon_tugumi-3.png「経営理念」、「事業情報」、「代表のご挨拶」、「アクセス」……
あれ? これって、第13回で作った他のページよね?

 

icon_neko-1.pngご名答ニャ、つぐみ。 つまり……

 

icon_torita-gj.pngあっ、分かったッス猫先生!
リンクしたいページを、ここから選べばいいんッスね!!

img_fcblog_15-3.jpg

 

icon_neko-4.pngうむ! その通りニャ、鳥太!!
成長したな……吾輩も嬉しいニャ!!

 

icon_torita-2.pngへへ~、あざっす!
じゃあ、まず「会社のご紹介」のテキストのとこに、「会社のご紹介」ページを設定するッスね。よいしょ~。

 

icon_neko-5.png鳥太、ひとつ注文があるニャ!
第12回で「TOP」の機能をロゴに持たせる、という話をしたニャ。
なので、「オプション」タブにある鳥巣株式会社のロゴ画像には、「TOP」ページを設定してほしいニャ。

 

icon_torita-3.pngお、了解ッス!
開き方や設定のしかたはいっしょッスもんね! どっこいしょー!!

 

icon_torita-gj.pngよーし!
メニュー部分、ぜんぶリンクできたッス!!

 

icon_tugumi-gj.pngあっという間に終わったわね!
今までと違って、作業を理解しながら進めてると、頼もしいわね♪

 

icon_neko-5.pngうむ! よきかなニャ!!
では、プレビューで実際にリンクが動くか、確認してみるニャ!
飛べないリンクはただの下線ニャ!!!

 

icon_torita-3.pngはーい!! ぽちっとー!!

img_fcblog_15-4.jpg

 

icon_tugumi-3.pngすごーい!
あっという間に、ページの移動ができるようになったわね!!

 

icon_torita-1.pngでも、ほかの会社のページとかだと、ここの「経営理念の詳細」や「新卒採用サイトはこちら」を押しても、そのページに飛べたりするッスよね。
ここにも、リンク設定したほうがいいッスよね?

 

icon_neko-4.png良いところに気が付いたニャ、鳥太!
では、メニュー以外の場所にもリンクを追加してみるニャ。
「経営理念の詳細」があるブロックエディタ画面を開き、画像をクリックして右メニューを出すニャ!

 

icon_torita-3.pngはーい! ほいほいっと!!

img_fcblog_15-5.jpg

 

icon_tugumi-gj.pngあっ、設定のしかたはさっきと同じっぽいわね!!

 

icon_neko-1.pngその通りニャ、つぐみ!
鳥太、「クリック設定」タブを開き、「リンクする」にチェックを入れて、ページを選ぶニャ。

 

icon_torita-2.pngはーい! ぽちぽちっと~♪

 

icon_neko-3.pngちなみに、ページ選択の下にある「ページ遷移」などの、リンクの細かい設定については このFAQ を参考にして欲しいニャ。

 

icon_tugumi-1.pngテキストリンクだと、アイコンフォントを入れたりすることもできるのね♪

 

icon_neko-2.pngうむ。小さい画像を作って追加する、などのレトロな手間が省けて非常に便利ニャ。
画像と違って、スマホで見ても綺麗だしニャ。

 

icon_torita-gj.pngよし! できたッス!!

img_fcblog_15-6.jpg

 

icon_neko-4.pngうむ! 完璧ニャ!!
これで、鳥巣株式会社のホームページは完成ニャ!

 

icon_tugumi-2.pngやったわね! ……と言いたいところだけど……
これ、今の状態だと、私達がプレビューで見られるだけよね?

 

icon_torita-1.pngえっ。。 じゃあ、友達や姉ちゃんのパソコンからは見れないんっすか……。。
オレが作ったって、みんなに見てほしいッス。。

 

icon_neko-1.png無論ニャ。このままでは、ホームページを新しくしたとはいえないニャ。
では、最後のレクチャー……公開作業を行うニャ!

img_fcblog_15-7.jpg

 

icon_torita-1.pngえっ?

 

icon_tugumi-2.png
……これだけ?

 

icon_neko-1.pngうむ。これだけニャ。
詳しい設定はたくさんあるが、公開するだけならここを押せばいいニャ。

 

icon_torita-5.pngえっと……サーバ契約? とか、しなくていいんッスか?

 

icon_tugumi-4.pngうんうん、ページを公開するには、レンタルサーバが必要になるんじゃないの?

 

icon_neko-4.pngフフフ……『Feather cloud』には、10GBのサーバも含まれているんだニャ。
サーバの詳しい仕様についてはFAQの「サーバ環境」を、ページの設定についてはここの「 Feather cloud使い方ガイド」のpdfなどを参考にしてくれニャ。

 

icon_torita-2.pngとりあえず、公開したらみんなに見てもらえるんッスね!
じゃあいきます! ぽちっとー!!

img_fcblog_15-8.jpg

 

icon_tugumi-3.pngついに公開ね……!!
あっ、自分のスマホからも見られる♪

 

icon_neko-1.pngうむ。 これで、全世界の誰もがこのページを見ることができるようになったニャ。
実際に鳥巣株式会社の古いホームページと表示を入れかえるには、URLの設定や手続きなどが別途必要になってくるが……それはまた、別の話ニャ。

 

icon_neko-5.png今は、ホームページ完成を存分に喜ぶといいニャ!

 

icon_torita-5.pngオレのスマホからも、このページ、見れるッス……!!
さっそく父ちゃんや姉ちゃんにもメールするッス!!

 

icon_tugumi-4.pngちょっと鳥太くん!
気持ちはわかるけど、まずは広報部のみんなや社内に報告でしょ!

 

icon_torita-3.pngあっ、そうッスね! 全社通知ッスか? 全社ッスか!?

 

icon_neko-1.png通知は吾輩から出しておくニャ。
二人は少し休憩するといいニャ。

 

icon_neko-4.png……さて。

 

icon_neko-1.pngパソコンにまったく詳しくない鳥太でも、この全15回を通して「Feather cloudでホームページを作る」という目標を、きちんと達成できたニャ。
きっと、これを読んでくれている貴君なら、鳥太よりもっとサクサク、かんたんに、ホームページが作れるはずニャ。
ホームページを楽しく作る手助けになれたなら、嬉しい限りだニャ。

 

icon_neko-5.png……って、な、何するニャ鳥太!!

 

icon_torita-1.pngひどいッスよ猫先生!
オレをディスった上に、ひとり?で勝手にシメの言葉始めないで欲しいッス!!

 

icon_torita-gj.pngここまで読んでくれて、あざっす!! オレが作れたくらいなんで、この連載を見返してもらえば、誰でもホームページは作れると思うッス!
Feather cloudは二カ月無料なんで、気軽に始めるといいッスよ!

 

icon_tugumi-gj.pngわたしは途中参戦だったけど、いっしょにレクチャーを受けてて、楽しそうって思ったわ♪
これで、別サイトで作成を依頼されてた、エクソシスト業務部のホームページもサクサク作れそうですっ♪

 

icon_torita-4.pngえっ、そんな目的だったんッスか、つぐみ先輩!?
オレが言うのも何ですけど、めっちゃ怪しい業務部が立ち上がったんッスね……
鳥巣株式会社は大丈夫なんスか、猫先生。。

 

icon_neko-3.png……うむ、吾輩も今になって知った衝撃の事実ニャ。
だいぶ不安になってきたニャ……。

 

icon_tugumi-gj.pngゆくゆくは、異界と行き来できる扉を召喚したりもするらしいわ♪
「うちの会社が異界と貿易を始めるようです。」10月クールから連載開始よ!(※その予定は一切ありません)

 

icon_neko-5.pngええい、取ってつけたようなラノベ風タイトルはやめるニャ!
くっ、最終回までこんなドタバタして終わるのかニャ……!! 鳥巣社長に直訴してくるニャ!!

 

icon_torita-gj.pngあっ、オレも行くッス、猫先生!!
……じゃ、またどこかで!
ありがとうございました!!