パーツを使いカスタマイズ

最短ホームページテンプレートの使い方8 パーツを使いカスタマイズ

今回はパーツを使いカスタマイズしていきます。
最短ホームページテンプレートの動画の、第8回の部分になります。

カスタマイズに使えるパーツは豊富

最短ホームページテンプレートの良い点の1つとして、
パーツテンプレートがあることだと思います。

ホームページはパーツの組み合わせで自由にカスタマイズできるので
このパーツ集がホームページ作成には非常に役立つわけです。

パーツは実にたくさん用意してありますので、
そのパーツのソースをコピー&ペーストしていくだけです。
では、少しパーツを紹介しますね。

二重線の枠を表示するパーツ
二重線の枠を表示するパーツ

コンテンツバーのパーツ
コンテンツバーのパーツ

商品の説明に活用できるパーツ
商品の説明に活用できるパーツ

細かい間隔 (幅) を設定するパーツや料金表など
とても全てが紹介できないぐらい、パーツはたくさんありますし…

このパーツ1つ、1つの使い方が全て動画で解説されていますので
初めての方も安心して使えますよ。

パーツをコピペしてカスタマイズしてみる

今回は例としてトップページをカスタマイズするので、
まず、index.htmlのファイルをテキストエディタにドラッグ&ドロップします。
※無料テキストエディタTerapad(テラパッド)を利用
index.htmlを、テラパッドに、ドラッグ&ドロップします。

情報、その3の部分に料金表を入れてみます。
情報、その3の部分に料金表を入れてみます。

index.htmlファイルを開いたら、下記にパーツを入れます。
index.htmlファイルを開いたら、下記にパーツを入れます

パーツテンプレート集の、料金表パーツへ行き、
好みの色のパーツのソースを全てコピーします。
好みの色のパーツのソースを全てコピーします。

そしてコピーしたソースを
先程のindex.htmlの中の、その3部分に貼り付けます。
そしてコピーしたソースを 先程のindex.htmlの中の、その3部分に貼り付けます。

変更したら保存します。
保存方法は、ファイル⇒ 上書き保存で保存できます。

【ワンポイント】
保存は、ファイル⇒上書き保存としなくても、
キーボードのCtrl + s のショートカットキーを使い保存できます。
このCtrl + s での保存は、めちゃくちゃ使えますので、
こちらの保存方法を癖にしましょう。

保存が終わったら、更新ボタンを押して
編集した部分が変更されているか確認してみて下さい。

今回の編集でこのように変更されていればOKです。
今回の編集でこのように変更されていればOKです。

このカスタマイズ方法と、文章や画像を駆使して
ホームページ全体の構成を作っていきます。

 ➡ 最初はコピーしペーストすることも遅い
 ➡ 編集するソースを探すのも時間が掛かる
 ➡ 間違えて、少しパニック

不慣れな時は、少し大変に感じるかも知れませんが…
やればやるほど慣れますので、めげずに進めて下さいね。

全く違う雰囲気のサイトも慣れれば数分で!

最短ホームページテンプレートでのホームページ作りの基本は、
コピー&ペーストの繰り返しになります。

しかし今回のパーツ紹介でもわかるよう
とても簡単に雰囲気を変えることもできます。

例えば、こうしたデザインに変更するのも難しくないです。
慣れれば、こうしたカスタマイズも数分で出来ちゃいます。
こうしたカスタマイズも数分で出来ちゃいます

【ワンポイント】
改行と空白を入れるパーツや、 文字の色を変更するパーツなど
よく使うものは、辞書ツールに登録しておくのが良いです。
Windowsの場合、IME辞書ツールが最初から入っていると思うので
それを使っても良いですし、Google日本語入力などを利用してもOKです。

ここまでの8回の動画を見て作業して頂ければ
最短ホームページテンプレートで基本のホームページ作りは出来ますので
あとは、他のページを編集していきます。

 レンタルサーバーの借り方やお問い合わせフォームを設定する手順は、
また違う記事に書かせて頂きます。

とにかく、ここまでが非常に重要な基礎になり
何度もやっていればソースを見ることも、ショートカットキーを使うのもかなり慣れ、
驚くほど作業はスピードも早くなります。

「習うより慣れろ」という感じですが…
そうして身につけたスキルは、ずっと役立ちますよ。

 

 


関連記事


初心者さんおすすめ! 徹底比較 簡単ホームページ作成ソフトランキング


おすすめ記事


ボタンマルシェ - ButtonMarche

人気の記事

  1. スマホに対応しているホームページ作成ソフトは?
  2. ムームードメインで取得のドメインをさくらで使う設定方法
    ムームードメインで取得のドメインをさくらで使う設定方法
  3. 実際に体験したシリウスでのトラブル
  4. 本当の初心者でも作れる簡単なホームページ作成ソフトは?
    本当の初心者でも作れる簡単なホームページ作成ソフトは?
  5. わからないことを解決する検索力を鍛えよう
    わからないことを解決する検索力を鍛えよう

ピックアップ記事

  1. SIRIUS(シリウス)の購入を決めた時の最終チェック

    SIRIUS(シリウス)の購入を決めた時の最終チェック

    当サイトを見ている方の中には どのホームページ作成ソフトにするか90%ぐらい決めた方もいると思います…
  2. WordPressのテーマは無料・有料どちらを選ぶべきか?

    WordPressのテーマは無料・有料どちらを選ぶべきか?

    WordPressを使う方にとっては、 テーマ選びは非常に重要な要素の一つです。基本ワードプレスは無…
  3. 私がホームページ作成ソフトを買って「失敗した」と思ったこと

    私がホームページ作成ソフトを買って「失敗した」と思ったこと

    これからホームページ作りを考えている方に向けて、 1つの経験談をお伝えしようかと思います。も…
  4. 人のレビューや口コミが正しいとは限らないという問題

    人のレビューや口コミが正しいとは限らないという問題

    これからホームページを作成しようとしている方は、 少なからず検索エンジンで、口コミや評判を見て検討し…
  5. ムームードメインで取得のドメインをさくらで使う設定方法

    ムームードメインで取得のドメインをさくらで使う設定方法

    最短ホームページテンプレートの動画から少し外れますが 今回はムームードメインで取得したドメインをさく…