こんにちは。現在こちらにてHPを運用させて頂いてるninomiyaと申します。

何かご存知でしたら教えて欲しいのですが、
現在レスポンシブのテーマを使っていて、新たに違うレスポンシブなテーマに変更しようとしてます。
結論としてはこのサーバーにあがっているものだと画面が横に伸びている。
テーマのサンプルサイト
http://www.wpexplorer.me/adapt/
こちらと比較するとなぜか横に長いです。
現在新しく変える予定のレスポンシブテーマも同様に画像などが伸びてしまいます。
そのためかflexsliderが表示されないという現象に陥っています。
ローカルのVM上(CentOS6.4x64)でも問題なく、ブラウザを最大にしても伸びることはありません。
こちらのサーバーにあがっているスクリプトに原因があると思い、それらをローカルに適用しましたが正常に表示され、flexsliderも正常に表示されます。
htmlの中にはflexsliderが表示されているようなので、何かCSSが取得できない条件があるなどはありませんでしょうか？
VM上で構築すると、同じ条件のはずが表示が崩れるという現象に陥ったことがあります。
それに似た状態なのでしょうか、、、
ご存知でしたら教えてください。

宜しくお願い致します。

返信する

ninomiya さん
こんばんわ

あまりサーバの設定に関わるところではないと思うのですが
cssかjavascriptをjsなど呼び出しているのであれば
そこら辺が読み込めていないのではないでしょうか。

うまくいかないときのソース画面でそれらのファイルを確認し
ブラウザで開いたときにどうなるかでみてみてはいかがでしょうか。

返信する

こんにちは。
夜分遅くに返信ありがとうございます。

実務でも似たような現象が起きたことがあり、その場合は実際のサーバーでは正常でVMでは崩れていたのでVM原因として解決させなかったのですが、、、
おそらくapacheかphpの設定により変化するのではないかと推測してます。
今日早く帰れたらすべてのファイルの文字コードをUTF-8に変更してみます。
全部がそうはなっていなかったようで、CSSは変更してみたのですが変化はありませんでした。

返信する

確かに指定がない場合のデフォルトは
utf8としていた記憶がございます。

返信する

UTF-8にすると違うエラーがでて直せなくなってしまい、作業前ファイル郡で復旧するという状態になってしまいました。
BOMが影響している可能性があるようです。
[参考まで]
http://blog.bricoleur.in/archives/1466
php.iniのoutput_bufferingとoutput_handlerはどのようになってますでしょうか？
これが原因だった場合、他にもWordPressを使ってる人は遭遇してそうですので違うかもしれませんが、、、

返信する

output_buffering
output_handler

いずれも明示的な設定はしていない状態なのでデフォルトになると思われます。

返信する

急ぎ返答頂きありがとうございます。

こちらのVMではoutput_buffering = 4096となってます。
これはyumでインストールしたデフォルトです。
そしてVMでコメントアウトしてみたのですが現象は再現しませんでした。
明日会社の問題がでていたVMと問題のないサーバーの設定などを確認してみます。
あがっているファイル全部は確認してないのですがBOM付きではないようで、、、
何がいけないんでしょうか、、、

返信する

表示が崩れる、ローカルVMでは問題なくサーバーにあげるとスライドが動かない
同じソースコード、などで過去に遭遇した現象と勝手に思いこんでました。
原因が恐らくつかめました。
そもそも表示が崩れるのはChromeだけでした。。。
IEとSafariは問題ありませんでした。
そしてflexsliderが動かないのは全てでしたが、サーバー上でなくブラウザが取得したソースをみくらべていたらjqueryが2回も呼ばれてました。
大丈夫な方の絶対パス書き換えてOK、だめな方のjqueryはずしてOKでしたので、
明日時間があれば本番で試してみます。
毎度お騒がせしてすみません。。。

返信する

解決しそうで何よりです。
がんばって下さい。

返信する

こんばんは。
先ほど解決致しました。
プラグインのGoogle Maps AnywhereとテーマのPeroliaの相性なのか
jqueryが2回呼び出されてしまっていました。
Google Maps Anywhereのjqueryをストップさせたら正常にマップもテーマも表示されました。
お騒がせして申し訳ございませんでした。

返信する