特定のページのサイドバーを消したい

一言で言うと簡単ですね まっ簡単なんですけど問題もあります。

テンプレートって、作るデザインによって、仕様が異なるわけですね。

また、サイトバーとひとくくりにしていますが、実際にはサイドバー側に、ナビゲーションを加えてしまっているデザインがある。ランディングページなどを作成したい場合は、それこそ、サイドバーだけでなく、コンテンツの部分を残して、ヘッダからナビゲーションまで全部消さなければならない時だってあります。それは、さすがにこのTipsでは取り上げません。

出来ないかといわれれば出来ますよ?

でも、それはプロの仕事です。

一応、動作確認済みのテンプレート一覧 少ないよぉ?!

●Amsterdam Bordeaux Florence Helshinki Hong Kong MadridSan  FranciscVerona


サイドバーをサイドバーとして利用が出来ているテンプレートは以上です。

イメージとしてはこんな感じになります

特定のページから、サイドバーを外します。
サイドバーのスペース分を、コンテンツを広げることでカバーします。

3つのステップ

Step1 特定のページを調べる

特定のページを指定する方法は、大まかに分けると2通りあります。


Jimdo Proなど有料バージョンを使っている場合

設定>ヘッダー部分を編集>個別記事またはブログ記事>特定のページを選択

※この部分に後述するCSSを保存するだけです。

やはりJimdo Pro(有料版)は便利ですねぇ~。

Jimdo Freeを使っている場合

ページのHTMLをチェックしてページIDを調べる方法

編集画面からログアウト(またはプレビューでもオッケー)
右クリックやブラウザーのメニューからページのソースを選択します。

<BODY から始まるタグを見つけてページ毎のIDを見つけます!
<body class="body cc-page cc-page-index" id="page-2333099488">

ページID = page-2333099488

 

Step2 サイドバーを消す

■ Jimdoの有料バージョンを使っている場合

<style type="text/css">    

aside { display : none; }

</style>

■無料バージョンを使っている場合
body#page-2333099488 aside{ display:none; }
上記で取得したページIDを頭に追加します。
body# + 
page-2333099488 → ここに追加!

Step3 コンテンツ領域を広げる

Jimdoの有料バージョンを使っている場合

<style type="text/css">    

.cc-content-parent { width : 98%;} /* この98%というのは、大まかな数字です。 */

</style>

■無料バージョンを使っている場合

<style type="text/css">    

body#page-2333099488 .cc-content-parent { width : 98%;} 

</style>


▼ タグの貼り付け方はここ マウスを当てると画像が開きます。

どうしてもうまく行かないなどの時には、弊社がお客様のホームページにログインさせていただき設定をいたします。有料にてご対応。(1ページあたり5,000円/ログイン調査費用も含む)

この記事がいいなと思ったらメールマガジンに登録していただけると嬉しいです。
メールアドレスを入力して登録ボタンを押してください。

コメントをお書きください

コメント: 4
  • #1

    BIGマン (月曜日, 03 8月 2015 00:18)

    なるほど。ありがとうございます。
    でも、非対応テンプレートを使ってました(泣)
    ヘッダーは消せたりするんですか?

  • #2

    PIK 村井 (火曜日, 11 8月 2015 16:59)

    BIGマンさん

    もちろん、特定ページのヘッダを消すことも可能です。

  • #3

    ひろゆき (火曜日, 05 4月 2016 22:03)

    教えていただいた方法で実施いたしましたが、
    ヘッダーおよびナビゲーションも広がりスタイルが崩れてしまいます。
    content部分のみ全体表示したいのですが、有料プラン(5000円)
    ではそれは可能でしょうか?
    恐れ入りますが、ご教授いただければ幸いです。

  • #4

    ひろゆき (火曜日, 05 4月 2016 22:09)

    再投稿失礼いたします。
    崩れたページをリンクさせていただきますので、コメント頂戴出来れば幸いです。

株式会社 PIK

〒108-0075 港区港南3-4-12

TEL.03-6433-0422