構築 ワードプレス情報 お役立ち情報

プラグイン TinyMCE Advancedでページ作成・編集

レンタルサーバー プラグインTinyMCE AdvancedについてWordPress(ワードプレス)でサイトを構築した後は、ページの作成をして情報をしっかりと配信します。
ですが、WordPressをインストールした初期状態のビジュアルエディター(編集機能)は充実しているとは言い難いところです。

そこで、プラグイン TinyMCE Advancedをインストールして、さらに便利にサイトを作成できる環境を作りましょう。

TinyMCE Advancedのツールバー

プラグインを入れる前のビジュアルエディターです。ここに様々な編集ができるように機能を追加します。

設定前

レンタルサーバー プラグインTinyMCE Advancedについて インストール前


設定後

レンタルサーバー プラグインTinyMCE Advancedについて 設定後ツールバー

TinyMCE Advancedのインストール

WordPressの管理画面から「プラグイン」→「新規追加」をクリックします。

レンタルサーバー プラグインTinyMCE Advancedについて 新規追加

次に、キーワード欄に「TinyMCE Advanced」と入力すると、プラグインが表示されますので、「今すぐインストール」をクリックします。

レンタルサーバー プラグインTinyMCE Advancedについて 検索

インストールが終わったら、「有効化」をクリックしてプラグインを利用できるようにしましょう。

レンタルサーバー プラグインTinyMCE Advancedについて 有効化

TinyMCE Advancedの設定

インストールと有効化が終了したら、設定を行っていきます。
WordPress管理画面の「プラグイン」をクリックで、プラグインが一覧表示されますので、TinyMCE Advancedの「設定項目」をクリックします。

レンタルサーバー プラグインTinyMCE Advancedについて 設定変更

新エディターのグーテンベルク用設定と旧エディターのクラシックエディター用設定が選べますので、今回はクラシックエディター用設定「Classic Editor」を選択します。

レンタルサーバー プラグインTinyMCE Advancedについて エディター選択画面

インストール時の初期画面が開きます。ここを設定変更していきましょう。

ツールバー設定

設定前

レンタルサーバー プラグインTinyMCE Advancedについて 設定初期画面

まずはメニューに必要な機能を追加します。使用しないボタンから、必要な機能をドラッグ&ドロップします。
また必要ないボタンも同じく、ドラッグ&ドロップで削除し、自分で作成するときに必要なツールバーに整えましょう。

設定後


レンタルサーバー プラグインTinyMCE Advancedについて ツールバーに機能追加

設定

次に設定です。こちらは初期状態です。

設定前

レンタルサーバー プラグインTinyMCE Advancedについて 設定


必要な個所にチェックを入れます。

設定後


レンタルサーバー プラグインTinyMCE Advancedについて 設定後

代替リンクダイアログ」にチェックを入れると、リンクダイアログがすぐに開きリンク設定時の手間が省けます。

レンタルサーバー プラグインTinyMCE Advancedについて 代替リンクダイアログ

フォントサイズ」にチェックを入れると、おもに出版物などで利用するptからWebで利用するpxに変更します。また、72pxなど大サイズが選択できるようになります。

 レンタルサーバー プラグインTinyMCE Advancedについて フォントサイズ

どちらの機能も必須ではありませんので、必要に応じてチェックを入れてください
これで解決

高度なオプション

設定前


レンタルサーバー プラグインTinyMCE Advancedについて 高度なオプション


「高度なオプション」では、Keep paragraph tags in the Classic block and the Classic Editorにチェックを入れます。

設定後

レンタルサーバー プラグインTinyMCE Advancedについて 高度なオプション設定後

この設定にしますと、テキスト編集時にタグが残り、ソースコードでの作業がしやすくなります。なお、ビジュアルモードでのみ作業をする方は、必須項目ではありません。

設定前


レンタルサーバー プラグインTinyMCE Advancedについて 高度なオプションタグ設定


設定後


レンタルサーバー プラグインTinyMCE Advancedについて 高度なオプションタグ設定後表示例

Advanced options for tables

こちらは初期設定で特に問題はありません。

レンタルサーバー プラグインTinyMCE Advancedについて Advanced options for tables

管理

こちらも初期設定で特に問題はありません。

レンタルサーバー 管理

他のWordPressで同じ設定にしたい場合は、「設定のエクスポート」「設定のインポート」を利用しましょう
解決ですね

すべての設定が終わりましたら「変更を保存」をクリックして設定を完了しましょう。

まとめ

サイトを充実させるためには、制作・編集環境を整えておくことは大切です。

TinyMCE Advancedは、数多くのサイトで利用されている無料のプラグインですので、インストールしてサイト制作に集中できる状況を作りましょう。

Copyright© 【2019年・令和最新】レンタルサーバーとネットショップ作成・ドメインサービス比較・評価・検討・紹介サイト by STREN , 2019 All Rights Reserved.