アトラスの使い方

ランキングと表機能の使い方

ATLAS(アトラス)にはワンクリックランキング機能を搭載しています。
この機能をうまく活用すれば高速でランキング記事を作成することができます。

ランキングタイプは2種類用意しています。
ひとつは画面幅いっぱいのダイナミックなレイアウト。
もうひとつはコンパクトな表示ができるレイアウト。

順位も10位まで対応しています。
また、ランキングページでよく使う評価欄に見やすい「☆」(星マーク)を表示させることも。

もちろん表示はレスポンシブ対応なのでスマホでも見やすく表示されます。

ランキングの使い方

エディター上にあるランキングボタンをクリックするとランキングのフォーマットが自動で挿入されます。

ランキング①の設定

ボタンをクリックすると下図のようなランキングが挿入されます。

ATLASのver.150よりショートコードが変更になりました。

[star5] → 

  → 

[star1] → 

順位のショートコードは数字部分を変えてください。
実際にランキングを作る様子を収録してみましたので参考にしていただければと思います。

ランキング②の設定

基本的にはランキング①と同じですが、こちらは王冠のイラストが少し小さめに表示されるショートコードになっています。

同じように数字を入れ替えていけば表示がかわります。

ランキングで「」を増やすとレスポンシブ表記が崩れる場合があります。

※プラグイン「TinyMCE Advanced」がインストールされていると下記の表作成サポートツールは表示されません。

表機能の使い方

ランキングとは別によく使うような表スタイルもあらかじめ登録しておきました。
下図の赤枠の部分が表挿入ボタンです。

使い方はランキングと同じになります。
好みに応じて行を追加したり削除したりもできます。

セルの背景色を変える

アトラスのランキング機能はテーブルで作成されています。

セルの背景色を変えたい場合はWordPressに標準装備されている【テーブル】の項目から個別に変更することができます。

※個別に設定するのが面倒な場合

上記の方法ではセルごとに設定が必要ですので、ランキングの項目が多いと面倒です。
色を変更したいセルが多い場合は下記の方法をお試しください。

  1. プラグイン「Add css to post」をインストールして有効化します(詳しくはこちらから)
  2. 投稿画面にCSSを入力できるフォームがでてくるので下記をコピペします。(backgroundの色を自由に変更してください)

.ranking01 tbody tr th,
.ranking02 tbody tr th,
.cps-table01 tbody tr th,
.cps-table02 tbody tr th,
.cps-table03 tbody tr th{
background:#fef4f4;
}

※色の変更はプレビューか公開記事のみに反映されます。エディター内では確認できませんのでご了承ください。

 

ATLASマニュアル一覧にもどる

ABOUT ME
赤石カズヤ
赤石カズヤ
WEBコンテンツ制作・開発をしながらのんびり活動中。常識に縛られず、ビジネスの仕組み化を常に意識。気が向いたときにWordPressのカスタマイズのことを発信してみたり。
新次元のWordPressテーマ【JIN】をリリース!

アフィリエイターで有名なひつじさん(@hituji_1234)とコラボし、史上最高とも呼べるWordPressテーマ【JIN】を開発しました!

開発期間は11ヶ月と非常に長くかかりました。
【使う人】【見る人】それぞれの立場にたって、何度も何度もブラッシュアップを重ねたためです。

その結果、デザイン性・使い勝手・SEOの3つがとてつもないレベルで融合したテーマになりました!
ひつじさんと2人で特設サイトを作りましたので詳しくはそちらでどうぞ!

JIN特設サイトデモ一覧