モバイル表示の記事ページの見た目（上部）
前の記事で説明したとおり、トップページは設定変更によって見た目を変更することが可能です。
一方で記事ページについては、実は設定変更で見た目を変えられる項目はごくわずかです。
モバイル表示の記事ページ上部です。
上から、ヘッダーエリア、サムネイル画像、公開日表示、タイトル、説明文、SNSボタン、目次、本文、大見出し、画像、本文、中見出し…、と各ブロックが並んでいます。
この部分の見た目を変更するとしたら、一番かんたんなのは、挿し絵となる画像素材やバナー画像を設置することです。
記事作成画面で「画像」を追加しても良いですし、コンテンツウィジェットを使って見出し上のバナー画像を設定しても良いでしょう。
記事作成のはじめ方②【コンテンツ作成の前半】 | CREAMサポートブログ
https://media.cream-cms.com/blog/articles/31#outline12メディア構築CMS「CREAM」を使って記事を書く流れを説明します。はじめて使う方でもわかるよう、できるだけ丁寧に紹介します。2つ目の記事はコンテンツ作成の前半です。
広告収益アップ！メディア記事内広告「コンテンツウィジェット」の使い方 | CREAMサポートブログ
https://media.cream-cms.com/blog/articles/16広告収益型のメディアサイトで実績が多いCREAMには、広告掲載場所を設定する「ウィジェット」という機能が3種類あります。その中で、使い方次第で広告収益改善が期待できる記事内広告「コンテンツウィジェット」機能を紹介します。
設定変更ではなく「CSS設定」機能を使う
例えば、
・ヘッダーエリアの表示高さ
・目次の背景色
・大見出しのフォントサイズ
・本文テキストの行間
などを変更したい場合を例にすると、設定変更できるボタンやスイッチを用意してありません。
この場合は、CSS設定の機能を使います。
以下の引用にある、②に相当するものです。
CREAMの仕様としては、WordPressでいう「テーマ」のような、デザインやレイアウトなどのテンプレートの概念がありません。
そのため、大きくわけると以下3方向の対応が行われています。
①管理画面からデザイン設定する
②CSSを管理画面から追記する
③SODAがデザイン改修を行う（有償）
「CSS設定」は、HTML/CSSの知識ある上級者向けの機能ですので、ここでは説明を割愛します。
モバイル表示の記事ページの見た目（下部）
モバイル表示の記事ページの下部です。
上から、最新の投稿、ランキング、最近話題のキーワード、カテゴリー一覧、カテゴリーにひも付くキーワード、SNSボタン、フッターエリア、の各ブロックが並んでいます。
ランキングの順位表示の背景色（アクセントカラー）の変更は、以下で紹介しました。
https://media.cream-cms.com/blog/articles/65#outline6
フッターエリアの色変更は、以下で紹介しました。
https://media.cream-cms.com/blog/articles/65#outline16
ランキングの項目テキストについては設定変更が可能です。
設定の場所は以下です。
管理画面トップ > 詳細設定
ランキング設定
例えば、このようにテキストを変更できます。
その他の見た目の変更は
その他の見た目の変更は、やはり「CSS設定」機能を使うことになります。
例えば、テキストのフォントファミリーやサイズを変更したり、記事ページ全体の背景色を指定したり、特定のブロックにだけ枠線を表示したり、さまざまな見た目の変更や装飾を行えるのが「CSS設定」です。
ですが、サイト全体のレイアウト崩れやコンテンツの非表示など、意図しないトラブルが発生することもあります。くれぐれもスキルを持った担当者だけの活用に留めて、トラブルが発生しても元に戻せるようにしておきましょう。
