「サイドバーの設定とプラグイン」の記事一覧

サイドバーのカテゴリーアーカイブから記事の個数を消す方法と順番並べ替え方法

どこのどなたか存じませんが、このブログに「カテゴリー一覧の数字を消したい」と検索してきた方がいらしたのでその方法を書いておきます。ついでと言っては何ですがカテゴリー一覧の並べ替え方法も書いておきます。

ただ、出来るのはパソコン画面限定の設定です。スマホやそれ以外のケータイ用に同じ設定をする場所はファンブログにありません。

このページの内容
  • カテゴリー一覧の数字を消す方法(PCのみ)
  • サイドバーのリンクの下線を消す方法(PCのみ)
  • カテゴリー一覧の並べ替え方法
  • カテゴリーの名前を変える方法、削除する方法

カテゴリー一覧の数字を消す方法

After
p42-9.png

Before
p42-6.png

数字を消したいということは、もうサイドバーに「カテゴリーアーカイブ」のパーツはつけてあると思います。ですからサイドバーにパーツを設置するページの開き方はご存知なんだと思いますが、これからやる方のために説明します。

サイドバー設定ページの開き方

トップページで下の図の「デザイン」を押します。

p42-1.png

すると次のページに移るので、下の図の「コンテンツ(サイドバーの編集)」と書かれたところを押します。

p42-2.png

そして開いたページでサイドバーの設定が出来ます。

p42-3.png

このページでは、サイドバーへツールを配置する方法は説明しませんが、わからない方は「プラグインの設置方法」のページをご覧ください。やり方はそれと同じです。

サイドバーテンプレートの編集

カテゴリー一覧で表示される各カテゴリーの「投稿数」を消すには、サイドバーテンプレートの編集が必要です。だけど、この後説明する箇所を消すだけなので簡単です。

サイドバーに配置してある「カテゴリーアーカイブ」の歯車マークを押すと次の画面が浮かび上がります。その右上にある「コンテンツHTML編集」という文字を押します。

p42-4.png

すると次の画面に切り替わります。ここに書いてあるのがテンプレートです。

p42-5.png

具体的には下のように書かれています。

<div class="sidetitle"><% content.title %></div>
<div class="side">
<% content.header -%>
<% loop:list_category -%>
<% unless:category.no_category %><a href="<% category.page_url %>"><% category.name | tag_break %></a>(<% category.article_count | __or__ | echo("0") %>)<br /><% /unless %>
<% /loop -%>
<% content.footer -%>
</div>
この中の赤字の部分が投稿数を表示する場所です。なので、</a> と <br /> の間にある赤字部分

(<% category.article_count | __or__ | echo("0") %>)

を消して下さい。

赤字部分を消して一番下の「保存する」ボタンを押せば、サイドバーに表示されるカテゴリー一覧から投稿数が消えます。

Before
p42-6.png

After
p42-7.png

もし、設定が反映されないならキーボードの「F5」ボタンを押してみて下さい。画面が再読み込みされ反映されることがあります。関連ページ「ファンブログの投稿やコメント数の表示が更新されない時の対処法

サイドバーのリンクの下線を消す方法

もし、文字の下の線を消したい場合は、スタイルシートのいちばん最後に次のように追加します。

.side a {
 text-decoration: none;
}

これで文字の下の線はなくなります。

Before
p42-7.png

After
p42-9.png

スタイルシートを書く場所は次の通りです。

まず、サイドバーの編集ページの上にある「CSSの編集」という文字を押します。

p42-8.png

すると次のページが開きます。これがスタイルシートの編集画面です。

p42-10.png

このスタイルシートのいちばん最後に先ほどの

.side a {
 text-decoration: none;
}

を追記して保存します。 .side a { のいちばん左には . ドットがあります。これを抜かさないで下さい。

なぜ一番最後に書くのか?
もし、スタイルシートの中で同じ設定が書かれていた場合、先に書いたものは後に書いたものに上書きされます。なので、もしお使いのテンプレートが「サイドバーのリンクに下線をつける」設定をしていた場合、最初に書いても上書きされて有効になりません。

カテゴリー一覧の並べ替え方法

カテゴリー一覧の並べ替えは設定ページで出来ます。管理画面のトップページで「設定」を押して設定ページヘ移動します。

p42-11.png

開いたページで、今度は「カテゴリ設定」を押します。

p42-12.png

そして開いたページでカテゴリーの並ぶ順番は変えられます。

p42-13.png

カテゴリーが並んでいる一覧のいちばん右の項目に「表示順」というのがあります。ここに書かれた数字が小さい順にカテゴリーは表示されます。ですから、この「表示順」の数字を書き変えて「保存」ボタンを押せば並び変わります。

この時のコツは1、2、3という順に1づつ多くするのではなく、10個づつ増やすことです。

例えばいちばん最初のカテゴリーと2番目のカテゴリーの間に追加したい場合、1、2、3と数字をつけていると追加したのが2になるので、その後全部の数字を書き変えないといけません。

  • 1.いちばんオススメのカテゴリー
  • 2.次にオススメのカテゴリー
  • 3.その次にオススメのカテゴリー
  • 4.オススメしないカテゴリー

となっているのを変更するとしたら、2から後ろは全部書き直しです。

  • 1.いちばんオススメのカテゴリー
  • 2.期間限定カテゴリー
  • 3.次にオススメのカテゴリー
  • 4.その次にオススメのカテゴリー
  • 5.オススメしないカテゴリー

でも、もし10、20、30という風に数字がついていたのなら、追加したいものの番号は11〜19の間にすればよくて、その後ろの数字を変えなくても済みます。

  • 10.いちばんオススメのカテゴリー
  • 20.次にオススメのカテゴリー
  • 30.その次にオススメのカテゴリー
  • 40.オススメしないカテゴリー

これなら、追加したカテゴリー以外の変更は必要ありません。

  • 10.いちばんオススメのカテゴリー
  • 15.期間限定カテゴリー
  • 20.次にオススメのカテゴリー
  • 30.その次にオススメのカテゴリー
  • 40.オススメしないカテゴリー

カテゴリーの名前を変える方法、削除する方法

つけてあるカテゴリーの名前を変更したい、特定のカテゴリーを削除したいという場合は、変更・削除したいカテゴリーの名前を押します。するとそのカテゴリー専用のページになるので、そのページで名前の変更や削除が出来ます。

p42-14.png

ただ、削除する場合そのカテゴリーのページがひとつでも残っていると警告が出て削除できません。該当するページを全部他のカテゴリーに変える必要があります。

ブログの最新記事一覧を記事内の画像付きでサイドバーに表示するプラグインU 横並びバージョン

前回の「ブログの最新記事一覧を記事内の画像付きでサイドバーに表示するプラグイン」と同じで、サイドバーに画像つきで最新記事を表示するブログパーツですが、レイアウトを変えたものです。ファンブログとSeesaaブログ以外でも動きます。

忍者ツールズに「忍者画像RSS」というのがあるんですが、ファンブログの画像は読み込んでくれないみたいなので変わりに使いたいという方はどうぞ。

ブログのRSSというものを読み込んで最新記事を表示するので、RSSを指定すれば他のブログの最新記事一覧も表示できます。

ただ、将来的に違うドメインのブログの表示はしなくなる可能性があります。対応をやめてもそのブログ自身の最新記事は表示し続けますが、違うドメインのブログを指定している場合は何も表示しなくなります。お使いになる際はその点をご了承下さい。

クロスドメイン制約というのがあって、スクリプトを置いたドメイン以外ではRSSを読み込めないのが理由です。今は違うドメインの時は私の個人サーバーを経由して表示させていますが将来も対応する保証はできません。

前回のは、画像を大きく目立たせて下にタイトルを置いた配置でしたが、今回は今うちのサイドバーで使っているように画像とタイトルが横に並ぶルックスになります。

ファンブログとSeesaaブログでは、テンプレートに合わせて表示が若干変わります。

techs40-2.png

techs40-1.png

使い方

次のソースをサイドバーの自由形式にそのまま貼り付けると、このブログ「ファンブログ テック」の最新記事が5個、「ブログパーツのタイトル」という題名で表示されます。自分のブログの最新記事を表示するには赤文字部分を書き変えます。

<div class="fanblog_tech_plugin_40"></div>
<script>
var fanblog_tech_plugin_40_values = {
  "title"         : "ブログパーツのタイトル" ,
  "rss_uri"       : "http://fanblogs.jp/techs/index1_0.rdf" ,
  "count_max"     : 5 ,
  "image_width"   : 80 ,
  "default_image" : "記事に画像がないときの代替画像URL" ,
  "blank_flag"    : false ,
  "elem_number"   : document.querySelectorAll(".fanblog_tech_plugin_40").length - 1
};
</script>
<script src="http://fanblogs.jp/techs/file/plugin_40.js" charset="UTF-8"></script>

ファンブログとSeesaaブログでのサイドバーへの設置方法は「プラグインの設置方法」をご覧ください。

ブログパーツのタイトルを変更

"title"の行の赤い文字「ブログパーツのタイトル」というところを書き変えると、ファンブログとSeesaaブログではそれがパーツのタイトルとして表示されます。その他のブログでこのパーツを使う場合はここに何を書いても反映されません。貼り付けたブログパーツのタイトルを書き変えて代用してください。それから、反映されなくてもこの行は消さないでください。

書き変える時はタイトルを挟んでいる " を削除しないでください。削除すると動きません。

RSSのURLの設定

"rss_uri"と表示された行に表示させたいブログのRSSアドレスを書きこみます。"rss_uri" と、URLではなくURIと書いてますが意味は同じです。

このURLを書き間違えると、RSSを読み込めないので何も表示されません。

RSSのURLはブログのHTMLの<head>から</head>の間に書いてあるのですが、このブログ「ファンブログ テック」の場合だと下のようになっています。

<link rel="alternate" href="http://fanblogs.jp/techs/index1_0.rdf" type="application/rss+xml" title="RSS" />

このブログのRSSは「http://fanblogs.jp/techs/index1_0.rdf」です。ファンブログの場合は、赤文字のtechsという部分を、自分のブログのものに変えればOKです。

Seesaaブログなら、ブログのURLの最後に index.rdf をつけます。
http://xxxxx.seesaa.net/index.rdf

他のブログも見てみたところ大体次のようになっていました。

  • WordPressの場合は、例外もありますがブログのURLの末尾にfeedとつけるとほぼ間違いないです。
    ブログがhttp://dwm.me/ なら http://dwm.me/feed となります。
  • ライブドアブログだと、ブログのURLの末尾にindex.rdf をつける形です。
    ブログが http://blog.livedoor.jp/xxxxx/ なら http://blog.livedoor.jp/xxxxx/index.rdf
  • FC2ブログだと、ブログのURLに ?xml をつけるみたいです。
    http://xxxxx.blog.fc2.com/ なら http://xxxxx.blog.fc2.com/?xml

書き変える時はタイトルを挟んでいる " を削除しないでください。削除すると動きません。

動かないときはURLを半角でなく、全角アルファベットで書いていないか確認してください。全角アルファベットだと動きません。

表示個数の設定

"count_max"と書かれた行の数字を書き変えると表示される個数が変わります。書き変える際は必ず半角数字で書いてください。全角数字では反映されません。またmaxとなっていますが、指定個数分の記事がなければあるだけしか表示できません。

画像サイズの変更

画像のサイズを変更するには、"image_width"と書かれた行の数字を半角数字で変更します。ここに書かれた数字が80なら80ピクセルの横幅で表示します。高さは元の画像の比率に合わせて表示されます。ピクセルといわれてもピンと来ないという場合はとりあえず80のままで表示してみるです。「これの半分くらいかな?」と思ったら40に変更して、もう一度見てみましょう。

数字は半角数字で記入してください。全角数字だと反映されません。

記事に画像がないときの代替画像URL

画像を使っていない記事に表示する代替画像のURLを書いてください。上の例だと画像のない記事では、このブログの公式アイコンを表示させています。

公式アイコン
公式アイコン

代替画像がない時は必ず、 "" の間の「記事に画像がないときの代替画像URL」という文字を消してください。"default_image"の行は " を2個続けて "" とします。

代替画像が指定されてなく、 " が2個続いている時は次の図の2番目のように表示されます。

techs40-3.png

別窓で表示するかどうかの設定

見ているブログの最新記事を表示しているなら多分必要ないとは思いますが、他のブログの最新記事を表示する場合はリンクを別窓で開きたいかも知れません。その場合は、"blank_flag"と書かれた行の false という5文字を、 true という4文字に半角で書き変えてください。全角で記入しても反映されません。変更せずに false のままなら、別窓でなく同じ窓でページが切り替わります。

以上です。その他の部分を変更すると動きません。

ブログの最新記事一覧を記事内の画像付きでサイドバーに表示するプラグイン

ブログの最新記事一覧を画像付きでサイドバーに表示するJavaScriptのプラグインです。

ファンブログはひとり5個までブログを作れますが、自分の別ブログや友達のブログの最新記事一覧も表示できます。具体的な表示例は下のサンプルをご覧ください。

ファンブログとSeesaaブログ以外でもサイドバーに貼り付ければ動きます。

忍者ツールズに「忍者画像RSS」というのがあるんですが、ファンブログの画像は読み込んでくれないみたいなので変わりに使いたいという方はどうぞ。

Internet Explorerで動いていなかったので直しました。2015年12月6日11:40

サンプル
右サイドバーのテンプレートに設置した場合

サンプル

サンプル

ご覧のように画像メインの表示になりますが、「違う!これじゃない!」という方は別のレイアウトを次のページに用意しています。そちらもご覧ください。

ブログの最新記事一覧を記事内の画像付きでサイドバーに表示するプラグインU 横並びバージョン

ブログのRSSというものを読み込んで最新記事を表示させます。パーツを設置した、そのブログ自身のRSSを指定すればパーツを表示しているそのブログ自身の「最新記事」を表示します。

他のブログのRSSを指定すれば、そのブログの最新記事一覧を表示します。

ただ、将来的に違うドメインのブログの表示はしなくなる可能性があります。対応をやめても同じドメインのブログ記事は表示し続けますが、違うドメインのブログを指定しても何も表示しなくなります。お使いになる際はその点をご了承下さい。

クロスドメイン制約というのがあって、スクリプトを置いたドメイン以外ではRSSを読み込めないのが理由です。今は違うドメインの時は私の個人サーバーを経由して表示させていますが将来も対応する保証はできません。

使い方

サイドバーの自由形式に次のソースを丸ごと貼り付ければ、今ご覧のこのブログ「ファンブログ テック」の最新記事5個が「サイドバーに表示されるタイトル」という題名で表示されます。

赤文字の部分を変えれば表示が変わります。

<div class="fanblog_tech_plugin_39"></div>
<script>
var fanblog_tech_plugin_39_values = {
  "title"       : "サイドバーに表示されるタイトル" ,
  "rss_uri"     : "http://fanblogs.jp/techs/index1_0.rdf" ,
  "count_max"   : 5 ,
  "blank_flag"  : false ,
  "image_flag"  : true ,
  "elem_number" : document.querySelectorAll(".fanblog_tech_plugin_39").length - 1
};
</script>
<script src="http://fanblogs.jp/techs/file/plugin_39.js" charset="UTF-8"></script>

ファンブログとSeesaaブログでのサイドバーへの設置方法は「プラグインの設置方法」をご覧ください。

パーツタイトルの設定

"title" と書かれた行の 「サイドバーに表示されるタイトル」を書き変えればファンブログとSeesaaブログでは、それがサイドバーのパーツのタイトルで表示されます。上のサンプルではここを「別のブログの最新記事」と「更に別のブログ」というタイトルにして2個作っています。

書き変える時はタイトルを挟んでいる " を削除しないでください。削除すると動きません。

ファンブログとSeesaaブログ以外では、ここにタイトルを書いても反映されません。サイドバーに取り付けたパーツのタイトルを書き変えて代用して下さい。また、反映されなくてもこの行は消さないで下さい。

RSSのURLの設定

"rss_uri"と表示された行には表示させたいブログのRSSのアドレスを書きます。"rss_uri" と、URLではなくURIと書いてますが意味は同じです。

このURLを書き間違えると、RSSを読み込めないので何も表示されません。

RSSのURLはブログのHTMLの<head>から</head>の間に書いてあるのですが、このブログ「ファンブログ テック」の場合だと下のようになっています。

<link rel="alternate" href="http://fanblogs.jp/techs/index1_0.rdf" type="application/rss+xml" title="RSS" />

このブログのRSSは「http://fanblogs.jp/techs/index1_0.rdf」です。ファンブログの場合は、赤文字のtechsという部分を、自分のブログのものに変えればOKです。

Seesaaブログなら、ブログのURLの最後に index.rdf をつけます。
http://xxxxx.seesaa.net/index.rdf

全部がそうではないかも知れませんが、見てみたところ大体次のようになっていました。

  • WordPressの場合は、例外もありますがブログのURLの末尾にfeedとつけるとほぼ間違いないです。
    ブログがhttp://dwm.me/ なら http://dwm.me/feed となります。
  • ライブドアブログだと、ブログのURLの末尾にindex.rdf をつける形です。
    ブログが http://blog.livedoor.jp/xxxxx/ なら http://blog.livedoor.jp/xxxxx/index.rdf
  • FC2ブログだと、ブログのURLに ?xml をつけるみたいです。
    http://xxxxx.blog.fc2.com/ なら http://xxxxx.blog.fc2.com/?xml

書き変える時はタイトルを挟んでいる " を削除しないでください。削除すると動きません。

動かないときはURLを半角でなく、全角アルファベットで書いていないか確認してください。全角アルファベットだと動きません。

表示個数の設定

"count_max" という行に表示させたい記事数を半角数字で書きます。半角でなく全角で書くと動きません。max となっていますが、記事が1個しかないのに10と書き込んでも表示されるのは1個です。

表示個数を1個にしてパーツを複数つければ、複数のブログのそれぞれの最新記事を表示することになります。

リンクをクリックした時に、別窓で開くかどうかの設定

他のブログを表示する時は別窓で開きたいこともあると思います。

"blank_flag" と書かれた行の false という5文字を、 true という半角アルファベット4文字にすれば別窓で開きます。半角でなく全角アルファベットで書くと動きません。

初期設定では false になっていますが、この場合は別窓ではなく同じ窓のページが移動します。

画像を表示させるか文字だけにするかの設定

このブログパーツでは、対応する記事の本文から最初に見つかった画像を表示します。ただし、絵文字など20ピクセル以下のものは除外します。

"image_flag" と書かれた行の true という文字を false という半角アルファベット5文字にすれば、画像の表示をやめます。半角でなく、全角アルファベットで書くと動きません。

画像のない記事は画像を表示できないので、「たまにしか画像がないブログのリンクでは画像のある記事だけが目立ってしまう。それがイヤだ」というような場合、またサイズが指定できないので「画像がデカすぎ。それがイヤだ」という場合に設定して下さい。

ただ、ファンブログやSeesaaブログで画像を表示しないなら、元々ある純正ブログパーツで他のブログの記事一覧表示はできます。詳しくは以前書いたページ「別のブログの最新記事一覧をサイドバーに表示する」をご覧ください。

以上です。それ以外の部分を書き変えると動かなくなります。

ファンブログとSeesaaブログでのサイドバーへの設置方法は「プラグインの設置方法」をご覧ください。

サイドバーの自由形式にタイトルを表示させる

seesaa Blog や、ファンブログのサイドバーで自由形式を使う時は、タイトルや、枠が表示されません。これを表示させたい場合は、次のようにすれば出来ます。

サイドバーにタイトルを表示させる

編集画面のタイトルが表示されるようになります。
サイドバーのタイトル

設定方法

コンテンツHTML編集

まず、自由形式の編集画面で、右上の「コンテンツHTML編集」をクリックします。

すると、編集画面に次のソースが表示されます。

<% content.header -%>
<% free_text %>
<% content.footer -%>

このソースを、次の通りに書き換えます。

<div class="sidetitle">
<% content.title %>
</div>
<div class="side">
<% content.header -%>
<% free_text %>
<% content.footer -%>
</div>

書き換えたら、エディタの下の「保存する」をクリックします。「編集を完了しました。」と表示されたら設定完了です。

別のブログの最新記事一覧をサイドバーに表示する

rss.jpg

ファンブログは、ひとり5つまでブログを作れます。そして他のブログの更新情報をサイドバーに簡単に表示できます。

これにはRSSというものを使いますが、取得ツールはサイドバーのアイテムにすでに用意されているので設定するだけで表示できます。

他のブログの記事一覧を画像つきで表示したい場合は「他のブログの最新記事一覧を記事内の画像付きでサイドバーに表示するプラグイン」をご覧ください。

まず、サイドバーの設定画面を開かなければなりませんが、開き方がわからない場合は別の記事に書いてあるので参考にしてください。

プラグインの設置方法
サイドバーの設定画面の開き方が書いてあります。

ページを開くと左の「追加コンテンツ」一覧に「RSS取得」という名前があります。「RSSアイコン」というのもありますが「RSSアイコン」ではなく「RSS取得」の方です。

これをサイドバーの表示させたい場所に、左クリックしたまま移動(ドラッグ)させます。

rss1.jpg

移動させたら、名前の「RSS取得」という文字をクリックすると下の画面が開きます。

rss2.jpg

いちばん上の「タイトル」は「RSS取得」のままでも構いませんが、名前を変えるとサイドバーに表示されるときのタイトルも変わります。

2番目の「RSSのURL」に最新記事のタイトルリストを表示させたいブログのRSSを入れます。詳しくはこの後説明します。

3個目の「取り込み件数」の数で最新記事を何個表示するか決められます。

全部の設定が終わったら「保存する」ボタンを押します。「設定が完了しました」と表示されたら、ウインドウを閉じます。

ちなみに「挿入テキスト(上部/下部)」という文字をクリックすると編集用のエディタが開きます。「挿入テキスト(上部)」に文字を書き込むと、タイトルと記事一覧の間に、「挿入テキスト(下部)」に書き込むと記事一覧の下にそれが表示されます。

しかし、これだけではまだ設定は反映されていません。元の画面に戻ったら忘れずに「設定を反映する」ボタンを押して反映させるとサイドバーに指定したブログの最新記事一覧が表示されます。

rss3.jpg

RSSのURL取得方法

RSSのURLはソースコードの<head>から</head>の間に書いてあるのですが、このブログの場合だと下のようになっています。

<link rel="alternate" href="http://fanblogs.jp/techs/index1_0.rdf" type="application/rss+xml" title="RSS" />

ファンブログの場合、RSSのURLは全てのブログで次のパターンです。

http://fanblogs.jp/そのブログ固有の部分/index1_0.rdf

ちなみにファンブログ以外のRSSも取得できますが、WordPressだとRSSは以下の様になります。

http://そのブログのドメイン/feed

記事ページと一覧ページでサイドバーの表示を違うものに変える

この記事の内容はSeesaa Blog でも同じことなんですが、ファンブログのサイドバーはページの種類によって掲載するものを切り替えられます。

たとえば今、この記事のページの右上には広告が表示されています。しかしトップページやカテゴリーの一覧ページでは右上に私のプロフィールが表示されています。(記事を書いた当時の話です)

sidebar1.jpg
一覧ページ

sidebar2.jpg
記事ページ

サイドバーの切り替え方

サイドバーの編集ページへ移動する

まず、管理画面でサイドバーの編集画面に移動します。

ログインしたばかりの時は、次の画面で編集したいブログの「デザイン」をクリック。

plugin1.jpg

デザイン」画面に切り替わったら「コンテンツ(サイドバーの編集)」をクリックして移動します。

plugin2.jpg

ログイン直後の画面以外からは
sp2.jpg

sp3.jpg

画面上のメニューにある「デザイン」にマウスを合わせると「デザイン設定」「デザイン一覧」「コンテンツ」「html」の4つの項目が表示されるので「コンテンツ」をクリックして移動します。

アイテムの表示を切り替える

今このブログでは、右側のサイドバーに上から「スポンサーリンク」「プロフィール」という順番で配置しています。「スポンサーリンク」は「自由形式」を編集して、名前を変えたものです。

この2つのアイテムのうち、記事ページでは「スポンサーリンク」だけを表示させ、一覧ページでは「プロフィール」だけを表示させています。

sidebar3.jpg

この切り替えには「上級者モード」を使います。

アイテムを並べている場所の上に「上級者モード」と書かれたリンクがあります。これをクリックすると「上級者モード」画面に切り替わります。

sidebar4.jpg

上級者モード」では、「トップページ」「記事ページ」「過去記事ページ」「カテゴリーページ」の4タイプで表示内容を変更できます。

sidebar5.jpg

具体的には「TOP」「記事」「過去」「カテ」とある中で表示させたいページにだけチェックを入れます。

このブログでは「スポンサーリンク」は「記事」にだけ印をつけ、「プロフィール」は「TOP」「過去」「カテ」の3つに印をつけています。

これで記事のページでは「スポンサーリンク」が表示され、それ以外のページでは「プロフィール」が表示されるようになります。

設定を反映させるには、画面右下の「変更」をクリックします。

先ほど「上級者モード」と表示されていた場所に「ノーマルモード 」と表示されているので、そこをクリックすれば元の画面に戻ります。