TCDテーマは記事内で使える装飾が少ない。」

そういったお声を目にすることが多かったので、この度、TCDテーマのエディタを大幅に拡張するプラグイン「TCDクラシックエディタ」をリリースしました。

WordPress公式ディレクトリに登録済みで、無料でインストールいただけます。

今後リリースするすべてのTCDテーマは、「TCDクラシックエディタ」に対応し、テーマ有効化時に自動インストールできるようになります。

WordPressテーマ「ISSUE」

洗練された採用サイトが誰でも簡単に作成できる。

ISSUE

TCDクラシックエディタの機能概要

TCDクラシックエディタは、TCDテーマ専用のエディタ拡張プラグインです。

2025年2月7日現在は、本日リリースした最新のTCDテーマ「GRAVITY」のみに対応しています。
今後、人気の過去テーマから順次対応予定ですので、楽しみにしていただけますと幸いです。

クイックタグ装飾(デザイン)の大幅な機能拡張が中心で、主な機能は次の通りです。

  • 対応TCDテーマなら管理画面から1クリックインストール可。
  • 豊富なデザインプリセットから即登録可。
  • 独自にデザインすることも可。
  • プレビューしながらデザインできる。
  • クイックタグの登録・削除・並び替えが自由自在(個数に制限無し)。
  • 登録したクイックタグはブロックエディタでも使える。
  • クイックタグに管理用の名前をつけられる。
  • 記事本文内の目次を自動で作成する機能。
  • 追従可能なサイドバー目次ウィジェット。

必要なものを好きなデザインで登録して、自分だけの装飾機能として活用できます。

プラグインのインストール

管理画面から「TCD Classic Editor」と検索してインストールしたり、公式ページからもダウンロード可能ですが、TCDクラシックエディタに対応しているTCDテーマは、管理画面内から1クリックでダウンロードできます。

プラグインの1クリックインストール

対応TCDテーマを有効化した時点で、上記のようなメッセージが表示されますので、「今すぐインストール」を押すだけでOKです。

TCDクラシックエディタの対応状況

2025年2月7日現在、TCDクラシックエディタに対応しているTCDテーマ一覧です。

品番 テーマ名 リリース日
解説記事 販売ページ
TCD111 WordPressテーマ「GRAVITY」 2025年2月7日 解説記事 ダウンロード

TCDクラシックエディタの使い方

プラグインを有効化したら、ダッシュボード > TCDクラシックエディタの画面を開きます。

TCDクラシックエディタのスタートガイド

このスタートガイド画面からプラグインの設定を行います。TCDクラシックエディタの設定一覧と思っていただければOKです。どこで何が設定できるかまとめてあり、各設定画面に移動できます。

いずれも簡単に設定できますが、できることを以下でご紹介いたします。

基本設定

TCDクラシックエディタの基本設定

以下の設定が用意されています。設定が済んだら下部の「設定を保存」を押してください。

本文の文字サイズ 本文のベースとなる文字サイズを指定します(PC、スマホ別)。WordPressのエディタで作成した箇所全体に反映されます。
推奨値:PC:16px スマホ:14~16px
本文のリンクカラー 本文内のテキストリンク(aタグ)のカラーを変更します。カラーピッカーかカラーコードを利用して自由に変更可能です。視認性を考慮した上で、サイトのアクセントカラーに合わせるのもいいです。

クイックタグ

TCDクラシックエディタのクイックタグ

このページで設定できるクイックタグが、TCDクラシックエディタのメイン機能です。

あらかじめ次のクイックタグが登録されており、すぐに使えるデザインプリセットも用意されています。クイックタグごとに、10種類以上用意されているものもあるので、一部をお見せいたします。カラー・サイズ・配置などは任意に変更可能です。

カスタム見出し

記事内の見出しをデザインします。H2,H3,H4,H5,H6が用意されています。

TCDクラシックエディタのカスタム見出し

カスタム通常リスト

箇条書きリストです。枠あり、枠なし、アイコン有りなどのデザインで登録可能です。

TCDクラシックエディタのカスタム通常リスト

カスタム番号リスト

番号付きの箇条書きリストです。手順やステップ、ポイントをまとめたいときに利用できます。

TCDクラシックエディタのカスタム番号リスト

カスタム囲み枠

ポイントや注意点などを枠で囲みたいときに使います。アイコン付きプリセットも豊富です。

TCDクラシックエディタのカスタム囲み枠

カスタムマーカー

テキストをハイライトしたいときに使います。マーカーの太さや色、アニメーションを登録可能です。

TCDクラシックエディタのカスタムマーカー

カスタムボタン

ボタンをデザインできます。サイズ、シェイプ、アニメーション等を登録可能です。

TCDクラシックエディタのカスタムボタン

カスタム吹き出し

吹き出しのデザインを登録できます。吹き出しの色や枠線、ユーザー画像などを登録可能です。

TCDクラシックエディタのカスタム吹き出し

カードリンク

URLを入力してカードリンクとして表示します。デザインプリセットは無いので、設定は「登録名」を変更できるのみです。

TCDクラシックエディタのカードリンク

カスタムタグ

HTMLを登録しておけます。自前のCTAやバナー、テーブルなどをHTMLで作成して登録しておくと、使い回しが可能になります。CSSもセットで登録可能です。

TCDクラシックエディタのカスタムタグ

これらをそのままエディタ内に呼び出せるようになっています。

クラシックエディタの表示例

クラシックエディタの表示例

ブロックエディタでは、カスタムブロック内の「TCDクラシックエディタ」という項目に追加されます。

ブロックエディタの表示例

なおカスタムマーカーは、ツールバーに追加されますので、本文を書きながらスムーズに使えます。

TCDクラシックエディタのカスタムマーカー

カスタムボタンやカスタム囲み枠は、バリエーションに追加されます。要素を選択した状態で変換可能です。

TCDクラシックエディタのカスタムボタン

使わないクイックタグは削除できますし、再登録や並び変えも可能です。詳しくは後述の「クイックタグの登録・編集方法」をご覧ください。

Google Maps

TCDクラシックエディタのGoogle Maps

Google Mapsのピンやカラーをカスタマイズして表示する機能です。ここで登録したマップのデザインをクイックタグ「Google Maps」で呼び出して使えます。

このオプションを使うには、Google MapsのAPIキーが必要です。用意されている設定は次の通りです。

APIキー ここにGoogle MapsのAPIキーを入力します。
マップカラー 地図の色をデフォルト or モノクロから設定できます。
マーカータイプ マーカーピンをデフォルト、テキスト、画像の3タイプから選択します。
マーカータイプ

▼デフォルトのマーカーピン
Google Mapsのデフォルトデザインです。

TCDクラシックエディタのGoogle Maps(デフォルト)
▼テキストタイプのマーカーピン
マーカーテキストと文字色、背景色を指定できます。

TCDクラシックエディタのGoogle Maps(テキスト)

▼画像タイプのマーカーピン
オリジナル画像をアップして、背景色を指定できます。以下はPNG形式のロゴ画像をアップした例です。

TCDクラシックエディタのGoogle Maps(画像)

当機能を使ったマップのカスタマイズには、Google MapsのAPIキーが必要です。単に地図を埋め込みたいだけの場合は、こちらの記事を参考にご覧ください。
>> GoogleマップをWordPressサイトに埋め込む方法

目次

TCDクラシックエディタの目次

記事本文やサイドバーに、自動で目次を表示する機能です。用意されている設定は次の通りです。順番に設定していきましょう。

表示設定 次の項目から設定できます。
・表示しない
・本文に表示
・サイドバーに表示
・本文とサイドバーに表示
この設定は全記事共通で反映されますが、個別記事の編集画面でも目次の表示有無を変更可能です。
投稿タイプ 目次を利用する投稿タイプを設定します。
・投稿
・固定ページ
のほか、カスタム投稿タイプが選択肢として表示されます。テーマによって表示される内容は異なります。
表示条件 記事内に見出しが何個あれば、目次を作成するという設定です。以下の項目が用意されています。
・2つ以上
・3つ以上
・4つ以上
・5つ以上
対象となる見出し どの見出しを目次に含むかという設定です。以下の項目が用意されています。
・h2のみ
・h2~h3
・h2~h4
・h2~h5
・h2~h6
目次のラベル 目次上部に表示するラベルです。
目次、CONTENTSなどと設定して使ってください。
サイドバーに目次を表示する方法

プラグインを有効化すると、「【TCD】目次」というウィジェットが追加されているので、外観 > ウィジェットより任意のウィジェットエリアに設置してください。

TCDクラシックエディタの目次をサイドバーに表示する方法

目次の表示条件がウィジェット内に表示され、「目次を画面に追従表示させる」オプションも利用可能です。チェックを入れることで、画面をスクロールしても目次が追従表示されます。

サイドバーの目次を追従表示させる場合は、必ず他のウィジェットより下部に配置しましょう。

クイックタグの登録・編集方法

クイックタグの登録・編集方法を解説します。手順は以下の3ステップです。ダッシュボードのTCDクラシックエディタ > クイックタグを開いて操作してください。

  1. 新規クイックタグを登録する
  2. プリセットを読み込む
  3. スタイルをカスタマイズする

1. 新規クイックタグを登録する

新規クイックタグを登録するには、ページ下部の「追加できるクイックタグ」から選択します。

TCDクラシックエディタで新規クイックタグを追加する

クリックすると上部に追加されます。それぞれの用途については、クイックタグをご覧ください。

2. プリセットを読み込む

次に、クイックタグに適用したいプリセットを選択します。

例えば、「カスタム見出しH2」をクリックすると、次のような画面が開きます。

TCDクラシックエディタのクイックタグでプリセットを読み込む

右上の「プリセット」を開くと、豊富なデザインプリセットが用意されているのがわかります。

TCDクラシックエディタのクイックタグのデザインプリセット一覧

ここから任意のプリセットを選択して「プリセットを読み込む」を押すと適用されます。

3. スタイルをカスタマイズする

プリセットが読み込まれたら、任意のスタイルにカスタマイズします。

TCDクラシックエディタでスタイルをカスタマイズする

上記のように各所を操作して、プレビューしながらお好みに変更してください。

クイックタグの種類やプリセットによって項目は変わりますが、同じクイックタグを別スタイルで複数登録も可能です。

例えば「囲み枠」を、次のような異なる3種類のプリセットで登録します。

管理用の名前をつけえた囲み枠3種の例

その上で用途ごとに名前を登録しておけば、エディタ上での呼び出しもスムーズというわけです。

TCDクラシックエディタを使って
記事執筆をもっと楽しく。

TCDテーマのエディタを拡張するプラグイン「TCDクラシックエディタ」について解説しました。

豊富なデザインプリセットを活用して簡単にスタイリングができるので、各種装飾のデザインが気軽に楽しめます。細部までこだわったカスタマイズも可能ですし、自分だけの装飾として管理もしやすいです。

記事内の装飾が豊富になれば、いろんな工夫がしやすくなり、記事執筆も楽しくなります。ぜひダウンロードしてみてください。

TCDクラシックエディタ

2025年2月7日現在は、本日リリースした最新のTCDテーマ「GRAVITY」のみに対応しています。
今後、人気の過去テーマから順次対応予定ですので、楽しみにしていただけますと幸いです。
TCDクラシックエディタの対応状況
品番 テーマ名 リリース日
解説記事 販売ページ
TCD111 WordPressテーマ「GRAVITY」 2025年2月7日 解説記事 ダウンロード
イケてるブログがつくれるWordPressテーマ
WordPressテーマ「NULL」
WordPressテーマ「NULL」
技術や知見をシェアする開発者ブログを構築。
WordPressテーマ「Muum」
WordPressテーマ「Muum」
デザイン・SEOともに最高峰のブログに。
WordPressテーマ「Cherie」
WordPressテーマ「Cherie」
華やかなブログで集客できるテンプレート。