PROFILE
| 見出し | ここに説明など入れて下さい。サンプルテキスト。 |
|---|---|
| 見出し | ここに説明など入れて下さい。サンプルテキスト。 |
| 見出し | ここに説明など入れて下さい。サンプルテキスト。 |
| 見出し | ここに説明など入れて下さい。サンプルテキスト。 |
| 見出し | ここに説明など入れて下さい。サンプルテキスト。 |
テンプレートのご利用前に必ずお読み下さい
利用規約のご案内
このテンプレートは、Template Partyにて無料配布している『ギャラリー・ポートフォリオ向け 無料ホームページテンプレート tp_biz52_re（biz52のリメイク版）』です。必ずダウンロード先のサイトの利用規約をご一読の上でご利用下さい。
HP最下部の著作表示『Web Design:Template-Party』は無断で削除しないで下さい。
わざと見えなく加工する事も禁止です。
下部の著作を外したい場合は
Template-Partyのライセンス契約を行う事でHP下部の著作を外す事ができます。
当テンプレートの詳しい使い方は
無料CMS（Template Party CMS）のご案内
誰でも簡単にホームページを作れる無料CMS（ノーコードツール）を配布中です。
管理画面で使いたいパーツを選ぶと、自動で入力フォームが出現しますので、あとはテキスト入力＆画像をドラッグ＆ドロップするだけで、サイトが完成します。
もちろんWEB業者様のご利用も無料（※当サイトのテンプレがベースの場合）。クライアント向けにご活用下さい。
無料素材サイト（haconana）のご案内
写真・イラスト・動画のフリー素材サイトです。ユーザー登録を行うと、１日１点まで無料でDLできます。
当テンプレートの使い方
titleタグの設定はとても重要です。念入りにワードを選んで適切に入力しましょう。
まず、htmlソースが見れる状態にして、
<title>ギャラリー・ポートフォリオ向け 無料ホームページテンプレート tp_biz52_re</title>
を編集しましょう。
あなたのホームページ名が「サンプルギャラリー」だとすれば、
<title>サンプルギャラリー</title>
とすればＯＫです。SEO対策もするなら冒頭に重要なワードを入れておきましょう。
copyrightを変更しましょう。
続いてhtmlの下の方にある、
Copyright© あなたのサイト名 All Rights Reserved.
の部分もあなたのサイト名に変更します。
metaタグを変更しましょう。
htmlソースが見える状態にしてmetaタグを変更しましょう。
ソースの上の方に、
content="ここにサイト説明を入れます"
という部分がありますので、テキストをサイトの説明文に入れ替えます。検索結果の文面に使われる場合もありますので、見た人が来訪したくなるような説明文を簡潔に書きましょう。
h1ロゴのaltタグも変更しましょう。
html側に、
alt="あなたのサイト名"
となっている箇所があるので、この部分もあなたのサイト名に変更しましょう。
アイコン画像について（Font Awesomeの解説）
imagesフォルダに入っていない画像（アイコン）は全てFont Awesomeの素材です。
Font Awesome 公式サイト
Font Awesome アイコン一覧
iタグを使ってhtmlに直接アイコンを読み込む場合と、cssの擬似要素を使って読み込む場合があります。
それぞれ他のアイコンに置き換えたい場合は、当サイトのマニュアルをお読み下さい。
Font Awesomeを使う為に必要なタグ、ファイル類。
cssフォルダのstyle.css冒頭で読み込んでいる「Font Awesomeの読み込み」のブロック。
何年も経過した場合、動作に問題が出てくる可能性があります。
テンプレートを編集していないのに突然動きがおかしくなった場合は、style.cssの冒頭でCDNから読み込んでいるFont Awesome関連のファイルのバージョンを変更して動作するか確認してみて下さい。
左メニューについて
一番上のロゴ画像以外のアイコンも全てFont Awesomeの素材です。
Font Awesome 公式サイト
Font Awesome アイコン一覧
メニューでは、html側に直接i要素を配置しています。お好みで入れ替えて下さい。
トップページのスライドショーの解説
画像の追加方法
現状、３枚構成ですが４枚目を追加したい場合、３枚目のブロックをコピペし、slide3をslide4に変更。
続いて、cssフォルダのslide.cssを開き、3枚目画像のブロック（.slide3）をコピペして４枚目用に書き換えて下さい。
ウィンドウが横向きか縦向きかで異なる画像を配置したい場合や、拡大率を変更したい場合もslide.cssで調整できます。スライドの表示時間はjsフォルダのmain.js内の「スライドショー」ブロックで行います。
トップページ以外の背景画像
html側のbody要素にidで個別に名前をつけて、そこで背景画像を指定しています。
背景画像は、cssフォルダのstyle.cssから「各ページの背景画像」でテキスト検索すると出てきます。
当ページだと、<body id="profile">となっているので、cssのbody#profile::beforeで指定している背景画像が読み込まれます。
文字を読みやすくするため、本来の背景画像より暗くなっています。この調整も同じブロック内にあります。0, 0, 0, 0.5と２箇所ある部分ですが、0,0,0は黒のことで0.5は色が50%出た状態です。もっと暗くしたければ70%や80%などにすればOK。
ul、ol要素
- これはol要素です。サンプルテキスト。
- これはol要素です。サンプルテキスト。
- これはol要素です。サンプルテキスト。
- これはul要素です。サンプルテキスト。
- これはul要素です。サンプルテキスト。
- これはul要素です。サンプルテキスト。