tcd-theme-widget_ecmg

ワードプレス

サイトを彩る直感設定。WordPressTCDテーマ「オリジナルウィジェット」の使い方

WEBサイトのレイアウトって、メインカラムだけじゃキマらない。サイドやフッターにたたずむ、関連リンクやバナー広告。これらをセンスよく配置させることも欠かせません。

 センスよく・・配置できる自信なんてないっス

そりゃそーっス。普通ならそーっス。で、普通じゃないTCDテーマには各テーマごとに最適な「オリジナルウィジェット」が用意されています。

デザインセンスも必要とされる・・・ハズのWEBサイト制作。「オリジナルウィジェット」にまかしときゃあ解決です。早速どんなモンか見ていきましょう。

ウィジェットとは?

そもそも「ウィジェット」って何モノ?という人もいるでしょう。コレです 

tcd-widget_01

どこで設定すんの?という人もいるでしょう。ココです 

tcd-widget_02

エラいややこしそーやんけ、という人もいるでしょう。余裕です 

tcd-user-review_43

上の場合、トップページの上から3つ目に「おすすめ記事」を設置した、ということですね。

さて、WordPressにデフォルトで実装されているウィジェットに加え、TCDテーマには、それぞれのテーマに適したオリジナルウィジェットが用意されています。このサイトで使用中のテーマ「MAG」の場合を例に、どんなオリジナルウィジェットがあるのかを紹介していきます。

デザインされた記事一覧

パターン1

このテーマでは、「デザインされた記事一覧」ウィジェットが2種類用意されていました。

ひとつ目は「アイキャッチ画像のサムネイル」「記事タイトル」「記事抜粋文」を表示させる、リッチな印象のパターン 

tcd-widget_03

tcd-widget_04

マウスオーバーした時のエフェクトも楽しいウィジェットです 

tcd-widget_05

パターン2

tcd-widget_06

tcd-widget_07

こちらはシンプルなデザインならではの使い方ができるパターン。例えばこのウィジェットを効果的に挟むことで、ゴチャついた印象になりがちなレイアウトを引き締めることができます 

tcd-widget_08

また、どちらのパターンも、表示させたい記事の種類、表示数などを自由に選択できます 

tcd-widget_09

tcd-widget_10

記事ごとの設定も、記事投稿画面内でワンクリック。たったそれだけ。 

tcd-widget_11

カテゴリー一覧

カテゴリー一覧表示だって「ただそこにあるだけ」じゃない。おぉっ!?、と目を引く、気持ちのいいモーションです 

tcd-widget_12

tcd-widget_13

広告

収益化に重宝するのがこのウィジェット。広告を「1箇所に」最大で3つまで設定でき、ページを訪問する度にそれらをランダム表示させます。今回はフッターに設置してみましょう。

tcd-widget_14

「広告1」をクリックして、表示させたいアフィリエイトコードや、Googleアドセンスコードなどを貼り付けるだけ。それを「広告3」まで同様に行います。それだけで・・・

tcd-widget_15

 クリックで拡大

tcd-widget_16

tcd-widget_17

tcd-widget_18

こんなかんじで、ページを訪問する度にランダム表示してくれます。このウィジェットの恩恵は、収益化を考える上ではとても大きなものです。例えば、

紹介したい広告が沢山あっても、広告枠だらけでゴチャついたサイトにならない

同じ場所でランダム表示させることで、収益結果から「効果的な広告」を判断できる

といったことが挙げられます。サイトイメージを損なわずに設置できるだけでなく、トライ&エラーの判断にも貢献してくれる、ということですね。

スクロール追尾型広告

長い記事ページなどでありがちなこと。読み進めてどんどん下へスクロールしていくと・・・・ウィジェットに配置していたものは全部通り過ぎてしまい、「何もないスペース」ができてしまいます。コレ、けっこうさみしいんですよね・・ 

tcd-widget_19

記事によってコンテンツのボリューム(長さ)が違うのは当然なので、しょうがないことです。しかし!この「スクロール追尾型広告」を配置しておくと・・・

tcd-widget_20

広告がスクロールと一緒についてきてくれます!これでもう、さみしくなんてない・・・だけじゃありません。記事を読み終えた後も、横で訴求し続けてくれているわけです。つまり収益化につながりやすい

いつの間にか通りすぎてしまったものを、もう一度振り返って見に行く、なんてことは決して多いとは言えません。広告だけでなく、SNSリンクやフォローボタン、記事リンクや商品ページリンクなどなど・・・いろいろと応用がきく嬉しいウィジェットです

同じような機能を実装するプラグインもありますが、使用テーマとの相性が悪いことも多いので、デフォルトで備わっているのはなんともありがたいですね。

Google AdSense広告の追尾は、規約違反となるのでやめましょう!

Googleカスタム検索

WordPressデフォルトの「検索」ウィジェットでは、検索ワードが含まれる記事のみが、更新順に表示されます。しかも、検索ワードに「完全一致」していなければヒットしません

この「Googleカスタム検索」ウィジェットでは完全一致だけでなく、Googleの検索機能と同等の、精度の高いサイト内検索が可能になります。しかも高速!

tcd-widget_21

tcd-widget_22

さらに、検索結果画面にAdSense広告を絡め、収益化に貢献させることも可能。設定方法はこちらが参考になります 

WordPress-Theme-TCD_Google-Custom-Seach

ユーザープロフィール

このウィジェットはその名の通り、「自己紹介ウィジェット」です。プロフィール画像や紹介文、各種SNSページへのリンクをひとまとめにして設置できます。

tcd-widget_23

tcd-widget_24

必要な項目だけを埋めればシンプルでスッキリしたウィジェットになりますし・・・

tcd-widget_25

全部の項目を埋めれば・・・ 

tcd-widget_26

ここまでボリューミーなウィジェットになります。SNSをたくさん利用している人には、各ページへのリンクをひとまとめにできるので、とても重宝しそうです。

通常であればプラグインで設置するような、SNSページヘのリンクウィジェット。デフォルトで実装されているのでとても助かります。

また、画像にもリンクを設定できるので、別途作ったプロフィールページなどに飛ばすこともできます。応用すれば、「プロフィールウィジェット」としてではなく、「ランディングページ、商品ページなどに誘導するウィジェット」としても利用できそうですね

スマホ用ウィジェット

スマートフォンでの表示は、そのスペースの少なさゆえに、PCでの見栄えとは異なります。特にサイドに設置しているウィジェットは省略されがち。でも、スマートフォンでも「おすすめ記事」などを表示したい時があるんですよね。

『スマートフォンでの表示だけを変更する』なんて、どうやるんでしょう。

CSSやPHPのコードをいじる?どのくらい?どうやって?外注すると○○万円?息巻いて自分でいじってみて、レイアウト崩れが起きて、見るも無残なサイトに、、、

なんてことなく、私たちのような”ド素人ちゃん”でもカスタマイズできてしまうのが「スマホ用ウィジェット」です。今回は広告を追加してみます。

tcd-widget_27

tcd-widget_28

楽勝。

おまけ – デフォルトウィジェットもお綺麗。

例えば、WordPressデフォルトで実装されている「テキスト」ウィジェット。汎用的なので、よく使うことになるものです。そんな「オリジナルウィジェット」じゃないコも・・・

tcd-widget_29

tcd-widget_30

テーマのデザインにあった表示に仕上げられてます。これはヒジョーにありがたい!

まとめ

先の記事で紹介した【テーマオプション】と、今回の【オリジナルウィジェット】たち。魅力はこれだけじゃないんですが、専門的な知識が無くても、自分だけでここまで簡単に設定できてしまうのであれば、もうイチから外注する必要もありませんね。

有料WordPressテーマを導入するということは、形のない”サービスを買う”ということ。当然私も慎重になった経験があります。それでも、妥協して思い通りにならずに時間をかけていたら、きっとスタートアップの時点でつまづいていたはず。サイト運営のモチベーションも続かなかったでしょう。

「コダワリが強い為に、つい時間がかかってしまうタイプの人」も、「サクッとやるだけでセンスよく仕上げたいタイプの人」も、設定は簡単に。コンテンツづくりに集中できる。TCDテーマならではの強みだと思います。

とはいえ、次々と新テーマをリリースし続けるTCD。次のページ では「作りたいサイトの種類・目的別」に分け、おすすめテーマを選抜して紹介しています。

きっと、お気に入りのテーマが見つかるはずです。

 関連記事

魅力的なブログを今すぐ作れる。ワードプレステーマTCD【MAG】の有効的な活用方法とカスタマイズまとめ

記事が気に入ったら
Requ.logを "いいね!"
Facebookで更新情報をお届け。

Requ.log | レク.ログ

スポンサーリンク
スポンサーリンク
WordPressテーマ「MAG(TCD036)」

ピックアップ記事

  1. もっとストレスフリーに・・Todoistの連携ワザで高速タスク登録!
  2. カッコ美しい、オリジナルシェアボタン。サイトデザインに合わせた作り方と簡単カスタ…
  3. 理想のWEBサイトを直感デザイン。TCD『テーマオプション』の使い方
  4. 知っとかないと、後から大変!? WordPressメディア設定と画像サイズのキケ…
  5. 簡単で効果的なストレス解消方法。「リセットボタン」で本当のリラックスを呼びだそう…

関連記事

  1. tcd-theme-selection_ecmg
  2. tcd-theme-options_ecmg

    ワードプレス

    理想のWEBサイトを直感デザイン。TCD『テーマオプション』の使い方

    サイトレイアウトは、直感的に、簡単に。WEBサイトを立上げると、最…

  3. gif-animation_ec

    WEBデザイン

    ゆっくり、フシギな色変化。GIFアニメを使った目を引くサイトロゴの作り方

    色が変わっていく...目を引くサイトロゴを簡単に。休むことなく働き…

  4. facebook-page-plugin_ecmg
  5. retina-logo_ec

    ワードプレス

    【Retinaディスプレイ対応4】サイトの顔も綺麗に。TCDテーマなら3ステップで完了する、ロゴ画像…

    サイトロゴは、サイトの顔。このサイトでは最上部にロゴを配置していま…

  6. retina-weight-saving_ecmg
スポンサーリンク
魅力的なブログを、今すぐ作る。
tcd-mag

Requ.Sound Lab. | レク.サウンドラボ

レク.サウンドラボ

音に、景色と”振る舞い”を。

特集記事

  1. retina_ecmg
  2. theme-change_ecrt
  3. extension-tools-for-bloggers_ec
  4. todoist_ec
  5. business-books_ecmg
  6. todoist-tips_ecmg
  7. display-speed_ec
  8. todoist-extension_ecmg
  9. tcd-theme-user-review_ecmg
  10. tcd-theme-selection_ecmg

ピックアップ記事

  1. todoist-basic_ec
  2. todoist-advanced_ec
  3. media-setting_ec
  4. tcd-theme-options_ecmg
  5. tcd-theme-widget_ecmg
  6. todoist-productivity_ecmg
  7. sns-count-cache_ecmg
  8. chrome-font_ecmg
  9. like-button-card_ecmg
  10. blog-contents_ecrt

強みを見つけて、活かしていくために。

business-books

タスク管理で、自己管理。

todoist

おすすめ記事

  1. Screenpresso(スクリーンプレッソ)を使うなら、や…
  2. きれいにしっかり画像圧縮。WordPressプラグインCom…
  3. 瞬間奥義「非同期設定」。Facebookのいいねボタン、ペー…
  4. feedlyのフォロワー数が表示されないっ!?SNS Cou…
  5. 自分のアクセス痕は残さない。アナリティクスのフィルタで自宅の…

魅力的なブログを、今すぐ作る。

tcd-mag

ブログのRetina対応、始めませんか?

retina-os-solution

最近の記事

  1. 【小技特集】もっと使いこなす!おすすめタスク管理ツールTod…
  2. タスクに、日時や曜日が勝手に反映される・・!?Todoist…
  3. 魅力的なブログを今すぐ作れる。ワードプレステーマTCD【MA…
  4. MAGのデザインをフル活用。PCとスマホの広告設置枠を自由に…
  5. 移動したいデスカ?TCDテーマMAGでダブルレクタングル広告…

ゆっくり、フシギなGIFアニメ。

gif-animation

とっておきのWordPressテーマ。

tcd-theme-selection

特集記事

  1. 目指せ軽量化!今から始める、WordPressサイトの表示ス…
  2. 【目的別】とっておきのWordPressテーマ比較。TCDテ…
  3. TCDテーマ導入前に知っておきたい、2つの注目機能とユーザー…
  4. 【保存版】知ったら戻れない、美しさの極みへ。WordPres…
  5. 最低限習得しておきたい自己管理術。忙しくても、頭と心は軽くし…

Requ.log | おすすめビジネス書

コンテンツの秘密-ぼくがジブリで考えたこと 「言葉にできる」は武器になる。
プロフェッショナルは「ストーリー」で伝える 日本人の知らなかったフリーエージェント起業術

Requ.log | おすすめ物語

モモ マリコ/マリキータ
なんくるない たったひとつの冴えたやりかた

Requ.log | WordPress Theme

WordPressテーマ「MAG(TCD036)」
  1. valuable-content-from-image_ec

    ワードプレス

    『伝わりやすいブログ』を作るには?画像で届ける価値あるコンテンツ
  2. todoist-tips_ecmg

    マネジメント

    【小技特集】もっと使いこなす!おすすめタスク管理ツールTodoistの活用法12…
  3. improvement-flow_ecmg

    マネジメント

    最低限習得しておきたい自己管理術。忙しくても、頭と心は軽くしておく生活改善フロー…
  4. business-books_ecmg

    マーケティング

    【厳選6冊】起業したくなったら読んでおきたいビジネス書。自分の強みを見つけて活か…
  5. todoist-extension_ecmg

    マネジメント

    いつでもどこでも即タスク化。Todoistの便利すぎる拡張機能4選
PAGE TOP