[EC-CUBE] 正式版（Ver2.12.4）
[レンタルサーバ] data-hotel.net
[PHP] PHP Version 5.2.13
[データベース] MySQL 5.0.83
[WEBサーバ] Localhost via UNIX socket

お世話になっております。
下記サイトにてrecommend.tplを改良し、
スライドができるような作りにしたく参考にしました。
http://daihachi.sub.jp/archives/424


サイト通りにhtml/jsにファイルを入れて、
以下のコードを作ったのですが編集を加えても何も表示されないので

この度質問いたしました。
わかるかたいましたらご教授願いたいです。

またファイルの編集等は管理ページでおこなった方がよろしいのでしょうか。
WinSCPから直接エディタで編集したく思ってたのですが。。。

<!--{*
* This file is part of EC-CUBE
*
* Copyright(c) 2000-2012 LOCKON CO.,LTD. All Rights Reserved.
*
* http://www.lockon.co.jp/
*
* This program is free software; you can redistribute it and/or
* modify it under the terms of the GNU General Public License
* as published by the Free Software Foundation; either version 2
* of the License, or (at your option) any later version.
*
* This program is distributed in the hope that it will be useful,
* but WITHOUT ANY WARRANTY; without even the implied warranty of
* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
* GNU General Public License for more details.
*
* You should have received a copy of the GNU General Public License
* along with this program; if not, write to the Free Software
* Foundation, Inc., 59 Temple Place - Suite 330, Boston, MA 02111-1307, USA.
*}-->
<!-- //////////////////////////////////// script //////////////////////////////////// -->
<script type="text/javascript">
$(function() {
$(".jCarouselLite").jCarouselLite({
btnNext: ".next",
btnPrev: ".prev",
visible : 4,
speed: 300,
easing: "linear"
});
});
</script>
<!-- //////////////////////////////////// script //////////////////////////////////// -->

<!--{if count($arrBestProducts) > 0}-->
<div class="bloc_outer clearfix">
<div id="recommend_area">
<h2><img src="<!--{$TPL_URLPATH}-->img/title/tit_bloc_recommend.jpg" alt="*" class="title_icon" /></h2>

<div class="carousel">
<a href="#" class="prev"></a>
<a href="#" class="next"></a>
<div class="jCarouselLite">
<ul style="margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 0px; position: relative; list-style-type: none; z-index: 1; width: 2880px; left: -800px; ">

<style type="text/css">
.recommend h2 {
height:17px;
background: url('<!--{$TPL_URLPATH}-->img/background/bg_pickup.gif') no-repeat;
}
.carousel {
margin: 0px;
position: relative;
width: 566px;
.slider-wrap:center;
border: solid 1px #ccc;
border-top: none;
padding:5px;
font-size:90%;
}

.jCarouselLite {
position: relative;
overflow: hidden;
margin: auto;
padding-top:5px;
}

.jCarouselLite li {
float: left;
height: 160px;
overflow: hidden;
width: 121px;
text-align:center;
padding-right:10px;
}

.prev {
float: left;
margin: 55px 2px 0 0;
width: 17px;
height: 17px;
background: url(../img/button/btn_minus.jpg) no-repeat;
cursor: pointer;
}

.next {
float: right;
margin: 55px 0 0 2px;
width: 17px;
height: 17px;
background: url(../img/button/btn_plus.jpg) no-repeat;
cursor: pointer;
}
</style>
<!--{if count($arrBestProducts) > 0}-->
<div id="recommendArea">
<div class="subTitle02 recommend"><h2>おすすめ商品情報</h2></div>
<div class="productItem clearfix thinImg">
<ul>
<!--{foreach from=$arrBestProducts item=arrProduct name="recommend_products"}-->
<li>
<div class="productImage">
<a href="<!--{$smarty.const.P_DETAIL_URLPATH}--><!--{$arrProduct.product_id|u}-->">
<img src="<!--{$smarty.const.ROOT_URLPATH}-->resize_image.php?image=<!--{$arrProduct.main_list_image|sfNoImageMainList|h}-->&width=80&height=80" alt="<!--{$arrProduct.name|h}-->" />
</a>
</div>
<div class="productContents">
<h3>
<a href="<!--{$smarty.const.P_DETAIL_URLPATH}--><!--{$arrProduct.product_id|u}-->"><!--{$arrProduct.name|h}--></a>
</h3>
<p class="sale_price">
<!--{$smarty.const.SALE_PRICE_TITLE}-->(税込)： <span class="price"><!--{$arrProduct.price02_min_inctax|number_format}--> 円</span>
</p>
<p class="mini comment"><!--{$arrProduct.comment|h|nl2br}--></p>
</div>
</li>
<!--{if $smarty.foreach.recommend_products.iteration % 2 === 0}-->
<div class="clear"></div>
<!--{/if}-->
<!--{/foreach}-->
</ul>
</div>
</div>
<!--{/if}-->
<script type="text/javascript" src="<!--{$smarty.const.ROOT_URLPATH}-->js/jcarousellite_1.0.1.pack.js"></script>

<script type="text/javascript" src="<!--{$smarty.const.ROOT_URLPATH}-->js/jcarousellite_1.0.1.pack.js"></script>
をファイル先頭のコメントの直後に記述してはいかがでしょう。
(つまりjcarousellite_1.0.1.pack.jsを読み込んでから$.jCarouselLite()を実行する)
それでもダメな場合は、初歩的なミスでファイルがアップロードされていないとか…。

ファイルの編集については、保存する際の文字コードや改行コードを間違えなければ、
どのような方法でも構わないと思います。

ブラウザ上でJavascriptの動作やHTML・Javascriptの確認ができる、
いわゆる開発ツールと呼ばれるものを利用すると、早期解決につながります。
(Firefoxの場合はFirebugなど)
無料ですし導入されてはいかがでしょう？

----------------
+ DAISY inc. -------------------- +
EC-CUBE構築・カスタマイズサービス
EC・WEB構築などお気軽にご相談ください。

デイジー株式会社
http://daisy.link/

DELIGHT様
早急なご対応ありがとうございました。

<script type="text/javascript" src="<!--{$smarty.const.ROOT_URLPATH}-->js/jcarousellite_1.0.1.pack.js"></script>
上の部分を下記のように編集しましたがうまくいきませんでした。

<script type="text/javascript" src="<!--{$smarty.const.ROOT_URLPATH}-->js/jcarousellite_1.0.1.pack.js"></script>
<script type="text/javascript">
$(function() {
$(".jCarouselLite").jCarouselLite({
btnNext: ".next",
btnPrev: ".prev",
visible : 4,
speed: 300,
easing: "linear"
});
});
</script>

システムエラーが発生しました。大変お手数ですがサイト管理者にお問い合わせくださいと
出ました。

ちょっと詳しい状況が見えてきませんね…。

引用：
「何も表示されない」はどういう状態でしょうか？
ページが真っ白？jCarouselLiteの部分のみ上手く表示されない？それとも
引用：
というエラーメッセージが表示されるのでしょうか？

「システムエラーが〜」のメッセージはPHPやSmartyでエラーが発生した場合に表示されます。
テンプレートを修正した途端このエラーが出るようになったのなら、
Smartyの構文が間違っている可能性が高いです。
管理画面のEC-CUBEエラーログに内容が出力されているはずなので、
それを参考にしながら構文が間違っていないか確認して下さい。

----------------
+ DAISY inc. -------------------- +
EC-CUBE構築・カスタマイズサービス
EC・WEB構築などお気軽にご相談ください。

デイジー株式会社
http://daisy.link/

if文の開始と終了の数が合っていないように思います。

----------------
EC-CUBEのプラグインを公開しています！
いつも reCAPTCHA

DELIGHT様
システムエラーが発生しました。大変お手数ですがサイト管理者にお問い合わせくださいと 出ました。

PHPやSmartyでエラーが発生したということですか。確認してみます。
管理画面のエラーログも確認してみます。

大変たすかります。
またなにか不具合でたら書き込みます。

pineray様

かしこまりました。
確認してみます！

ご指摘ありがとうございます！