千客万來! かんたん携帯サイト作成講座 本文へジャンプ

6. ホームページ・ビルダーで携帯サイトを作成するA

さてさて、ホームページ・ビルダーのかんたんテンプレート機能は本当に簡単なので、流れに沿うだけで5ページがセットでできてしまいましたが、これから皆さんがご自分のサイトを作るときには、知っておいたほうがよいテクニックがもう少しありますよ!

ここではそれらに触れてみますので、ぜひポイントをおさえてくださいね!

                                                                                 
サイトを開く/サイト全体の確認/ページの編集

・作成したサイトをホームページ・ビルダーから開いて編集するには、「サイト」メニュー → 「サイトをを開く」→ 第2章のBで付けたサイト名「店舗サイトの携帯版」を選んで「開く」をクリックしましょう。

・サイトを開いた上体で、画面上部青いナビバーの中の「全体の確認」をクリックすると、全体の構成がツリー表示で確認できます。

・作成したHTMLページがアイコンで見えています。それらのアイコンをダブルクリックするとそのファイルが編集できるようになります。

ページを追加する・削除する

もちろん皆さんがご自分のサイトを作るときは、5ページ以上になることもあると思います。ページを追加するときの方法はどうしたらよいでしょうか。

一番よいのが、似たデザインのページをコピーしてファイル名を変える方法です。もっとわかりやすくいうと、別のファイル名で保存して使えばいいんです。

@ホームページ・ビルダーの編集画面上に、まずコピーしたいページを開いておきます。たとえばsub1.htmlを開いておきます。
A「ファイル」メニューの中の「名前を付けて保存」を選択し、追加するページとして新しい名前を付けてください。たとえば本講座で作ったHTMLページはindex、sub1、sub2、sub3、sub4でした。追加するのでしたらsub5とするとわかりやすいですね。

これでページのコピーができました。

編集画面上での編集のしかた


このsub5.htm、もともとはsub1.htmlなので、おすすめツアーの内容が書かれていますよね。これを違う内容に直してみましょう。

・文字はワープロのように書き換えることができます。コピー&ペーストもできます。

・画像も選択して削除したりコピー&ペーストできます。

・画像を新しく入れてみたい場合、画面左側の青いナビメニューの「写真や画像の挿入」→「デジカメ写真」で画像を選ぶことができます。写真を選んだあと進むと、サイズの指定があります。マルチキャリア対応のメリットを生かし、大きく見せたいような写真ならば、中サイズにして編集画面から隠れるぐらい大きくなってもかまいません。サイズを指定することも可能です。

以下のように新たなページができました。




見出しを飾り文字にする



どうせならついでに…、見出しを見やすくロゴ画像(飾り文字)にしてみちゃいましょう!!

なんたってこのワザはあっこ先生のお気に入りなんですもん!!


では、

「大人気★のんびりツアー」

という文字を全部選択して黒く反転させた状態で、左側のナビメニューの「ロゴ(飾り文字)の挿入」→「ロゴ(飾り文字)」と進んでみましょう。
 


うーん、現れたサンプルの飾り文字は、ちょっと派手かしら…。
ここは、右下のほうにある「文字の詳細設定」というボタンをクリックし、その先の設定でシンプルなフォントにしてみましょう。お手持ちのフォント次第でいろいろ楽しめますよ。

 
 こんなのや…

      大人気★のんびりツアー

 こんなのも… (以下は「ロゴ(飾り文字)の挿入」→「ボタン」で作成)

      大人気★のんびりツアー


簡単にできますよ! また、このような画像に変換されたあとでも、もう一度同じメニューで再編集できるのも大変便利です。

さーて、あとは…
あれれ? でもこのページってよく考えたらいったいどこから飛ぶんだろう…???

そうなんです! 忘れてはいけない大事なテクニックがもう1つだけあるのです。

それは…

リ・ン・ク なのです!!


リンクのはり方

このsub5.htmlを、今まで作ったその他のページからつなげないと、見ることができませんよね。
では、リンクのはり方を勉強しましょう。


@編集画面に、すでに作ったindex.htmlを開きます。

A「年末年始★おすすめツアー」などどれかのリンクを1行コピーして追加し、「大人気★のんびりツアー」と書き換えます。



1行を追加する前
 


 →
  
1行追加した後


B「大人気★のんびりツアー」の文字全部を選択して黒く反転させた後、画面左の青いナビメニューの中の「リンクの挿入」を選択します。

C「ページやURLへのリンクを作成する」が選ばれている状態で「次へ」をクリック。次でももう一度「次へ」をクリック。

Dリンク先を指定する画面で、「選択」のボタンをクリックし、「ファイルから」(または最近編集したファイルから)→sub5.htmlを選択して「開く」をクリック

E最後に「完了」をクリックします。


いかがでしょうか? 携帯サイト作成、楽しいですよね! さあ、あなたも、今日から携帯サイトの達人になり、お客様やお友達とのコミュニケーションをワンランクアップしてみましょう!
 あっこ先生もがんばりまーす!! 次はより高度なテクニックをご紹介しますので、乞ご期待ください。
ではそれまで頑張ってくださいね!!


前へ次へ


他のページへのリンク

1.携帯サイト変換サービス「MSC」の申し込みをする
2.ホームページ・ビルダー14以降で携帯サイトを作成する@
3.作成したサイトをMSCに転送する
4.転送した結果を確認する
5.実際に携帯端末で見てみよう!
6.ホームページ・ビルダー14以降で携帯サイトを作成するA
7.携帯版のGoogleマップを貼り付ける
8.パソコンと共通のURLを設定する(独自ドメインをお持ちの方向け)
9.スマートフォンでもサイトをキレイに表示する

トップへ戻る


(c)Ubiquitous Business Technology, Inc.