検索
ホームページCMS チュートリアルECShopECSHOPにBaidu編集UEditorをインストールする方法

ECSHOP システムに付属のエディターを使用したことのある人は、このエディターが使いにくく、画像を一括でアップロードできないことを知っています。 Baidu Editor は強力で使いやすく、冗長なコードをあまり生成しないため、多くの友人が Baidu Editor を気に入っています。

ECSHOPにBaidu編集UEditorをインストールする方法

Baidu Editor を統合した ECSHOP には多くのチュートリアルがありますが、そのほとんどにはいくつかの問題があります。

推奨: 「ecshop 開発チュートリアル

最初にレンダリングを見てください:

ECSHOPにBaidu編集UEditorをインストールする方法

チュートリアルの開始:

ステップ 1:

Baidu エディタの Web サイトにアクセスして最新バージョンをダウンロードし、フォルダーの名前を「ueditor」に変更して、/includes/ ディレクトリにアップロードします

(このチュートリアルの最後で、準備された ueditor バージョン 1.4.3 をダウンロードすることもできます)

ステップ 2:

これら 2 つのファイルを開きます。1 つは製品編集用で、もう 1 つは製品編集用です。記事編集用

/admin/templates/goods_info.htm
/admin/templates/article_info.htm

検索:

{$FCKeditor}

変更先:

<script type="text/javascript" charset="utf-8" src="../includes/ueditor/ueditor.config.js"></script>
<script type="text/javascript" charset="utf-8" src="../includes/ueditor/ueditor.all.min.js"> </script>
<!--建议手动加在语言,避免在ie下有时因为加载语言失败导致编辑器加载失败-->
<!--这里加载的语言文件会覆盖你在配置项目里添加的语言类型,比如你在配置项目里配置的是英文,这里加载的中文,那最后就是中文-->
<script type="text/javascript" charset="utf-8" src="../includes/ueditor/lang/zh-cn/zh-cn.js"></script>
<style type="text/css">
.clear {
clear: both;
}
</style>
<textarea id="goods_desc" name="goods_desc" style="width:100%;height:500px;"> {$goods.goods_desc}</textarea>
<script type="text/javascript">
delete(Object.prototype.toJSONString);
UE.getEditor(&#39;goods_desc&#39;)
</script>

このように両方のファイルを変更します。

このコード行に注意してください:

<textarea id="goods_desc" name="goods_desc" style="width:100%;height:500px;"> {$goods.goods_desc}</textarea>

width と height はそれぞれエディターのサイズを指しますが、IE Core を搭載したブラウザーは px の書き込みをサポートしていない可能性があるため、エディターは少し完璧ではないかもしれません。これは CSS に関連しています。これは自分で解決できます。

現時点では、実は ECSHOP のバックグラウンドエディタは正常に使用できますが、商品リストやカテゴリなどを入力するだけで、Ajax が見つからないというエラーが報告されます:

ECSHOPにBaidu編集UEditorをインストールする方法

解決策は以下に提供されます

ステップ 3: バックグラウンド JS の競合を解決する

/admin/templates/pageheader.htm

# を開きます##ヘッダー内を検索します:

{insert_scripts files="../js/transport.js,common.js,../js/utils.js"}

これを次のように変更します:

<script type="text/javascript" src="../includes/ueditor/fix_jquery/jquery.min.js" rel="stylesheet" /></script>
<script type="text/javascript" src="../includes/ueditor/fix_jquery/jquery.json-1.3.js" rel="stylesheet" /></script>
<script type="text/javascript" src="js/common.js" rel="stylesheet" /></script>
<script type="text/javascript" src="../includes/ueditor/fix_jquery/transport_json.js" rel="stylesheet" /></script>
{insert_scripts files="../js/utils.js"}

以上です。

JQ ファイルを参照することを忘れないでください。 。

以上がECSHOPにBaidu編集UEditorをインストールする方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明
この記事はecshop119で複製されています。侵害がある場合は、admin@php.cn までご連絡ください。

ホットAIツール

Undresser.AI Undress

Undresser.AI Undress

リアルなヌード写真を作成する AI 搭載アプリ

AI Clothes Remover

AI Clothes Remover

写真から衣服を削除するオンライン AI ツール。

Undress AI Tool

Undress AI Tool

脱衣画像を無料で

Clothoff.io

Clothoff.io

AI衣類リムーバー

Video Face Swap

Video Face Swap

完全無料の AI 顔交換ツールを使用して、あらゆるビデオの顔を簡単に交換できます。

ホットツール

AtomエディタMac版ダウンロード

AtomエディタMac版ダウンロード

最も人気のあるオープンソースエディター

EditPlus 中国語クラック版

EditPlus 中国語クラック版

サイズが小さく、構文の強調表示、コード プロンプト機能はサポートされていません

SublimeText3 Mac版

SublimeText3 Mac版

神レベルのコード編集ソフト(SublimeText3)

Safe Exam Browser

Safe Exam Browser

Safe Exam Browser は、オンライン試験を安全に受験するための安全なブラウザ環境です。このソフトウェアは、あらゆるコンピュータを安全なワークステーションに変えます。あらゆるユーティリティへのアクセスを制御し、学生が無許可のリソースを使用するのを防ぎます。

SAP NetWeaver Server Adapter for Eclipse

SAP NetWeaver Server Adapter for Eclipse

Eclipse を SAP NetWeaver アプリケーション サーバーと統合します。