おちゃのこネットでは、テンプレートによってはCSSの編集に制限があります。CSSがうまく反映されずに困った経験がある方も多いのではないでしょうか。この記事では、実際に経験したCSSが効かない時の具体的な原因と対処法をご紹介します。

CSSが反映されない主な原因

おちゃのこネットの一部テンプレートでは、CSSの編集が制限されています。そのため、スタイルを適用するには「自由記入欄」にCSSを直接記述する必要があります。

以下はCSS編集できないテンプレートで、動画の幅を100％にしようとしたところうまく効かない状態です。

「改行は<br />タグに置換する」に注意

自由記入欄にCSSを記述しても、CSSがまったく効かないことがあります。その主な原因が、「改行は<br />タグに置換する」というオプションです。

この設定が有効になっていると、CSSの改行部分が自動的に <br /> タグに置き換えられてしまい、CSSとして正しく読み込まれなくなります。

対処法

「改行は<br />タグに置換する」 のチェックを外しましょう。

手順は以下の通りです：

1. 管理画面にログイン
2. CSSを入力した自由記入欄（例：フリースペースやフッターなど）に移動
3. 入力欄の下にある 「改行は<br />タグに置換する」 のチェックを 外す
4. 「保存」ボタンをクリック

100％表示されるようになりました。

まとめ

おちゃのこネットではテンプレートによってカスタマイズの自由度が異なりますが、自由記入欄を使えばCSSの追加は可能です。
ただし、「改行を<br />に置換」する設定をOFFにすることが重要なポイントです。

「CSSが効かない…」という時は、まずこの設定を見直してみてください。