TOP

レイアウトを変えるカスタマイズ

シリウスの2カラムサイドメニュー構成を デフォルトよりカスタマイズして
横幅を拡張した際は 表現方法の範囲が大きくなります

 

デフォルトでも充分に解り易く良いスタイルですが それだけでは不満と
するならブログみたいな配置へカスタマイズすることが簡単にできるのですね

 

 

 

対応は デフォルト2カラムですすめます

 

 

トップページでのみの解説となります

 

カテゴリーメニュー非表示 フリースペースでメニュー表示

 

デフォフォルトのサイトメニューは 何もしなければ通常表示されますが
横幅を延長したことで 解り易いが デザインとしてみるなら イマイチ
と評価する方は

 

 

サイトメニューを非表示として カテゴリーメニューのみを
フリースペースで表示する ことが出来ます

 

ただし ページ追加ごとにフリースペースでメニューを作成する
作業が追加されます

 

Wプレスなら毎度のことですが?

 

サイトメニューを非表示にするには
HTMLテンプレート内で

 

<% siteMenu %>
<% subMenu %>

を削除すれば非表示となります

 

<!-- ★メインコンテンツここまで★ -->

 

<!-- ★サイドメニューここから★ -->
<div id="menu">
<% freeSpace3 %>

 

<% siteMenu %>
<% subMenu %>

 

<% freeSpace4 %>
</div>
<!-- ★サイドメニューここまで★ -->

 

 

トップページでは
<% siteMenu %>
<% subMenu %>

を非表示としても カテゴリー以下階層では 通常に表示されます

 

全てをフリースペースで表示するならカテゴリー以下階層でも
同作業を行います

 

ですが 下層では通常表示のサイトも多く見かけます事も?

 

 

スポンサーリンク

 

 

スタイルなしを選択

 

ブログみたいに見せるなら フリースペースのスタイル指定は
スタイルなしを選びましょう

 

 

リバースメニュー

 

当サイトはサイドメニューを縦2列のリバースメニューにしておりますが

 

メニュー幅を拡張した際は レイアウト枠を使うことで縦2列の
配置も可能です

 

然し せっかくの構成なのですから すべて2列配置にしなくとも?

 

また すべてをサイズいっぱいの広告屋テキストにせずとも?

 

です

 

何れかの段落では サイトメニュー幅いっぱいの広告や画像でも

 

以下か 上記かにレイアウト枠を配置すれば

 

ヤフーのトップページの右メニューみたいな構築できますね

 

参考とびリンク
http://www.yahoo.co.jp/

 

 

構築の際は レスポンシブ作動ではどのように反映されるかも
確認しながら調整します

 

また
ナイスなサイドメニューをつくるなら あちこちサイト探検して
良い構築を参考にしましょう

 

トップページのみをレイアウト替えした際のカスタマイズ色々
SIRIUS シリウスレスポンシブデザインテンプレート公開
シリウスカスタマイズ

トップページのみをレイアウト替えした際のカスタマイズ色々関連解説
サイトをレスポンシブウェブ化カスタマイズする今事情
SIRIUS シリウスサイトをレスポンシブウェブ化としてカスタマイズする事は今や避けることは出来ない今事情があります..その訳は
レスポンシブウェブデザイン設定事情を理解しよう
シリウスへレスポンシブウェブデザインを設定するカスタマイズは 特有の構造でもあり 充分にCSSを理解する必要がございます 当サイトのレスポンシブウェブ事情をご確認下さい
レスポンシブウェブデザイン変更前の説明
SIRIUS シリウスサイトをレスポンシブデザインへ変更前のご注意ごとです デフォルトテンプレートカスタマイズをそのまま変更すると画面縮小の際 障害になるものがありますのでご説明します
レスポンシブウェブデザインカスタマイズのレイアウト変更値
シリウスへレスポンシブウェブデザインを導入後 リキッドレイアウト変更値は どの位置でどのように変化するか また レイアウトを複合化する2重構造をcss指定値カスタマイズを含めて複数解説します
ヘッダー画像をレスポンシブウェブ構造で作動させる方法
シリウスへレスポンシブウェブデザインを追加構築してもヘッダー画像だけがレスポンシブ化作動不能という場合は こちらのサイト解説を参考にしてください 取り合えずは伸縮致します
ヘッダー画像をレスポンシブウェブでは切り替え表示する方法
シリウスのヘッダー画像をレスポンシブウェブサイト構造追加後 スマートフォンで閲覧の際 別画像を表示する手順を」ご案内いたしております
デフォルト一カラムレスポンシブウェブデザイン設定
シリウスデフォルト一カラムテンプレートへレスポンシブウェブデザイン構築を追加する事は 2カラム同様簡単に設定ができます
2カラムテンプレート レスポンシブデザイン設定方法
SIRIUS シリウス2テンプレートへサイト内構成が 伸縮化変する全てのデバイスに対応可能なレスポンシブウェブデザインを設定追加するカスタマイズ方法のご案内です 作業は2分で終了
3カラムテンプレート レスポンシブウェブデザイン追加方法
SIRIUS シリウス3カラムテンプレートへレスポンシブウェブデザイン設定を追加するカスタマイズ手順をご案内しております... 検証済み 面倒はありませんよ
2カラムのトップとカテゴリー以下のレイアウトを変えたレスポンシブ
SIRIUS シリウスサイト2カラムをトップページとカテゴリー以下でレイアウトサイズを異なるスタイルで表現する2段階表示のレスポンシブデザインのカスタマイズの解説です
レスポンシブサイトの見出しメニューを調整するカスタマイズ
シリウスのレスポンシブウェブデザインサイトでは 機能を確認すると稼働後 見出しメニューにつなぎ目が見られますが 画像フォルダを編集すれば解消することが出来ます
レスポンシブウェブデザイン公開ではiPhoneサイト設定も必要
シリウスをレスポンシブウェブデザインとして公開するに至り iPhoneサイト設定も必要ということが判明しましたのでお知らせいたします