HTMLタグを追記することで非表示化が可能です
目次
前提:ヘッダーメニューって?
![](https://lab.biiino.com/wp-content/uploads/2021/05/create-pctop_14121738.png)
ページ最上部に表示されます↑黄色枠箇所のメニューを指します。
本来はビーノシステム仕様上、固定で表示されるものとなりますが、フリースペースパーツへ非表示にするためのCSSを記載することにより店舗様側にて非表示化が可能です。
ただし、HTML/CSSの知識が必要となりますため、本記事ではヘッダーメニューの非表示化に絞ってHTMLタグの説明を記載致します。
ご注意: HTMLタグ等を使ったカスタマイズにつきましては、本来弊社サポート対象外となります。 恐れ入りますが、原則として店舗様ご責任にてご対応いただきますようお願い致します。
ご設定手順
1. CSSをコピーする
<style>
.c-header__menu {
display: none;
}
</style>
2. トップページの場合:フリースペースパーツで設定
1. 「パーツを追加する」をクリック
![「パーツを追加する」をクリック](https://images.tango.us/workflows/392ea6d3-c840-49e1-b7d9-94dcb2f0c998/steps/94f3f3fb-156e-4cb8-b74f-73c500922541/07e51f0a-d6c0-485b-bae7-ceaaa5636624.png?fm=png&crop=focalpoint&fit=crop&fp-x=0.0964&fp-y=0.1657&fp-z=2.0396&w=1200&mark-w=0.2&mark-pad=0&mark64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL21hZGUtd2l0aC10YW5nby13YXRlcm1hcmsucG5n&ar=1545%3A1174)
2. 「ヘッダー」をクリック
3. 「フリースペース」をクリック
![Step 3 screenshot](https://images.tango.us/workflows/235c76af-f5d3-4408-9a6a-a7cd63e60e71/steps/8cc8981a-a073-4155-8896-734cbd401fcc/ddb5cb84-680b-4932-a1c1-088ea35f9b43.png?crop=focalpoint&fit=crop&fp-x=0.0976&fp-y=0.3672&fp-z=1.8966&w=1200&blend-align=bottom&blend-mode=normal&blend-x=800&blend64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL21hZGUtd2l0aC10YW5nby13YXRlcm1hcmsucG5n&mark-x=36&mark-y=246&m64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL2JsYW5rLnBuZz9tYXNrPWNvcm5lcnMmYm9yZGVyPTglMkNGRjc0NDImdz0zNzImaD0zNzImZml0PWNyb3AmY29ybmVyLXJhZGl1cz0xMA%3D%3D)
4. 「編集エディタを開く」をクリック
5. 「< >」をクリック
6. コピーしたCSSを貼り付ける
![CSSを貼り付ける](https://images.tango.us/public/edited_image_70635d94-f5da-42c7-ad1f-1e30cf6817ec.png?fm=png&crop=focalpoint&fit=crop&fp-x=0.5000&fp-y=0.5000&fp-z=1.0000&w=1200&mark-w=0.2&mark-pad=0&mark64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL21hZGUtd2l0aC10YW5nby13YXRlcm1hcmsucG5n&ar=1760%3A958)
7. 「決定する」をクリック
![「決定する」をクリック](https://images.tango.us/public/edited_image_fd5fe7f1-8fc9-469d-9425-f893fab28f99.png?fm=png&crop=focalpoint&fit=crop&fp-x=0.5000&fp-y=0.5000&fp-z=1.0000&w=1200&mark-w=0.2&mark-pad=0&mark64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL21hZGUtd2l0aC10YW5nby13YXRlcm1hcmsucG5n&ar=1780%3A1180)
8. パーツ編集画面の「決定」をクリック
9. 「反映する」をクリック
ページの作成・反映を行っていただきますことで、看板画像が非表示化されるはずです!
⚠️システムの仕様上、管理画面では非表示にならず、反映後のページで非表示となります。
3. 特集ページの場合:「SEO/外部読み込みの設定」を使用
1. 「 SEO/外部読み込みの設定」をクリック
![Step 2 screenshot](https://images.tango.us/workflows/cf9ea8f4-93f7-4324-a36f-a42db8cb4369/steps/b1317bce-3638-4c57-92de-e5965901c146/51c04f13-0463-4195-8328-d981d20953b4.png?crop=focalpoint&fit=crop&fp-x=0.0978&fp-y=0.5060&fp-z=2.0051&w=1200&blend-align=bottom&blend-mode=normal&blend-x=800&blend64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL21hZGUtd2l0aC10YW5nby13YXRlcm1hcmsucG5n&mark-x=-4&mark-y=368&m64=aHR0cHM6Ly9pbWFnZXMudGFuZ28udXMvc3RhdGljL2JsYW5rLnBuZz9tYXNrPWNvcm5lcnMmYm9yZGVyPTglMkNGRjc0NDImdz00NzgmaD0xMjcmZml0PWNyb3AmY29ybmVyLXJhZGl1cz0xMA%3D%3D)
2. コピーしたCSSを貼り付ける
3. 「保存する」をクリック
4. 「反映する」をクリック
ページの作成・反映を行っていただきますことで、看板画像が非表示化されます。
⚠️システムの仕様上、プレビュー画面へ反映させるためにはページ反映が必要となります。
その他パーツの非表示化について
サポート対象外となります
恐れ入りますが、弊社カスタマーサポートにてHTML/CSSなどコードに関するご回答はできかねますため、店舗様ご自身にてブラウザの検証モードなどをご利用いただき、ご対応いただきますようお願い致します。