質問が締め切られてしまったので、再度質問させていただきます。
ツイッターのウィジェットを作成しているウェブページに表示したのですが、できません。
IEでは表示されるのですが、それ以外では表示されません。
ためしに他のウェブページでクロームでもちゃんと表示されているソースをコピペしてみたのですが、
表示されませんでした。
また、cssが原因かと思い、IEとそれ以外でcssファイルを分けているので、IE用のcssファイルのみにしてみたのですが、結局表示されませんでした。
scriptタグ内で言語指定してみたり、そもそも自分のクロームの問題かと思い、キャッシュの削除などしてみましたが、みれません…。
貼っているツイッターウィジェットは、公式のものです。
なにか原因として考えられるものを教えていただきたいです。
よろしくお願いいたします。
職場で作成しているものなので、urlなどは提示できません…。
コメント(4件)
どうしても提示できない場合は、自分で原因を探るしかありません。
まずは新規にシンプルなページを作成してウィジェットが表示される事を確認し、少しずつ問題が発生するページからHTMLコードを追加してその都度表示確認する事を繰り返して、ウィジェットが表示されない原因となっているコードを特定してみてください。
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="utf-8">
<title>ツイッターウィジェット表示テスト</title>
</head>
<body>
<div id="wrapper">
<div id="tweetBox">
ここにウィジェットのコード
</div>
</div>
</body>
</html>
※ファイルの文字コードはUTF-8です。
※CSSとJavaScriptは最後に追加してみてください。
※まず最初に、問題の発生するページのCSSとJavaScriptをすべて除去した場合に、ウィジェットが表示されるかどうかを確認しておくといいかもしれません。
無知で申し訳ないのですが、
<div id="wrapper">と<div id="tweetBox">とはなんなのか教えていただけませんでしょうか?
原因の特定ができたのでしょうか?
> <div id="wrapper">と<div id="tweetBox">とはなんなのか教えていただけませんでしょうか?
特に何でもありません。
<body>直下にウィジェットのコードを貼り付けてもいいのですが、親要素となるボックスを用意して入れるのが癖になっているだけです。
※「#wrapper」は一番外側の要素につけられる事がよくあるようです。(他には「#outline」なども使われているようです。)
「#tweetBox」は分かりやすいように適当につけただけで特に意味はありません。
何れもデザインする際にCSSで使用しますので、自分で分かりやすいようにつけるといいです。
※一応HTMLの仕様として、テキストなどのインライン要素を<body>直下に記述する事は非推奨となっています。
・body要素
http://w3g.jp/xhtml/dic/body
原因がよくわからないのですが、でも問題のあったページでも表示することができるようになりました。