【 MesoColumn 】無料のワードプレス・テーマMesoColumnの使い方

【 MesoColumn 】ワードプレス・テーマのインストールとカスタマイズ方法

※この記事は2017/3/27日時点のバージョン4.7.3のワードプレスを使用したスクリーンショットを利用しております。使用するテーマMesoColumnのバージョンは1.6.5.1です。

目次

MesoColumnとは

ワードプレスのテーマであり、無料で利用することが可能です。特徴としてはその見た目、タンブラーやピンタレストのように、記事やカテゴリーごとに自由に配置することが可能でありスライドにも対応、豊富なウィジェット、その他、細かい部分までしっかりと設定できるタイプのテーマです。使い方としては幅広いジャンルや話題、商品などを取り扱っているサイトであれば、賑やかかつ、楽しそうにコンテンツを広げることが出来ます。サムネイルとその本文の調整を上手に配置することで、ユーザビリティも高く、見に来た時にお目当ての記事だけではなく、まるでウィンドウショッピングのように他の記事も眺めて楽しめるような素敵なページを作成できるテーマです。

インストール

それでは早速ですが、ワードプレスのテーマ「MesoColumn」のインストール手順についてご説明します。

まずはMesoColumnをダウンロードします。

https://ja.wordpress.org/themes/mesocolumn/

上記URLにアクセスすると、「MesoColumn」のダウンロードページが表示されます。ここではページ右側「ダウンロード」をクリックして、パソコンに保存します。なお、保存する場所については任意ですが「mesocolumn.1.6.5.1.zip」は.zip形式のまま解凍しないようにしましょう。ワードプレスでテーマをインストールする時は、.zip形式で圧縮されたままアップロードしてインストールすることが可能となっております。
1x1.trans

次は、ワードプレスにログインして、ダッシュボードを表示します。ダッシュボードの左側の外観をクリックします。メニューが開くので、その中のテーマをクリックします。

こちらはまだワードプレスにテーマをインストールしていない状態のスクリーンショットです。画面左上の「テーマ」という文字列の右側に「新規追加」というボタンがあるので、そこをクリックします。
1x1.trans

画面が移動したら、また画面左上の「テーマを追加」の文字列の右側にある「テーマのアップロード」というボタンをクリックします。
1x1.trans

テーマのアップロードをクリックすると、上記のようにファイルの選択を促す表示が出るので、「ファイルを選択」をクリックします。ダイアログが開きますので、先ほどダウンロードした「mesocolumn.1.6.5.1.zip」を選択します。
1x1.trans

ファイルが選択されると、上記のように「ファイルを選択」の右側に「mesocolumn.1.6.5.1.zip」が表示されます。表示されたことを確認して、その右側の「今すぐインストール」をクリックします。
1x1.trans

「今すぐインストール」をクリックすると、上記のような画面になります。次は青文字で下線のある「有効化」をクリックします。
1x1.trans

下記のように画面が移動します。
1x1.trans

ここまでが、ワードプレスでテーマをインストールする方法と、インストールしたテーマを有効化する手順となっております。

試しにいくつかテスト投稿とカテゴリの設定をして表示してみました。

このように表示されます。しっかりとしたマガジン風のテーマであるということがわかりますね。これで何もカスタマイズしていない状態の表示です。
1x1.trans

こちらはワードプレスのテーマ「Twenty Seventeen」を有効化した場合のサイトのトップページです。こうしてテーマごとに違いがあることが理解出来ます。
1x1.trans

次は、ワードプレスのダッシュボードに戻り、画面左側の「外観」をクリックします。そして、MesoColumnのテーマのサムネイルにカーソルを合わせます。「テーマの詳細」という表示が出ますので、クリックしてみましょう。
1x1.trans

MesoColumnについての説明が表示されます。
1x1.trans

ここで確認しておくのは画面右下の部分です。
“”タグ: buddypress, white, two-columns, three-columns, right-sidebar, responsive-layout, flexible-header, editor-style, custom-colors, custom-menu, custom-header, custom-background, featured-images, full-width-template, theme-options, threaded-comments, microformats, rtl-language-support, translation-ready””

上記の引用の部分がテーマごとに違いがあります。これがMesoColumnの主要なデザインの要素・機能・設定することが可能な項目となっています。これらを確認することで、テーマをインストールした時に、どのようなものがあるのか、すぐに確認することが可能です。

外観・カスタマイズ

次はインストールしたテーマのカスタマイズをします。先ほどと同じように、ダッシュボードの左側の外観をクリックして、「有効化:MesoColumn」の文字列の右側にある青地白文字の「カスタマイズ」をクリックします。
1x1.trans

カスタマイズ

カスタマイズをクリックすると、下記のような画面に移動します。
1x1.trans

これがワードプレスのテーマ「MesoColumn」をカスタマイズする画面です。一般的にカスタマイズと聞くと、もともとあるプログラムやコードを改変したり、改造するイメージがありますが、ワードプレスでは表示される文字列や配置など、テーマごとに設定できる項目を変更することを意味します。
ワードプレスでテーマのカスタマイズをするというのはWeb上で、実際にサイトをどのように表示したいのかを自分自身で自由に設定することです。スクリーンショットを見るとわかりますが、青い丸の中に鉛筆のアイコンが何箇所か表示されていますね。これをクリックすると、その項目を編集することが可能になります。

サイト基本情報

それでは早速、サイト基本情報の部分をクリックしてみましょう。

下記の画面に移動しました。ここがMesoColumnのタイトルやキャッチフレーズ、ロゴを設定することが可能です。
1x1.trans

項目についてひとつひとつ見てみましょう。

サイトのタイトル、キャッチフレーズ

サイトのタイトルは名前、キャッチフレーズは簡単な自己紹介です。ここは何をするところなの?どんなサービスなの?その疑問にすぐに答えることで、ユーザーに安心感を与えることが出来ます。

Site Logo、Fav icon

ここでサイトの顔とも言えるロゴが設定できますね。同時にファビコンの設定もできるようです。ロゴやファビコンについては視覚的にここだ!と検索エンジンの結果から来て、ページごとに閲覧しているユーザーにも覚えてもらいやすいので、必ず設定しましょう。そういえば前も違うことでここのサイト見たかも?といった形の印象を与えることが出来て、他のページやコンテンツも見てくれるようになります。

サイトタイトルとキャッチフレーズを非表示

デザインや他に伝えたいことを優先したい場合や、サイトタイトルが会社名、キャッチフレーズが文章ではなく、簡単な単語による企業紹介の場合に非表示にすることも検討出来ます。Webページ全般におけることですが、ファーストキャッチとしてのイメージはとても大切であり、サイトタイトルやキャッチフレーズが固いと感じたり、意味が伝わりにくい場合にも非表示にしておくことでページに対する好感度を上げることが可能です。

サイトアイコン

サイトアイコンはサイトのアプリとブラウザーのアイコンとして使用されます。アイコンは正方形で、幅・高さともに 512 ピクセル以上である必要があります。
画像が選択されていません

こちらについてはワードプレスのコミュニティなどで表示されるアバターだと考えて頂ければわかりやすいですね。デフォルトよりはなにか設定しておくほうが良いでしょう。

一般

カスタマイズの画面に戻り、次は一般をクリックしてみましょう。投稿・スライダー・その他・カスタムCSSという項目がありますね。ひとつひとつ見てみましょう。

投稿

投稿をクリックすると下記の画面に移動します。ひとつずつ見てみましょう。
1x1.trans

アイキャッチ画像サイズ

・Thumbnail
・Medium
・Large

こちらはアイキャッチのサイズを3種類から選べるというものですね。デザインや使用する写真・画像などによって変更すると良いでしょう。試しにLargeにしてみます。

下記のように大きく表示されました。
1x1.trans

一度、Thumbnailに戻します。

ブログ投稿スタイル

・Default
・Magazine

こちらはブログの投稿スタイルを変更するものですね。
試しにMagazineを選択してみましょう。
1x1.trans

表示が二列になりました。

先ほどのアイキャッチ画像のサイズをMediumにしてみます。
1x1.trans

画像が大きく表示されますね。元に戻します。

1つ目の画像をおすすめサムネイルとして表示する

・Disable
・Enable

こちらは記事を投稿する時に挿入した画像を利用するという機能ですね。オフにすると手動で設定をしなければいけないのでこのままにしておきます。

続きを読むテキストを入力

・Continue Reading

こちらはデフォルトで英語表記になってます。「日本語で続きを読む!」に変更してみます。
1x1.trans

ここの文字列はとても重要です。デフォルトのままでも良いですが、見てもらえるように工夫が可能な部分ですので色々試してみましょう。一応、Continue Readingに戻しておきます。

抜粋の文字数を入力

・30
こちらは記事の先頭部分の文字列をどれだけ表示するか、というものですね。試しに120にしてみます。
1x1.trans

この部分についてはトップページ・フロントページであれば、検索エンジンのクロールの対象となるので、記事を作成する時から意識付けしなければならないところです。よく、最初に挨拶ですとか、本題に入る前に的な記事を書かれる方は、個別で設定できるようなプラグインを導入し、本題をクロールしてもらえるようにしましょう。こちらも30に戻します。

関連記事の表示

・Disable
・Enable

関連数を選択

こちらはブログページで、同じカテゴリーやタグを持つ投稿へのリンクの促しですね。関連記事を提供することはユーザーにとっても優しいページであると言えます。その前の投稿や、違うページに知りたいことがあっても、気が付かない可能性も十分にあるからです。この設定についてもなるべくONにしておきましょう。

著者プロフィールの有効化

・Disable
・Enable

著者プロフィールをしっかり作っている場合はEnableにすることがおすすめです。しかし、企業ページなどで特に担当を出さない、という場合はこちらはDisableのままで大丈夫です。

パンくず表示

・Disable
・Enable

Continue Readingをクリックして、パンくず表示をEnableにしてみます。
1x1.trans

ページタイトルの上に小さいですがパンくずが表示されました。こちらも今、ユーザーがどの位置にいるのかがわかりやすいので、デザインとの兼ね合いを見て、有効にするかを考えましょう。今はDisableに戻しておきます。

アーカイブヘッダー

・Disable
・Enable

コメント停止通知を有効化

・Disable
・Enable

コメントの購読を有効化

・Disable
・Enable

メインメニューの自動サブカテゴリーを有効化

・Disable
・Enable

上記までの設定についてはご自身で表示を確認してみましょう。カテゴリーやタグ、サブカテゴリーなどが設定されていないと表示されないものもありますので、ある程度記事を充実させてから試してみることも大切です。それでは一つ前の画面に戻りましょう。

スライダー

スライダーをEnableにして、カテゴリーIDを設定、表示する投稿数を設定すると、トップページが下記画像のように変化します。
1x1.trans

これは視覚効果がとても高く、ユーザビリティについても良いページに変化していると言えますね。一番伝えたいことを順番に表示することで、ユーザーが何もアクションを起こさなくても伝えられるメッセージ量が増加します。ただ、スライダーに表示する内容によっては飽きてしまうこともあるので、きちんと選別した方が良い部分でもあります。こちらも今は元に戻して、また一つ前の画面に戻りましょう。

その他

次はその他の部分をクリックします。
1x1.trans

その他の設定

テーマ作者のフッタークレジット
テーマ作者のフッタークレジットを有効化または無効化します。
*任意ですが、フッタークレジットの表示か、テーマのサポートへの寄付を検討していただけたら幸いです。

・Disable
・Enable

こちらはテーマを作った人のお願いが書いてありますね。作ったのはこの人ですと記載して欲しいということと、そうでなければ、寄付をお願いしたいということです。企業などで、余裕がある場合はこういったものについては積極的に寄付した方が良いです。基本的にテーマなどを作る人は無料で、その人にお金が入るということは少ないです。しかし、企業や個人の方がこうしてテーマを使ってくれて、そこの一番下でも名前が乗れば嬉しいですよという意味なんですね。こちらは任意でもあるようです。

投稿の Schema.org マークアップ

投稿のスキーママークアップを有効化または無効化します

・Disable
・Enable

パンくずリストの Schema.org マークアップ

パンくずリストのスキーママークアップを有効化または無効化します

・Disable
・Enable

こちらはSEO対策向けの機能ですね。Enableにすることで投稿記事をスキーママークアップしてくれるようです。簡単に説明すると、検索エンジンが記事をクロールした時、よりその中身を理解しやすく噛み砕いておく、ということですね。こちらはEnableにしておきましょう。

レスポンシブレイアウト

小型スクリーンやモバイルでレスポンシブモードを有効化または無効化します

・Disable
・Enable

レスポンシブについて一番わかりやすいのは、パソコンであれば自分でブラウザの横幅を狭めたり広げたりすることです。画面サイズ、ブラウザのサイズに合わせてスタイル・見栄えが変化するというもので、基本的にはパソコン・タブレット・スマホに合わせて作成されます。伝えたい内容によっては、レスポンシブだとデザイン的に変になる場合や、そのままのデザインをどの端末でも見せたいと思ったらこちらをDisableにしましょう。

カスタムCSS

カスタムCSSはテーマに関係なく共通なことが多いため、1つのページでまとめさせて頂きました。

ワードプレス・テーマ内にある追加CSSの使い方

フォント

カスタマイズのトップに戻りましょう。次はフォントをクリックします。
1x1.trans

サイトのフォント設定を保存します。

・全体
・フォントの太さ
・見出し
・フォントの太さ
・ナビゲーション
・フォントの太さ

フォントの設定になりますね。こちらについてはデザインの分類です。見やすさも大事ですが、作成した記事の内容や文章のクセによっては、文字サイズを変更すると折り返す位置が変わったり、区切りがおかしくなったりもします。こちらもお好みで色々と試してみましょう。

カスタマイズのトップに戻ります。

次は色をクリックしてみましょう。
1x1.trans

・ヘッダーテキスト色
・背景色
・配色
・トップナビゲーションの背景色
・フッターの背景色

サイト内の色の上記の項目が設定できますね。ワードプレスのテーマのカスタマイズは
機能に対してだけでなく、こうして全体の色やフォントを細かく設定することも含まれます。カスタマイズのトップに戻りましょう。

トップページのおすすめカテゴリー

トップページのおすすめカテゴリーをクリックしてみましょう。
1x1.trans

カテゴリーを選択・レイアウトとスタイルという項目がありますね。ひとつひとつ見てみましょう。

カテゴリーを選択

下記はテスト投稿したものをひとつずつカテゴリーの項目に入れた表示です。こうしてカテゴリーの順番を決め、見せる記事数を設定することで、見てほしいもの、そして順番などについても自分で任意に設定することが可能となっています。
1x1.trans

この項目はこのままで、一つ前の画面に戻ります。

レイアウトとスタイル

1x1.trans

トップページのおすすめカテゴリーレイアウト設定

おすすめカテゴリーレイアウト

・Default
・All Thumbnail
・All Medium

この項目をAll Thumbnailにしてみます。

1x1.trans

サムネイル画像が小さくなり、雰囲気が変わりました。
1x1.trans

カテゴリーの RSS フィードリンクを有効化

・Disable
・Enable

こちらをDisableにしてみます。
1x1.trans

フィードのアイコンが消えましたね。SNSやフィードの登録ボタンなどは、乱用しすぎるとユーザーが嫌がります。理由としては既に登録した人であれば邪魔ですし、そもそもSNSやフィードを利用してない人にはもっと邪魔です。デザインのことを考えながら、配置をするかどうかを考えましょう。

各投稿の文字数

・20

こちらの項目を100にしてみました。
1x1.trans

文字の量が増えましたね。記事を作成する時、この部分と検索エンジンの検索結果で表示される部分の文字については意識したほうが良いです。理由としては、SEO対策というだけでなく、サイトに入ってこない人に対して、たとえ検索エンジンの検索結果で見ていたとしても、あなたのページの内容を伝えることが出来るからです。ここの項目は元に戻して、カスタマイズのトップに戻ります。

広告

次は広告をクリックして、広告の位置をクリックします。
1x1.trans

広告表示位置を設定します

トップヘッダー

・468×60または728×90の、ヘッダーバナーと広告埋め込みコード

1つ目の投稿ループ

埋め込みコードや画像バナーを追加します。
*‹script› タグは使用できません。スクリプトを使用する方法は faq.txt をお読みください。

2つ目の投稿ループ

埋め込みコードや画像バナーを追加します。
*‹script› タグは使用できません。スクリプトを使用する方法は faq.txt をお読みください。

個別投稿上

個別投稿の上に広告コードを挿入します。
*‹script› タグは使用できません。スクリプトを使用する方法は faq.txt をお読みください。

個別投稿下

個別投稿の下に広告コードを挿入します。
*‹script› タグは使用できません。スクリプトを使用する方法は faq.txt をお読みください。

右サイドバー

右サイドバーに広告コードを挿入します。
*‹script› タグは使用できません。スクリプトを使用する方法は faq.txt をお読みください。

ヘッダーコード

任意のコードを挿入します。wp_head() の後に表示されます。
*‹script› タグは使用できません。スクリプトを使用する方法は faq.txt をお読みください。

フッターコード

任意のコードを挿入します。wp_footer() の後に表示されます。
*‹script› タグは使用できません。スクリプトを使用する方法は faq.txt をお読みください。

かなり細かく設定できますね。こちらについてはご利用されている広告に合わせて、自分で設定してみましょう。

広告についての考え方ですが、アフィリエイトなども含めて、儲けよう、お金が欲しいという気持ちが強くなりますと、記事の内容ではなくそちらばかりに目が行ってしまい、コンテンツの質を下げる恐れがあります。最初にワードプレスで何を伝えたかったのか。それらを忘れてしまうことはコンテンツの作成者として失格です。同時に、アフィリエイトでお金を稼ぐということは良いことです。ただ、ユーザーはきちんと見てます。このページはアフィリエイトが目的なんだと思われてしまったら、それまでです。内容がどれだけ素晴らしくても、一度でもそう思ったユーザーは二度と、検索エンジンの先からあなたのページに来てはくれません。アフィリエイトをしたいなと考えているのであれば、ある程度のページビューと、アクセス解析が出来るようになって、コンテンツがしっかりとしてからでも遅くはありません。あなたのページ・サイトのファンになった方に対し、良質なコンテンツを提供したという過去があれば、ちょっとしたアフィリエイトでもしっかりとお金を稼ぐことが出来ます。もちろん、誰でも出来るとか、逆に出来ないとは言いません。覚えておいてほしいのは、感覚としてですが、Youtubeを見ていて、広告があったとします。そしてあなたが本来見たい動画を見ることなく、広告だけがずっと流れていたら、もうYoutubeは見ないとは思いませんか。でも、きちんと見たかった動画が見れて、時々であれば広告としてCMとかが出ても、そんなには怒らないのでは?という意味です。参考にして頂ければと思います。

ヘッダー画像

次はカスタマイズのトップに戻って、ヘッダー画像をクリックします。
1x1.trans

新規画像を追加をクリックした後に、好きなように画像を切り取ることができますが、お使いのテーマはヘッダーのサイズとして 1440 × 300 ピクセルを推奨しています。

新規画像を追加を押してみます。
1x1.trans

無料の素材を使って試してみます。こちらはファイルをアップロードしたものです。左上の写真をクリックします。
1x1.trans

次は右下の青地に白文字の選択して切り抜くをクリックします。
1x1.trans

画面が変わったら、任意の位置で画像を切り抜きます。
1x1.trans

右下のボタンをクリックします。
1x1.trans

下記のように表示されました。
1x1.trans

あれ?と思いませんでしたか。そう、選んだ画像の木目部分と、本来のサイト名の色の表示が被ってしまっています。この場合は画像を差し替えるか、その部分のみ画像を切り抜いておく、あとは文字色を変更するという方法があります。

ワードプレスでテーマをカスタマイズしていると、必ず起こることです。何かを有効にすると、表示が変だったり、逆に無効にすると、大丈夫だったり。これらは試して自分で学ぶしかありません。いつでもリセットできる状態を保つようにしましょう。意外とありがちなのか、どこをクリックして設定したのか、忘れてしまうことです。メモが難しければ、スクリーンショットを撮るクセをつけるようにすれば、設定前の項目、設定後の項目などがわかりやすくなりますので、アドバイスのひとつとしてお伝えしておきますね。

ここでは次の項目で対処する方法を説明します。

Header on top

・Yes
・No

上記選択肢のNoを選択します。
1x1.trans

上記を見ると、サイト名と画像が分離されているのがわかります。こういった形で、すぐに対処できるものもありますから、ご自分で試すということも忘れないようにしてください。一度非表示にして、カスタマイズのトップに戻ります。

背景画像

次は背景画像をクリックしてみましょう。
1x1.trans

ここでは背景画像が設定できますね。背景画像も無料画像で設定してみましょう。

画像を選択をクリックします。
1x1.trans

左上の画像を選択します。
1x1.trans

適用します。
1x1.trans

画面が変わりましたね。ここで背景画像の設定が細かく変えられることがわかります。
1x1.trans

ここでは背景画像は削除します。カスタマイズのトップに戻りましょう。

メニュー

次はメニューをクリックしてみます。
1x1.trans

・メニューの位置
・トップメニュー
・ソーシャルリンクメニュー

上記のような表示が出ました。

メニューの位置をクリックしてみましょう。

メニューの位置

こちらでは選択と書いてある部分にトップメニューとソーシャルリンクメニューが選べるようになっています。

トップメニューのところのプルダウンをクリックしてソーシャルリンクメニューに変更してみます。
1x1.trans

一番上段のメニューがソーシャルリンクメニューに変更されました。
1x1.trans

その他の項目についてもクリックして変更を試してみましょう。

一つ前の画面に戻ります。

トップメニュー

現在のトップメニューの項目やリンク先が設定できますね。表示位置についても設定が可能であることがわかります。
1x1.trans

ソーシャルリンクメニュー

次に一つ前の画面に戻り、ソーシャルリンクメニューをクリックします。トップメニューと同様に項目とリンク先の設定が出来ます。
1x1.trans

こうした項目についてはしっかりとその並び順や配置を考えることでユーザビリティをアップすることが可能です。SNS・ソーシャルリンクについても無いよりはあったほうが、という場合もありますし、デザインのことを考えるとあってもひとつかふたつに絞ることも考えて良いのではと感じます。カスタマイズのトップに戻ります。

ウィジェット

次はウィジェットをクリックしてみましょう。
1x1.trans

・タブ付きサイドバー
・左サイドバー
・フッターウィジェットエリア1
・フッターウィジェットエリア2
・フッターウィジェットエリア3
・フッターウィジェットエリア4

上記の項目が並んでいます。ひとつずつ見てみましょう。

タブ付きサイドバー

現在の設定ではタブ付きのサイドバーについては表示されていません。テーマを選び、機能をフルに使いたい時はある程度設定が進まないと、クリックなどで変更しても変化が見られないことがあります。
1x1.trans

他の項目も設定した後に、後で戻ってきて設定してみましょう。一つ前の画面に戻りましょう。

右サイドバー

次は右サイドバーをクリックします。
1x1.trans

こちらで現在右サイドバーに設定されている項目が確認できますね。アクセスなどの要素は、表示しておくことで安心感を与える場合もあります。同時にここにごちゃごちゃと盛り込みすぎるのもよくありません。全体のデザインのバランスを見て配置するようにしましょう。一つ前の画面に戻ります。

フッターウィジェットエリア1

ここでこのサイトについて、という項目と検索が設定されていることがわかります。
1x1.trans

その他のフッターウィジェットエリアを設定してみます。

一つ前の画面に戻りフッターウィジェットエリア2をクリックします。
ウィジェットを追加をクリックすると項目が表示されます。
1x1.trans

アーカイブとカテゴリーを設定してみます。
1x1.trans

下記のように表示されました。
1x1.trans

次は一つ前の画面に戻ってフッターウィジェットエリア3をクリックします。
カレンダーとメタ情報を設定してみました。
1x1.trans

一つ前に戻りフッターウィジェットエリア4に移動します。
ここではおすすめのカテゴリーを設定してみました。
1x1.trans

上記のように細かく設定することで、サイト内の情報などをしっかりと伝えることができます。配置や必要な項目などはよく考え、情報量が多すぎないようにしてあげることで、逆に見やすいページになることも検討する価値は十分にありますよ。カスタマイズのトップに戻ります。

固定フロントページ

カスタマイズのトップで固定フロントページをクリックします。
1x1.trans

フロントページの表示

● 最新の投稿
○ 固定ページ

固定フロントページとはブログの投稿をサイトのトップにするか、固定ページにするかを選ぶ項目です。初期設定でフロントページは固定ページに設定されています。現在は最新の投稿を選んである状態です。固定ページに変更してみましょう。

フロントページをホームページに変更してみました。
下記のように表示されます。
1x1.trans

+新規固定ページを追加

上記をクリックすると固定ページを新しく作ることが出来ます。固定ページはブログのように時系列でのコンテンツというよりは、時間軸とは別で、伝えたいコンテンツとして利用するのがとても便利です。

プレビューモードの選択

画面の左下にアイコンで表示されていますね。こちらをクリックすることでそれぞれの端末での表示を確認することが可能です。

デスクトッププレビューモードに入る
1x1.trans

タブレットプレビューモードに入る
1x1.trans

モバイルプレビューモードに入る
1x1.trans

このようにテーマのカスタマイズをする時には端末ごとの見栄えをしっかりと確認することが大切です。文字数によって、パソコンだとちょうどよくても、スマホだと3行くらいになったりすることもあります。テーマやデザインはしっかりとしているのに、意外と文字列の長さや、折り返す位置などを気にしない場合がありますから、これもひとつのアドバイスとして覚えておいてくださいね。

MesoColumnをテーマ一覧から削除する。

テーマを削除する時はまず別のテーマを有効化する必要があります。デフォルトのテーマなどに変更した上で、外観をクリックし、MesoColumnにマウスカーソルを合わせるとテーマの詳細という文字が表示されるのでクリックしましょう。

MesoColumnについての詳細が表示されます。画面右下に赤文字で削除という文字列があるので、そこをクリックすればMesoColumnをテーマ一覧から削除することが可能です。
1x1.trans

ここまでがMesoColumnをインストール・カスタマイズ・削除までの手順となります。

まとめ

このテーマは自分の作成したコンテンツや記事をまるでおもちゃ箱のように散りばめることで、ユーザーに好奇心が出るようになっており、ひとつ読めばもうひとつ読んでみようとい気持ちにさせます。

オプションなどの設定を進めていくと、広告についてもしっかりと項目があり、ギャラリー・マガジン風のデザインにマッチする配置がなされているのも秀逸です。

アフィリエイトや広告なども、使い方によってはそれ自体がコンテンツです。ユーザーが良しとするような全体的なデザインをすれば、自分の好きなことで収益を上げられるテーマなのではと感じました。