パソコンお勉強TOP
パソコン勉強記録

 パソコンのお勉強  フォットモーション
(スライドショー作成)
 フォットモーション
(カルーセル作成)
  ■文字の背景に色付けする
 ■リンクに背景・文字色変更 ■FC2カウンタが表示されない ■メニューバーのリセット  
       
       
 大工さんの修行  自作パソコン作ろう  Gmsil  Yahoo

このページは主にホームページビルダーでの作成した覚えです。
我流勉強なので設定する遠回りや間違いもあるかもです。

フォットモーションフォットモーション作成種類には「スライドショー」・「ギャラりー」・「カルーセル」・「ズーム」等があるが作成方法は、ほぼ同じなので
まずはスライドーを詳しく勉強しま。
※フォットモーションーは各、ページに1個、複数は作成できません
フォットモーションスライドショー作成
 スライドショー作成画面←スタート拡大画面スライドショー設定作成←設定拡大画面ホームページビルダー画像編集ソフト←「Webart」拡大画面

★・まずはフォットモーション(スライドショー)作製用の画像を用意する画像加工ソフト「Webart」アプリで編集します、今回600ピクセル×450ピクセルで3枚加工してみました。(トップページに乗せる場合は600×450位に5枚程度作ると見栄えが良い。)
保存はホットモーション専用のフォルダーを作ると解りやすいです今回「fotomo-syon」)のフォルダーを作成した。
※画像は素材集からでも画像は簡単に出せるが任意向きではない。
★ホームページビルダー作成画面の左記画像のようにフォットモーション作成画面から始める。
フォットモーション(スライドショー)とはホームページビルダーで比較的大きな動く画像を作成する事ができるのでページの見栄えが良くなる。

以下・左記の画像参照で作成する。
画像@・・・左画像のフォットモーション(スライドショー)クリックして作成する画像を選ぶ(必要枚数を何度も同じ工程で)次へ進む
画像A・・・作成するの画像の枚数確認(画像を次ぎ、次ぎ選択していきます。並べ位置変えの移動はスライドする)次へすすむ
画像B・・・今回はノーマル設定にして・・・下のカスタム設定ボタンクリック・・・次へ進む
画像C・・・表示画像の大きさや切り替わり作動時間のなどを設定する・・・次へ進むと動画の作成画面が表示る。戻って編集可能。
保存する
左記に作成した「fotomo-syon」フォルダーを確認して、複数ファイルを全て指定して保存ボタンでフォットモーション(スライドショー)は終了
★転送前に出来栄えと動きをプレビューやプラザ確認(ビルダーで確認で来る)を試してから転送すると失敗がない。
★ファイル転送は「fotomo-syon」(スライドショー保存したフォルダー)と、これを作成したHTMLページをサーバーに転送します。
★作成の表画面は非表示にしています。(表の枠を赤にしたら、左クリック「表の枠を非表示」タップします。)
 スライドショーの出来上がり 400×350の3枚画像で作成しました。
 横にスライドするカルーセルカルーセル(テッカー作動)このプログラムがないと動かない
このカルーセルには2通りの動かし方がある。@スライドショー(指定した枚数を自動的にスライドさせる)
Aテッカー(スライドショーと同じだが画像が流れるようにスライドしていく。)
作成順は上のフォットモーション(スライドショー)と、ほぼ同じ工程なので説明は省く。
★挿入作成画像の大きさが違っていても大丈夫、保存時調整されます。
保存する
左記に作成した「karuseru」フォルダーを確認して、複数ファイルを全て指定して保存ボタンでフォットモーション(カルセール)は終了
★ファイル転送はkaruseru」フォルダーと、これを作成したHTMLファイルを転送します。.
その他に「ギャラリー」や「ズーム」の作成もできるが私のホームページではお勧めでない。

■アクセスカウンタが表示されない
ホームページビルダーの転送ファイルで転送すると、」FC2のカウンターが表示されない問題の取り合えず解決法を
考えました。以下の画像参照。
FC2ホームページの場合y→FC2ホームページカウンターFC2ホームページLiteの場合→FC2ホームページLiteカウンター表示もっと簡単な方法があるかもしれないが今のところ無いので「FC2のサーバー」のファイルマネージャーから転送方法を使ってカンター表示させています。

■ホームページ作成文字に蛍光ペンのようにマーカーを塗る&文字に色を付ける
塗りたい文字列をドラッグして選択する→メニューの挿入→その他→HTMLタグ→[タグ挿入画面]でタグ:SPANを選択→[挿入]ボタンをクリック→[スタイルの設定]→[色と背景タブ]→背景色:黄色(例)を選択→[OK]→[タグ挿入画面]を[閉じる]
以下はテストで色付けしてみました。(こんなプログラムを取り入れて文章を目立たせたい箇所にアピールできます。)
★背景にマーカーで塗ったいぇうなサンプル・・・
テスト(1)で背景色を黄色設定するとこんな感じです
★背景色と文字色を選択した例・・・
テスト(2)で背景色を緑の設定し文字色を白色に設定するとこんな感じです
■リンク文字に背景色やリンク文字の色を変える(リンクのあるところにマウスを当てた時)
まず設定場所にリンク挿入→表示タブから「スタイルシートマネージャー」→表示タブから「スタイルシートマネージャー」→追加タブ→下のスタイル→画像A、Bを設定し→色と追加タブ→画面右側が背景/左側が文字色の設定したら全てOKで閉じ、作動確認後上書き保存保存します。
※その他、マウスオーバー時、タグ候補を変えてリンク下線を消したり太文字、斜体文字にできみたいだが、ちょっと難しい。

 ■ホームページビルダー・メニューバーをリセットするには・・・
「標準モード」「どこでも配置モード」のツールバーのリセットする。
タスクバー右クリック→ユーザー定義の設定→メニューバーのリセットタブ・・・画像参照
※タスクバーに異常があったり編になった時に行う。
 
 
TOP