EC-CUBE カテゴリーを折りたたまず全て表示
EC-CUBEバージョン | 2.4.3 |
PHPバージョン | PHP 5.2.6 |
管理画面→デザイン管理→ブロック編集→カテゴリ(tpl)
32行目
コメントアウトの為に * で囲う
<!–{* if $arrTree[cnt].display == 1 *}
49行目
コメントアウトの為に * で囲う
<!–{* /if *}–>
———————————————————–
以上2箇所修正
ECCUBEブロックにエディタ編集できる機能
ECCUBEブロックにエディタ編集できる機能
cssレイアウト崩れの原因 — バグ回避方法 —
● フォントサイズ
font-sizeは%かpxで指定
【バグ対象ブラウザIE6】
⇒ キーワードで文字サイズを指定すると標準モードと互換モードで文字サイズが変わる ⇒
em単位で指定した値が文字サイズ変更後に正しく反映されない
● ボックス
widthと同時に左右brderや左右paddingを指定しない
heightと同時に上下brderや上下paddingを指定しない
⇒ ボックスの幅や高さを算出するときにパディングやボーダーのサイズを含めてしまう
【バグ対象ブラウザIE5.5,IE6】
⇒ 左右ボーダーとパディングを設置した要素に後続する部分がずれる body要素にはborderやwidthを指定しない。
⇒ 初期コンテナブロックを生成する要素の幅を指定できない
● 視覚的
フロートのコンテナブロックにはwidthを指定
【バグ対象ブラウザ IE5.5,IE6】
⇒ 背景色が指定された要素内にフロートがあるときに要素内の文字が消える
⇒ フロートを含むボックスのマージンが無視される
左フロートの左marginはゼロにする
右フロートの右marginはゼロにする
【バグ対象ブラウザ IE5.5,IE6】
⇒ フロートの左右マージンが指定値より大きくなる
clearしていないブロックボックスにはwidthもheightも指定しない
【バグ対象ブラウザ IE5.5,IE6】
⇒ フロートに後続するボックスの幅がフロートに合わせて短縮される
clearするボックスの上marginはゼロ
【バグ対象ブラウザ IE5.5,IE6】
⇒ clearを指定した要素ではフロートに対して上マージンを設置する
clearするボックスには同時にwidthも指定
絶対配置要素のコンテナブロックにはwidthを指定
絶対配置要素の位置指定はtopとleftまたはrightとbottomで行う。
leftとrightやtopとbottomを同時指定しない。
【バグ対象ブラウザ IE6】
⇒ left, topが指定された要素ではright, bottomを認識しない
verflwを使うときは同時にwidthやheightを指定する
⇒ 幅と高さが明示されていない要素へのverflow:hidden;指定が完全に反映されない
EC-CUBE商品画像をlightboxで表示させる
lightboxを使って商品画像を表示する
EC-CUBE 商品詳細ページ商品画像をlightboxで表示する。
商品画像拡大表示をlightboxで表示する。
EC-CUBEバージョン | 2.4.1 |
PHPバージョン | PHP 5.2.6 |
DBバージョン | MySQL 5.0.51a-community-log |
1.lightboxをダウンロードする。
lightbox2.04.zip をダウンロード
2.上の3つのフォルダをアップロードする。
アップロード先
html/user_data /packages/default/lightbox
*lightboxというファルダを作成する。
*index.html以外をアップロード
EC-CUBEのファイルを書き換える
data/Smarty/templates/default/detail.tpl
data/Smarty/templates/default/site_frame.tpl
1.書き換えるファイルは上記の2ファイル
data/Smarty/templates/default/detail.tpl
【修正箇所】
1,59行目付近にある
<!--{assign var=key value="main_image"}-->
の下に
<!--{assign var=keyl value="main_large_image"}-->
を追加します。
—————————————————————————————————-
2,61行目付近にある
<!–★画像★–>の下の
<a href="javascript:void(win01('./detail_image.php?product_id= <!--{$arrProduct.product_id}-->&image=main_large_image <!--{if $smarty.get.admin == 'on'}-->&admin=on<!--{/if}-->','detail_image',' <!--{$arrFile.main_large_image.width+60}-->', ' <!--{$arrFile.main_large_image.height+80}-->'))"> <img src="<!--{$arrFile[$key].filepath}--> " width="<!--{$arrFile[$key].width}-->" height=" <!--{$arrFile[$key].height}-->" alt="<!--{$arrProduct.name|escape}-->" /> </a>
を以下に書き換えます。
<a href="<!--{$arrFile[$keyl].filepath}-->" rel="lightbox">
<img src="<!--{$arrFile[$key].filepath}-->" width="
<!--{$arrFile[$key].width}-->" height="<!--{$arrFile[$key].height}-->
" alt="<!--{$arrProduct.name|escape}-->" />
</a>
-----------------------------------------------------------------------
3,<!–★拡大する★–>の下の
<a href="javascript:void(win01('./detail_image.php?product_id= <!--{$arrProduct.product_id}-->&image=main_large_image <!--{if $smarty.get.admin == 'on'}-->&admin=on<!--{/if}-->',' detail_image','<!--{$arrFile.main_large_image.width+60}-->', ' <!--{$arrFile.main_large_image.height+80}-->'))" onmouseover="chgImg ('<!--{$TPL_DIR}-->img/products/b_expansion_on.gif','expansion01');" onMouseOut="chgImg('<!--{$TPL_DIR}-->img/products/b_expansion.gif','expansion01');"> <img src="<!--{$TPL_DIR}-->img/products/b_expansion.gif" width="85" height="13" alt="画像を拡大する" name="expansion01" id="expansion01" /> </a>
を以下に書き換えます。
<a href="<!--{$arrFile[$keyl].filepath}-->" rel="lightbox"
onmouseover="chgImg('<!--{$TPL_DIR}-->img/products/b_expansion_on.gif','
expansion01');" onMouseOut="chgImg('<!--{$TPL_DIR}-->
img/products/b_expansion.gif','expansion01');">
<img src="<!--{$TPL_DIR}-->img/products/b_expansion.gif"
width="85" height="13" alt="画像を拡大する" name="expansion01" id="expansion01" />
</a>
data/Smarty/templates/default/site_frame.tpl
【修正箇所】
1,<head>と</head>の間に以下を追加。
<script type="text/javascript" src="<!--{$TPL_DIR}-->
lightbox/js/prototype.js"></script>
<script type="text/javascript" src="<!--{$TPL_DIR}-->
lightbox/js/scriptaculous.js?load=effects,builder"></script>
<script type="text/javascript" src="<!--{$TPL_DIR}-->
lightbox/js/lightbox.js"></script>
<script>LightboxOptions.fileLoadingImage="<!--{$TPL_DIR}-->
lightbox/images/loading.gif"; </script>
<script>LightboxOptions.fileBottomNavCloseImage="<!--{$TPL_DIR}-->
lightbox/images/closelabel.gif"; </script>
<link rel="stylesheet" href="<!--{$TPL_DIR}-->
lightbox/css/lightbox.css" type="text/css" media="screen" />
cssハック css hack – スタイルシート —
CSS ハック
ブラウザごとの表示の違いを、ブラウザが持っている「バグ」を逆手に取って利用する方法。
CSSハックと呼ばれているもので、あくまでも応急処置的な意味で使う。
*The W3C CSS Validationに通らないものもあります
IE6以下
スターハック
* html #contents { margin:0 0 0 10px; }
対応ブラウザ:IE4~6、MacIE4~5
セレクタの前に【* html 】を挿入
アンダースコアハック
#contents { _margin:0 0 0 10px; }
対応ブラウザ:IE4~6
プロパティ前に【_】アンダースコアを挿入
IE6のみ除外
#contents { color /**/:#000000; }
対応ブラウザ:IE7、IE8、Firefox、Safari、Opera
プロパティ後に【/**/】を挿入
IE7用
*:first-child+html #contents { margin:0 0 0 10px; }
対応ブラウザ:IE7
【*:first-child+html】を挿入
IE6/IE7共通
#contents {/margin:0 0 0 10px; }
対応ブラウザ:IE6、IE7
プロパティの前に【/】を挿入
—————————————————————————-
【追記】
IE8
*+html>/**/body
●●●
IE7
*:first-child+html ●●●
PHP redirect phpリダイレクト方法
phpでのリダイレクト方法
——————————————————–
<?php
header(“Location: http://www.●●●.com”);
?>
——————————————————–
これだけ書いて拡張子をphpで保存。
blogを変更した際に使用しました。
以前のブログが「blog」ディレクトリの中のindex.phpがトップページ
だった為「blog」ディレクトリのindex.phpに
上記をコピペでサイトのトップへリダイレクトさせました。
*検索でリンク切れになる為の対処です
サイトのルート変更 URL変更 トップディレクトリ変更
WordPress をサイトのルート変更するには
レンタルサーバー:ロリポップ
ロリポップのコントロールパネルの中の、wordpress簡単インストールでwordpressを
インストールすると、「wordpress」というフォルダが出来てしまいます。
http://www.●●.com/wordpress→http://www.●●.com/にする方法
ドキュメントルート(root)を変更させる手順
1.「管理画面」 →「設定」→「一般設定」で上図を変更します。
ブログのアドレスという所に、変更したいURLを記入します。
http://www.●●●.com/
「変更を保存」
2.wordpressのディレクトリ内の[index.php]をサイトのルートに設置する為
http://www.●●●.com/wordpressにある[index.php]を開く
3.[index.php]のファイル内を変更
require(‘./wp-blog-header.php’); ↓
require(‘./wordpress/wp-blog-header.php’);
変更して保存する。
4.変更した[index.php]ファイルをhttp://www.●●●.com/に移動。
*設定にもよりますが、ロリポップの場合index.phpよりもindex.htmlの方を
優先して表示するのでhttp://www.●●●.com/にindex.htmlがある場合は削除します。