SIRIUSテンプレートの幅をカスタマイズする方法

こんにちは、ゆうぼうです。
今回は、ＳＩＲＩＵＳを私のサイトからご購入いただいた方から、テンプレートを購入しましたが、サイドメニューの幅が狭くて、販売したい広告を表示できないので、幅を広くできませんかという問い合わせをいただきましたので、その変更する方法をご紹介したいと思います。

 

テンプレートを変更する前の私のサイトです

 

今回は、２０１５年１０月に発売された「レスポンシブテンプレート（金融系）2カラム」に変更してみましょう

カスタマイズせずに変更したサイトがこちらです。
ヘッダー画像もサイドメニューの広告も途切れていますね。

 

カスタマイズしましょう

それでは、ＳＩＲＩＵＳＵのテンプレートをカスタマイズしていこうと思いますが、皆さんに気を付けていただきたいのが、カスタマイズはサポート対象になっていませんので、自己責任でやっていただくということです。
ですから、カスタマイズする前に、メモ帳などにコピーしてバックアップしておきましょう。

 

それでは、早速始めましょう。

操作画面の上部「テンプレート」→「スタイルシート編集」をクリックします。

 

「styles.css」→「レイアウト」の表示があるところを探します。

「width」と書かれているところに９１６ＰＸの表示がありますね。
これが、最初のサイトの横のサイズになります。
今回、私は１０００ＰＸに変更したいと思います。９１６の部分のみ変更しましょう。

 

次は、「トップメニュー」を表示があるところを探してください。

また、「width: 910px」の表示がありますので、ここも1000pxに変更します。

 

今度は、サイドメニューのサイズを変更します。

「width: 210px」を300にします。

 

変更後のサイトはこちらです。

サイドメニューの広告もしっかり表示されています。

 

スッキリしたテンプレートで、なかなかいいですね。
テンプレートによって、サイズが微妙に違ってますが、変更箇所は同じです。
まだ、本当は細かいところのカスタマイズが必要ですが、私はこの程度でもサイトに影響がないのでそのまま使用しています。

 

サイズ変更してみたい方はお試しください。
但し、自己責任ですから慎重にお願いします。

 

2018年のアップデートで横幅設定する機能が追加されました

以前は、自分でテンプレートをHTMLを編集してカスタマイズする必要がありましたが、現在は2018年のバージョンアップにより簡単にテンプレートの横幅を変更することが出来るようになりました。

 

 

参考になりましたでしょうか。
最後までお読みいただきありがとうございました。

 

SIRIUSのホームページはこちらです