モデルとして静的Webページから作業しているJoomla 3.1.5でカスタムテンプレートを作成しています。静的ページは正常に表示されます。このページには、facebook、twitter、google+ などのアイコンを含む、小さなアイコン / グリフ スタイルのディスプレイがたくさんあります。アイコンの作成には font-awesome を使用しています。私の静的 html サンプルでは、font-awesome ツールがうまく機能します。
Joomla でカスタム レスポンシブ テンプレートを作成すると、CSS ファイルが何らかの理由で「破損」します。
生の CSS ファイルの抽出..
.icon-twitter:before { content: "\f099"; }
.icon-facebook:before { content: "\f09a"; }
.icon-github:before { content: "\f09b"; }
Firefox ブラウザーで firebug を使用してページを調べると、まさにそのコンテンツを確認できます。joomla ページで同じコンテンツを見ると、CSS ファイルに次のように表示されます。
.icon-twitter:before {content: ""; }
.icon-facebook:before {content: ""; }
.icon-github:before {content: ""; }
静的サイトと Joomla サイトはどちらも、オンラインの同じ場所からホストされています。コンテンツの文字が何らかの形で変換されており、アイコンが表示されません。エラーはクロムでも同じように見えます。
CSS ファイルの静的 html サイトと joomla サイトのコピーはどちらも同じですが、一方はスタイル ディレクトリを使用し、もう一方は css ディレクトリを使用します。静的サイト コールは次のとおりです。
<link rel="stylesheet" href="style/font-awesome.css">.
CSS ファイルへの joomla 呼び出しは次のとおりです。
$doc->addStyleSheet('templates/'.$this->template.'/css/font-awesome.css');
font-awesome.css のコンテンツ配信ネットワーク (CDN) リンクがある場所はわかります
<link href="//netdna.bootstrapcdn.com/font-awesome/3.2.1/css/font-awesome.css" rel="stylesheet">
私はまだそれを試していません。次はそれで遊んでみます。同時に、Joomla テンプレートの実装で情報が破損している理由を知っている人はいますか? zip さん、ご協力ありがとうございます。
編集: 考えられることの 1 つ..これは、.css ファイルの保存に使用されるテキスト エンコーディング形式の問題でしょうか? ASCII vs BOM なしの UTF-8 vs ストレート UTF-8 ? ファイルのどちらのコピーも変更したとは思いませんが、確かに可能です。それが問題でしょうか？使用する正しい形式は何ですか?
編集＃2：Webページからの情報は次のとおりです：静的ページエンコーディング：
<!DOCTYPE html>
<html lang="en">
<head>...
Joomla テンプレートのエンコーディング:
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="
<?php echo $this->language; ?>
" lang="<?php echo $this->language; ?>
" dir="<?php echo $this->direction; ?>">
<head>...