バージョン選択

フォーラム

メニュー

オンライン状況

33 人のユーザが現在オンラインです。 (13 人のユーザが フォーラム を参照しています。)
登録ユーザ: 0
ゲスト: 33
もっと...

サイト内検索

質問 > フロント機能 > javaScriptのコードを書く場所を教えてください。

フロント機能

新規スレッドを追加する

スレッド表示 | 新しいものから 前のトピック | 次のトピック | 下へ
投稿者 スレッド
fffggg
投稿日時: 2021/11/11 0:23
対応状況: −−−
新米
登録日: 2021/11/11
居住地:
投稿: 1
javaScriptのコードを書く場所を教えてください。
▼テンプレート
[EC-CUBE] 4
[レンタルサーバ] ローカル環境
[OS] windows10
[PHP] 使用しているPHPのバージョン
[データベース] mysql
[WEBサーバ] ??
[ブラウザ] chrome
[導入プラグインの有無 あれば導入プラグインを記載
[カスタマイズの有無] あればカスタマイズ内容を記載(できるだけ具体的に)


[質問内容] フロント部分で動作させたいjavaScriptの文章を書きたいです。書く場所は, `html\template\default\assets\js\function.js` で合っていますでしょうか?

ここのファイルに関数を追加しても,動きませんでした。
初心者ですが,もしご存知でしたら教えてください。
umebius
投稿日時: 2021/11/11 5:38
対応状況: −−−
登録日: 2016/7/22
居住地: 東京日本橋
投稿: 2042
Re: javaScriptのコードを書く場所を教えてください。
default以外のテンプレートを使っているのであれば
html/template/default/assets/js/function.jsではなく、
html/template/{テンプレートコード}/assets/js/function.js
になりますが、いかがでしょうか。

デベロッパーツールで読み込まれているjsファイルを確認することが可能です
(参考) https://ics.media/entry/190517/

またjavascriptをtwigファイル上に書いても動作します。
フロントエンドエンジニアの方はいやだと思いますが、twigの変数、関数を埋め込みたいことが多いので、twigファイル上にjsが多く書かれています。


----------------
EC-CUBE4系 カスタマイズ ECのプロがシステム急ぎの案件承ります。
EC-CUBE開発 リモートで働くエンジニア募集中

kss
投稿日時: 2021/11/11 8:32
対応状況: −−−
半人前
登録日: 2020/2/12
居住地:
投稿: 18
Re: javaScriptのコードを書く場所を教えてください。
ユーザーが独自に追加するためのJavaScriptのファイルは
html/user_data/assets/js/customize.js
かと思います。

管理画面からは、
コンテンツ管理 > JavaScript管理
で編集できます。

このjsファイルは全ページ共通のファイルですが、特定のページでのみ実行したい処理を書きたいのであれば、ECCUBE4の場合はbodyタグにページごとのidが振られているので、そのidでフィルタリングすることで実現できます。

例えば、お問い合わせページにのみ反映させたい処理の例としては

if(document.querySelector('body#page_contact')) {
  document.querySelector('body').insertAdjacentHTML('afterbegin',
    `<div style='position:sticky;top:0;background-color:cyan;z-index:10000'>このページはお問い合わせページです</div>`);
}


こんな感じに書くことができます。
スレッド表示 | 新しいものから 前のトピック | 次のトピック | トップ


 



ログイン

右上バナー


EC-CUBEペイメント

公式ストアEC-CUBE4系デザインテンプレート続々リリース中

統計情報

総メンバー数は73,739名です
総投稿数は102,973件です

投稿数ランキング

1
seasoft
7333
2
468
3132
3
AMUAMU
2712
4
nanasess
2192
5
umebius
2042
6
yuh
1664
7
red
1456
8
h_tanaka
1169
9
tsuji
942
10
fukap
907
11
shutta
835
12
tao_s
794
13 ramrun 789
14 karin 689
15 sumida 641
16
homan
633
17 DELIGHT 572
18
patapata
502
19
flealog
485
20 tonton 437


ネットショップの壺

EC-CUBEインテグレートパートナー

Copyright© EC-CUBE CO.,LTD. All Rights Reserved.