ページ全体の構成変更
動作確認環境： EC-Cube 2.1.2
対象ファイル： /data/Smarty/template/default/site_main.tpl
難易度：★★★☆☆
ページ出力順序の変更
EC-Cubeの初期状態では、ページの出力順序が普通に左から順に出力されます。
これをSEO対策のひとつとして、メインカラム、左カラム、右カラムの順に出力するように変更します。
なお、html上だけではなく実際にはcss側で表示位置の制御が必要となりますので、ご注意ください。
下記サンプルはヘッダの後からの書き方です。
<!--{* ▼CONTENTS *}-->
<div id="container">
<!--{* ▼CENTER COLUMN *}-->
<!--{if $tpl_column_num == 3}-->
<div id="wrapper">
<div id="main">
<!--{elseif $tpl_column_num == 2}-->
<div id="mainwide">
<!--{elseif $tpl_column_num == 1}-->
<div id="mainall">
<!--{/if}-->
[ここにメイン上部からメイン下部までを入れます]
</div>
<!--{* ▲CENTER COLUMN *}-->
<!--{* ▼LEFT COLUMN *}-->
<!--{if $arrPageLayout.LeftNavi|@count > 0}-->
<div id="left">
[ここに左ナビを入れます]
</div>
<!--{if $tpl_column_num == 3}--></div><!--{/if}-->
<!--{/if}-->
<!--{* ▲LEFT COLUMN *}-->
<!--{* ▼RIGHT COLUMN *}-->
<!--{if $arrPageLayout.RightNavi|@count > 0}-->
<div id="right">
[ここに右ナビを入れます]
</div>
<!--{/if}-->
<!--{* ▲RIGHT COLUMN *}-->
<div style="clear: both;"> </div>
<!--{* ▲CONTENTS *}-->
ちなみに、上記例ではcssは以下のようになります。
cssは管理画面のデザイン管理→css編集からカスタマイズ可能です。
#wrapper{
float: left;
width: 598px;
}
#wrapper #main{
float: right;
width: 432px;
padding: 15px 0 0 0;
}
#left{
float: left;
width: 166px;
}
#right{
float: left;
width: 166px;
}
#mainwide{
float: right;
width: 598px;
padding: 15px 0 0 0;
}
#mainall{
padding: 10px 0 0 0;
}
本サンプルでは初期テンプレートと別のid名を定義しています。
各div idに対するh2等の書き方は/user_data/packages/default/css/main.cssのフレームとメインコンテンツ部分を参考に記述してください。
Google Analyticsタグの実装
オマケです。
Google Analytics等のログ解析タグを各ページのフッタ下に入れたいケースもあると思いますが、このsite_main.tplに記述しておけば全ページに出力されます。
この程度であればフッタ内に記述しても特に問題はないと思いますが。。。