BIGLOBEホームページサービス「Feather cloud」の紹介コラムです。きれいなホームページを、初心者でも簡単に作れる「Feather cloud」。その使い方を、対話形式で詳しくご紹介していきます。


人物紹介:羽村鳥太

人物紹介:羽村鳥太

鳥巣株式会社の新入社員。
パソコンに詳しくないホームページ担当。

人物紹介:猫先生

人物紹介:猫先生

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

人物紹介:猫先生

人物紹介:羽雲つぐみ

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

【第10回】画像を変えてみよう(その2)!つかってみようFeather cloud

BB-WAVE掲載日:2017年08月16日


ホームページ作成は知識がないと難しい、そう思っている方におすすめのBIGLOBEホームページサービス『Feather cloud』。きれいなホームページを、かんたんな操作で作ることができます。
この第十回では、『Feather cloud』でホームページのスライド画像を実際に変更してみます。

前回「編集の前に、ブロックを複製しよう!つかってみようFeather cloud」はこちら

かき氷と祭りとSHiFTパーツリターンズ!の巻

おはよッス、猫先生、つぐみ先輩!

おはよう、猫先生、鳥太くん!
今回もがんばっていくわよー!

おはよう、鳥太、つぐみ。
二人とも、ずいぶん元気だニャ?

こんど、裏山の神社で夏祭りがあるんですよ♪
会社の掲示板にポスターが貼られてたんです!

そうなんッスよ!
タコ焼き、カルビ串、かき氷……! 楽しみッス!!

……なるほど、祭りは確かに面白いものニャ。
吾輩は少し苦い思い出があるが……まあいい、今日のレクチャーにいくとするニャ。

ふーん……?(ちょっと気になるけど、詮索するのもなあ)
今日のレクチャーは、先週のつづき「SHiFTパーツ」よね。

ああ。今回は「SHiFTを開く」で編集画面を開いた続きから始めるニャ。
開き方は、前回の3枚目の画像までを参考にしてくれニャ。

その続きも読んで、「ブロックの複製」をしておくと、さらに安心ッスよ!

画像変更の画面1 スライドの変更画面ニャ

ということで、ここの画像を実際に変えていくニャ。

うんうん、今までと違う画面で、どうしていいかわからなかったのよね。

どこ押せばいいのかなって、不安になったッス。。

うむ。では説明していくニャ。
まず、画面の左部分に注目するニャ。

SHiFT左部分の説明ニャ

えっと……、文字が多いから、じっくり見るッスね。
あ、画像を入れ替えるのはここなんッスね。

うむ。さっそく画像を一枚入れ替えてみるニャ、鳥太。
一番上の画像をクリックして、右画面の「画像編集」をクリックするニャ。

はーい! 画像を押して……、ぽちっとー!

SiGNPro画面ニャ

……?
また、見たことない画面が出ちゃったわね?

うっ……。。なんか、画像をどうにかするアプリっぽいッスね……。
オレ、こういうの苦手なんッス。。前回「ブロックの複製」しておいて良かった……!

臆するな、鳥太。使い方がわかれば簡単ニャ。
まずは、中央の画像をダブルクリックしてみるニャ。

は……はい。。ぽちぽちっと〜……

画像の編集モードになったニャ

うーん、ほとんど変わらない……ッスね。

あっ、左のTとかがなくなってるわよ。
左上に「画像選択」っていうのも出たわ。

うむ。いい着眼点ニャ。
では、左上の「画像選択」にある、画像っぽいアイコンをクリックしてみるニャ。

画像っぽいアイコンの先は、この画面だニャ

あっ、第八回でうな丼入れた時の画面ッス!!
ってことは、ここから画像を選べばいいんッスね??

ああ、その通りだニャ鳥太。
今回も、好きな画像をドラッグ&ドロップで入れてみるニャ。

このフォルダに画像を入れるやり方は、第八回を参考にしてね♪

はーい!
じゃあ、コレにするッス!! よいしょー!

相変わらず無駄に威勢のいい掛け声だニャ。
では、入れた画像を押してから、右下の「選択」をクリックニャ!

はい!
ぽちっとー!

画面の画像が変わった!

おー! 画像が変わったッスね!!

変わったのはいいんだけど、これ、サイズあってるのかな?

え?? サイズ?

うん。 最初の画像のときは、左右に白いのはなかったわよ?

ふむ、鋭いニャつぐみ。……では、余白を駆逐するぞ鳥太。
中央上部の「フィット」の左右の矢印ボタンをクリックしてみるニャ。

ん? これッスか? ぽちっとー。

画像が枠にフィットした!

いい感じに拡大されて、余白がなくなったわね!

うむ。いい感じにリサイズしてくれる優れものニャ。
これでOKなら、左上の青いボタン「完了」を押して、さらにその先で緑の「完了」を押すニャ。

はい! ぽちぽちっと〜!

押して押してSHiFTに戻ったニャ

よし。SHiFTにも無事に反映されたニャ。
では、「保存」を押して……

この画面に来たら、なにはともあれ、緑の「適用」ボタンよね♪

うむ。変更したら、緑の適用ボタンニャ。
「適用を押さずに閉じる、ダメ!ゼッタイ!!」とセットで、Feather cloudの標語にしてもいいくらいだニャ。

じゃあ、「適用」かーらーの「閉じる」いくッスね!
ぽちっとー!!

しかし、今回の「スライド」は、回らないと画像が反映されたかよくわからないニャ!
右上の「プレビュー」をクリックするニャ!!

はい!
よいしょー!!

プレビュー画面

回ってるわね! かき氷!!

うーん、納涼ッスね!!

うむ。
この調子でSHiFTの画像を入れ替えることで、自分だけのスライドを完成させることができるニャ。

じゃあ、次はわたしの金魚すくいの画像を入れてみてもいい?

うむ。では、つぐみに続いて吾輩もひとつ入れてみるニャ。

……って、猫先生。
それ、エグくないっすか……

うん……。
金魚のあとに刺身は……どうかなぁ……。。

な、何を言うニャ!?
猫ヴィジョンでは、これらはほぼ同意義ニャ!!

……弱肉強食ッスね……。
今年の夏祭りはみんなで行けたらって思ってたんッスけど、猫先生は誘わない方がいいッスね。。

うん、金魚すくいをディナーにされちゃうのはね…。。
広報部のみんなで行きましょ。

ま、待つニャ二人とも!
さっきのはちょっと小粋な猫ジョークニャ……!!

次回「画像変更章、ついに最終回!奥義☆ページレイアウトの設定!!」お楽しみに!

今回使ってみたサービス

  1. サービス名:BIGLOBE Feather cloud
  2. 提供会社:ビッグローブ株式会社
  3. http://www.fc.biglobe.ne.jp/index.html