SANGOでヘッダーやフッダーなどを非表示にする方法

SANGOでヘッダーやフッダーなどを非表示にする方法
2019年6月18日
WordPress
スポンサーリンク

こんにちは!

今回はSANGOでヘッダーやフッダーなどのコンテンツをすべて非表示にして、完全に真っ白なキャンバスにする方法を伝授します!!

[box class=”box27″ title=”注意”]

この記事はりーむがやりたいカスタマイズがあって調べて組み合わせたりして、たまたまできたようなカスタマイズです。

もっとちゃんとしたやり方があるかもしれないし、不具合が出るかもしれないので、自己責任でお願いします。責任は一切取れません。

多分今回は特にそうだと思います笑

[/box]

完全に真っ白なキャンバスにしたい

WordPressでヘッダーやフッダーなどのデフォルトでついているものを全部消して完全に真っ白なキャンバスみたいにして自由にやりたいと思ってやってみました!

やり方

まず必ず「固定ページ」で新規作成→投稿の属性からテンプレートを「トップページ用1カラム(タイトルなど出力無し)」にします

※真っ白なキャンバスにするんじゃなかったら投稿とかからでも使えると思います

サイト全体を真っ白なキャンバスにする

外観テーマエディタstyle.cssにいって下記のコードをコピペしてください。
[codebox title=”CSS”]

.header,.header-info,.footer {
  display:none;
}
[/codebox]

これだけで完了です!

一ページのみ真っ白なキャンバスにする 推奨

一ページのみに適用させたい場合は、「Per page add to head」というプラグインを使うのをおすすめします

このプラグインは、ページごとにCSSを追加できるので、超便利です。使い方は下記サイトがわかりやすいです

[sanko href=”https://for-men.jp/per-page/” title=”ページごとにCSSを追加できるプラグイン” site=”for men”]

このプラグインを入れれたら、編集画面に「Add to head」という枠がでてくるのでそこに下記コードを入力してください。
[codebox title=”CSS”]

.header,.header-info,.footer {
  display:none;
}
[/codebox]

※<style>~</style>で挟んでください

これでできたとおもいます!

完成!

完成するとヘッダー、ヘッダーお知らせ欄、フッダーが非表示なります!!
サンプルページ

参考にさせていただいたサイト

[sanko href=”https://teratail.com/questions/125244” title=”特定ページでヘッダー、フッターを非表示にしたいです。” site=”teratail”]

↑これをSANGOバージョンに変えました。

追記 コードを短くしました

0