サイトタイトルを非表示にしよう

こんにちわわわん∪･ω･∪

今日は、『ホームページのサイトタイトルを非表示にする』です。

シンプリシティでは、サイトのタイトルは左側に表示されていると思います。

スタイルシートにCSSを追加してあげるだけで、サイトのタイトルが非表示になったり

左右上下に移動したりすることが可能になりますよ！

こんな時に便利☝️

☝️１　ヘッター画像は、オリジナルで作りたい。

☝️２　サイトタイトルもオリジナルで作りたい。

☝️３　サイトタイトルはデフォルトのままでいけど、左右上下移動したい。

私も、ヘッター画像は写真を加工してオリジナルで作っています。

当然、タイトルも写真を加工する際に一緒に作っているので、

シンプリシティでのタイトルは非表示になっています。

※ヘッターとは、ページの上下にある余白部分の事です。
上、ヘッドなのでヘッダー。下、フットなのでフッター。です。

はじめに

♯１　タイトルを非表示にするのは、スタイルシートのCSSで操作します。

♯２　ダッシュボード内にある外観⇨ヘッター⇨サイト基本情報では、サイトタイトルは通常どおり記入します。

※スタイルシートとは、CSSを用いてホームページのデザインを一括で細かく設定する事が出来るページ？シート？の事を指しています。
CSS（カスケーディングスタイルシートの略）では、ホームページ上の細かい設定を一括で行います。
例えば、記事で説明すると、HTMLと違うのは、HTMLでは記事一枚に対してのカスタムを行ったりする際に使用します。その記事一枚に対してなので、他の記事には反映されません。
CSSは、ホームページ上の全ての記事に反映させる事が出来ます。

ホームページのタイトルを記入しよう

①→②→③

①ダッシュボード、②外観、③カスタマイズを選択していきます。

サイト基本情報の項目を選択します。

赤枠内にサイトタイトルを記入してください。

記入後にホームページを更新すると、ヘッダーにタイトルが表示されると思います。

このタイトル表示の仕方は、シンプリシティのデフォルトとなっていて、

シンプリシティでのカスタマイズで左右前後に移動することは出来ません。

シンプリシティのスタイルシートにCSSを追加する事で

タイトルをカスタマイズしていきます。

（カスタマイズ出来たらゴメンなさい^^;　勉強不足です）

※デフォルトとは、あらかじめされている設定の事です。

スタイルシートにCSSを追加しよう

①→②→③

①ダッシュボード→②外観→③テーマの編集を選択していきます。

テーマの編集を選択すると、シンプリシティのスタイルシートのページが表示されます。

スタイルシートのページが選択されていますが、

写真右の赤枠内がスタイルシートとなっていますので、

念のためそちらを選択してスタイルシートのページにしてもOKです。

このスタイルシートに、CSSを直接記入するかコピーして貼り付けてください。

#site-title, #site-description {
display: none;
}

上記のCSSがホームページのタイトルを非表示にするものとなります。

記入もしくは貼り付けが完了したら、

下にあるファイルを更新をクリックします。

以上で、ホームページ上のタイトルが非表示になります。

こちらのスタイルシートに様々なCSSを追加する事でタイトル表示の

カスタマイズが可能になりますよ(^^)

ちなみに

タイトルを非表示では無く上下左右に移動させたい場合についてです。