HTMLコーディング

EC-CUBE3でテンプレート適用後にパスが通らなくなってしまったときの対処法

こんにちわ、ともさんです。
みなさん元気ですかそうですか。

さて、この前業務でEC-CUBEを触っていた時にとんでもないことが起こりました。
EC-CUBEの公式テンプレート(有料)を適用したら、突然cssや画像が適用されなくなりました。

ホワイ( ゚Д゚)

Google先生に聞いても「は?わかんねーよそんなもん」とツレナイ返事。

|д゚)…だれかタスケテ…
ワタシ、初めてEC-CUBE触るんだよ、わかんねーよ、どうすりゃいいんだよ

とか思いながら調べまくっていたら、ヒントがいろいろ書いてあって
結果解決したのでその対処法を。

テンプレート適用

使用したのは以下のテンプレートです。

EC-CUBEデザインテンプレート No.P3001(3.0.10)

readme.txtを読みながら、手順通りにテンプレート適用を行いました。
その辺は割愛します。

恐怖の画面

そしたらほら、こんな画面。
css適用されない恐怖

もうよくわかりません。

そして、対処法

原因はわかりませんが、テンプレート適用と同時にfront_urlpathが書き換わってしまったことが原因でパスが通らなくなった状態なのでパスを通してあげます。

パス関連の設定は以下のファイル内にあります。

app/config/eccube/path.yml

このファイル内の設定に追記します。

FTP接続し、バックアップ用としてappフォルダをまとめてダウンロードしておきます。
念のため、app/config/eccube/path.ymlを複製し、編集します。

front_urlpath: /template/default

これを

front_urlpath: /html/template/default

こうします。

私の環境下では、「/html」が足りなかっただけなので追記したという状態です。
FTPのフォルダ状況によって違いますが、基本はパスを合わせれば大丈夫です。

まとめ

しらべていく過程で、どうやらバグではないかと思いました。
EC-CUBE3.0.10のバグなのか、テンプレート側のバグなのかはわかりませんけど。

さっぱり原因がわかりませんでした。

あんな画面は二度と見たくないですね。
心臓に悪い|д゚)

ピックアップ記事

  1. 【お客様インタビュー】サンキョウプラテック株式会社様

関連記事

  1. HTMLコーディング

    css3だけで立体的でアニメーション付きのボタンを作ろう

    はじめまして、制作チームキャップの徳永です。今年でテイクフォーも4期目に突入し、そろそろ自社サイトでまじめに記事を書いていみようという事になったの…

  2. HTMLコーディング

    【WordPressでGO!】管理画面の左メニューをカスタマイズしてみよう

    皆様あけおめです。ともさんです。あけおめ・・・もう2月ですよ。どうしましょう。なにをしてたんでしょうか。というわけで、今回もはりきってゴー…

  3. HTMLコーディング

    EC-CUBE3をローカル環境へインストールしてみよう

    寒い!((((;゚Д゚))))寒すぎてロードバイク諦めかけてるともさんです、こんにちわ。EC-CUBE3のテスト環境を作りたくて、どこに作…

  4. HTMLコーディング

    【WordPressでGO!】WordPressをローカル環境へインストールしてみよう

    あけましておめでとうございます。今年もよろしくお願いいたします。2018年一発目の記事は、WordPressです(≧▽≦)WordPr…

  5. HTMLコーディング

    【PHP】ページ毎に表示を変えるサイドメニューの分岐の方法

    先日会社の人たちと初登山へ行ってきましたが3回ほど盛大にコケてオシリが痛くなったともさんです、こんにちわ。・・・いや、登山楽しかったですよ。次回は…

  6. HTMLコーディング

    EC-CUBE3で自動返信メールが文字化けし、そしてタイトルが途中で切れたときの対処法

    大阪はすっきりしない天気が続いてロードバイクに乗れずテンション下がりまくりのともさんですこんにちは。さて、前回に引き続き今回もEC-CUBE関…

コメント

  1. この記事へのコメントはありません。

  1. この記事へのトラックバックはありません。

CAPTCHA


最近の記事

  1. WEB集客

    Googleアナリティクスで目標設定とABテストをしてみよう
  2. WEBデザイン

    【illustrator】簡単トレース方法
  3. WEBデザイン

    ブログ内のリンク切れをチェックしよう!Broken Link Checkerの使…
  4. WEBデザイン

    WordPressを日本語化させよう!WP Multibyte Patchって?…
  5. Photoshopで手軽に 人物の髪の毛をキレイに切り抜く方法

    WEBデザイン

    Photoshopで手軽に 人物の髪の毛をキレイに切り抜く方法
PAGE TOP