Company

東京都新宿区歌舞伎町三宮神社ビル3F
電話番号 03-0000-0000
営業時間 11:00〜19:00
定休日 水曜日

Follow Us

© sitename

「フッター」ブロックについて

<!--▼▼▼▼▼ここから「フッター」-->
<footer>

<div class="text">

<div>
<h4>Company</h4>
<p>東京都新宿区歌舞伎町三宮神社ビル3F<br>
電話番号  03-0000-0000<br>
営業時間  11:00〜19:00<br>
定休日 水曜日</p>
</div>

<div>
<h4>Follow Us</h4>
<ul class="icons">
<li><a href="#"><i class="fa-brands fa-x-twitter"></i></a></li>
<li><a href="#"><i class="fab fa-line"></i></a></li>
<li><a href="#"><i class="fab fa-youtube"></i></a></li>
<li><a href="#"><i class="fab fa-instagram"></i></a></li>
</ul>
</div>

</div>

<div class="image">
<p class="logo"><img src="images/logo_kazari.svg" alt=""></p>
<small>&copy; sitename</small>
</div>

</footer>
<!--▲▲▲▲▲ここまで「フッター」-->

主なスタイルは

cssフォルダのstyle.cssから「footer」でテキスト検索してみて下さい。詳しい解説もあります。

class="text"

CompanyやFollow Usなどのテキストはこのブロック内に入れて下さい。
textブロック直下のブロック同士は横並びになります。この場合は、CompanyとFollow Usがよこ並びになります。

class="icons"

Font Awesomeのアイコンを入れるブロックです。

Font Awesome 公式サイト
Font Awesome アイコン一覧(※バージョン6)

iタグを使ってhtmlに直接アイコンを読み込む場合と、cssの擬似要素を使って読み込む場合があります。
このテンプレートでは、アイコンはi要素でhtmlに直接配置されています。
それぞれ他のアイコンに置き換えたい場合は、当サイトのマニュアルをお読み下さい。

class="image"

ロゴ画像とサイトのコピーライトを入れるボックスです。

sitename

の部分はあなたのサイト名に入れ替えて下さい。