Warning: Constant POST_PLUGIN_LIBRARY already defined in /home/pasora/pasona-sp.com/public_html/wp-content/plugins/similar-posts/similar-posts.php on line 27
ビジュアルモードのボタン追加はTinyMCE Advancedで | 思いだし にっき
サイトアイコン 思いだし にっき

ビジュアルモードのボタン追加プラグインTinyMCE Advanced

<p><img class&equals;"aligncenter size-medium wp-image-11050" src&equals;"https&colon;&sol;&sol;www&period;pasona-sp&period;com&sol;wp-content&sol;uploads&sol;2017&sol;03&sol;2743367&lowbar;s-300x200&period;jpg" alt&equals;"" width&equals;"300" height&equals;"200" &sol;><&sol;p>&NewLine;<p>&nbsp&semi;<&sol;p>&NewLine;<p>今回は投稿画面の拡張機能についてのプラグインです。<br &sol;>&NewLine;記事投稿には「ビジュアル」モードと「テキスト」モードがあります。<br &sol;>&NewLine;最初の頃はビジュアルエディタが使いやすく、そちらを主に使用していました。<br &sol;>&NewLine;が、操作できる投稿機能がとても少ないです。<&sol;p>&NewLine;<p><&excl;--more--><&sol;p>&NewLine;<p>&nbsp&semi;<&sol;p>&NewLine;<p>例えば表の挿入・フォントサイズ・Youtube動画の挿入・画像回りの余白挿入・顔文字など・・・Seesaaブログの頃はもっといろいろあったように思います。<&sol;p>&NewLine;<p><img class&equals;"size-full wp-image-3202 aligncenter" src&equals;"http&colon;&sol;&sol;www&period;pasona-sp&period;com&sol;wp-content&sol;uploads&sol;2017&sol;03&sol;ta1&period;png" alt&equals;"ビジュアルモード操作" width&equals;"589" height&equals;"118" &sol;><&sol;p>&NewLine;<p>&nbsp&semi;<&sol;p>&NewLine;<h2>TinyMCE Advanced<&sol;h2>&NewLine;<p>そこでこの<strong>TinyMCE Advanced<&sol;strong>の出番です。<br &sol;>&NewLine;TinyMCE AdvancedはWordPressのビジュアルエディタを拡張できるプラグインで操作ボタンを自由に増やすことができます。<br &sol;>&NewLine;色々とカスタマイズもできます<&sol;p>&NewLine;<p>&nbsp&semi;<&sol;p>&NewLine;<h3>インストール<&sol;h3>&NewLine;<p>プラグインの新規追加で検索に「TinyMCE Advanced」と入れてプラグインを探します。<br &sol;>&NewLine;表示されたら「今すぐインストール」&Implies;「有効化」をクリックします。<&sol;p>&NewLine;<p><img class&equals;"size-full wp-image-3203 aligncenter" src&equals;"http&colon;&sol;&sol;www&period;pasona-sp&period;com&sol;wp-content&sol;uploads&sol;2017&sol;03&sol;ta2&period;png" alt&equals;"TinyMCE Advanced" width&equals;"346" height&equals;"349" &sol;><&sol;p>&NewLine;<p>&nbsp&semi;<&sol;p>&NewLine;<p>ダッシュボードメニューの「設定」に「TinyMCE Advanced」が表示されるのでクリックします。<&sol;p>&NewLine;<p>図のようにエディタ設定画面が表示されます。<br &sol;>&NewLine;使い方は簡単です。 下部の一覧から上部に使いたいボタンをドラッグするだけです。<&sol;p>&NewLine;<p><img class&equals;"size-full wp-image-3204 aligncenter" src&equals;"http&colon;&sol;&sol;www&period;pasona-sp&period;com&sol;wp-content&sol;uploads&sol;2017&sol;03&sol;ta3&period;png" alt&equals;"操作" width&equals;"640" height&equals;"474" &sol;><&sol;p>&NewLine;<p>&nbsp&semi;<&sol;p>&NewLine;<p>挿入したボタンもドラッグで順番の入替ができます。<br &sol;>&NewLine;逆に不要なボタンを下部にドラッグして非表示することもできます。<&sol;p>&NewLine;<p>※ 「ツールバー切り替え」ボタン(複数あるツールバーが一段目しか表示されないときにクリックします)は、一段目の右端に置かなければうまく機能しないので注意です。<&sol;p>&NewLine;<p>終了したら「変更を保存」をクリックします。<&sol;p>&NewLine;<p><img class&equals;"size-full wp-image-3205 aligncenter" src&equals;"http&colon;&sol;&sol;www&period;pasona-sp&period;com&sol;wp-content&sol;uploads&sol;2017&sol;03&sol;ta4&period;png" alt&equals;"変更の保存" width&equals;"543" height&equals;"251" &sol;><&sol;p>&NewLine;<p>&nbsp&semi;<&sol;p>&NewLine;<p>「投稿」&Implies;「新規追加」の画面を表示するとボタンが増えているのが確認できますね(^^ <&sol;p>&NewLine;<p><img class&equals;"size-full wp-image-3206 aligncenter" src&equals;"http&colon;&sol;&sol;www&period;pasona-sp&period;com&sol;wp-content&sol;uploads&sol;2017&sol;03&sol;ta5&period;png" alt&equals;"変更後" width&equals;"529" height&equals;"143" &sol;><&sol;p>&NewLine;<p>&nbsp&semi;<&sol;p>&NewLine;<h3>その他の設定<&sol;h3>&NewLine;<p>ボタンの上の「エディターメニューを有効化する」にチェックを入れるとエディタの上部にメニューバーが表示されます。<br &sol;>&NewLine;これは TinyMCE Advanced で使用できる全ての機能が確認できるので、通常はボタンを使用して記事作成をして、ボタン以外の機能を使用する際にメニューバーから使うようにできます。<&sol;p>&NewLine;<p>&nbsp&semi;<&sol;p>&NewLine;<h3>設定欄の項目<&sol;h3>&NewLine;<p><strong>フォントサイズ<&sol;strong><&sol;p>&NewLine;<p><img class&equals;"size-full wp-image-3208 aligncenter" src&equals;"http&colon;&sol;&sol;www&period;pasona-sp&period;com&sol;wp-content&sol;uploads&sol;2017&sol;03&sol;ta6&period;png" alt&equals;"フォントサイズ" width&equals;"549" height&equals;"196" &sol;><&sol;p>&NewLine;<p>チェックを入れると、フォントサイズの単位をpt(ポイント)からpx(ピクセル)に変更することができます。<&sol;p>&NewLine;<p>&nbsp&semi;<&sol;p>&NewLine;<h3>高度なオプション欄の項目<&sol;h3>&NewLine;<p><strong>段落タグの保持<&sol;strong><&sol;p>&NewLine;<p><img class&equals;"size-full wp-image-3209 aligncenter" src&equals;"http&colon;&sol;&sol;www&period;pasona-sp&period;com&sol;wp-content&sol;uploads&sol;2017&sol;03&sol;ta7&period;png" alt&equals;"段落保持" width&equals;"538" height&equals;"298" &sol;><&sol;p>&NewLine;<p>&nbsp&semi;<&sol;p>&NewLine;<p>WordPressで記事を作成していると、ビジュアルエディタで書いた記事をテキストエディタで修正する、という場面があります。<&sol;p>&NewLine;<p>テキストエディタで修正した記事を、再びビジュアルエディタで確認すると、不要なタグが追加されるといった不具合が起きます。<&sol;p>&NewLine;<p>しかし、こちらの項目にチェックを入れておくことで、そのような不具合を回避することができます。<&sol;p>&NewLine;<div class&equals;"sb-type-drop">&NewLine;&Tab;<div class&equals;"sb-subtype-a">&NewLine;&Tab;&Tab;<div class&equals;"sb-speaker">&NewLine;&Tab;&Tab;&Tab;<div class&equals;"sb-icon">&NewLine;&Tab;&Tab;&Tab;&Tab;<img src&equals;"https&colon;&sol;&sol;www&period;pasona-sp&period;com&sol;wp-content&sol;plugins&sol;speech-bubble&sol;img&sol;s&lowbar;j1&period;png" class&equals;"sb-icon">&NewLine;&Tab;&Tab;&Tab;<&sol;div>&NewLine;&Tab;&Tab;&Tab;<div class&equals;"sb-name">波空<&sol;div>&NewLine;&Tab;&Tab;<&sol;div>&NewLine;&Tab;&Tab;<div class&equals;"sb-content">&NewLine;&Tab;&Tab;&Tab;<div class&equals;"sb-speech-bubble"> 以前ビジュアルとテキストのモードをいったりきたりして起きた不具合?もこれで回避できそうです(^o^)vやったー <&sol;div>&NewLine;&Tab;&Tab;<&sol;div>&NewLine;&Tab;<&sol;div>&NewLine;<&sol;div> <div class&equals;"sb-type-drop">&NewLine;&Tab;<div class&equals;"sb-subtype-b">&NewLine;&Tab;&Tab;<div class&equals;"sb-speaker">&NewLine;&Tab;&Tab;&Tab;<div class&equals;"sb-icon">&NewLine;&Tab;&Tab;&Tab;&Tab;<img src&equals;"https&colon;&sol;&sol;www&period;pasona-sp&period;com&sol;wp-content&sol;plugins&sol;speech-bubble&sol;img&sol;icon&lowbar;n2&period;png" class&equals;"sb-icon">&NewLine;&Tab;&Tab;&Tab;<&sol;div>&NewLine;&Tab;&Tab;&Tab;<div class&equals;"sb-name">猫にゃん<&sol;div>&NewLine;&Tab;&Tab;<&sol;div>&NewLine;&Tab;&Tab;<div class&equals;"sb-content">&NewLine;&Tab;&Tab;&Tab;<div class&equals;"sb-speech-bubble"> インストールしても設定していなかったのがバレバレですね <&sol;div>&NewLine;&Tab;&Tab;<&sol;div>&NewLine;&Tab;<&sol;div>&NewLine;<&sol;div>&NewLine;<p>最後に「変更を保存」をクリックします。<br &sol;>&NewLine;後は楽しく記事を書きましょう(^^)<&sol;p>&NewLine;<p>&nbsp&semi;<&sol;p>&NewLine;<p>前の記事 <a href&equals;"http&colon;&sol;&sol;www&period;pasona-sp&period;com&sol;3192&period;html">プラグインPubSubHubbubで記事更新をリアルタイム通知<&sol;a><br &sol;>&NewLine;次の記事 <a href&equals;"http&colon;&sol;&sol;www&period;pasona-sp&period;com&sol;3215&period;html">プラグインWordpress Popular Postsで人気記事ランキング作成<&sol;a><&sol;p>&NewLine;<p style&equals;"text-align&colon; right&semi;"><a href&equals;"http&colon;&sol;&sol;www&period;pasona-sp&period;com&sol;page-1472&period;html"><span style&equals;"color&colon; &num;0066cc&semi;">WordPress一覧へ<&sol;span><&sol;a><&sol;p>&NewLine;<p> <br &sol;>&NewLine;<a href&equals;"http&colon;&sol;&sol;affiliate&period;freebieac&period;com&sol;link&period;php&quest;i&equals;580f01029d0b2&amp&semi;m&equals;584c839908d81"><img src&equals;"http&colon;&sol;&sol;affiliate&period;freebieac&period;com&sol;data&period;php&quest;i&equals;580f01029d0b2&amp&semi;m&equals;584c839908d81" width&equals;"728" height&equals;"90" border&equals;"0" &sol;><&sol;a><&sol;p>&NewLine;<p><a href&equals;"&sol;&sol;diary&period;blogmura&period;com&sol;ranking&period;html" target&equals;"&lowbar;blank" rel&equals;"noopener"><img src&equals;"&sol;&sol;diary&period;blogmura&period;com&sol;img&sol;diary88&lowbar;31&period;gif" alt&equals;"" width&equals;"88" height&equals;"31" border&equals;"0" &sol;><&sol;a><br &sol;>&NewLine;<a href&equals;"&sol;&sol;diary&period;blogmura&period;com&sol;ranking&period;html" target&equals;"&lowbar;blank" rel&equals;"noopener">にほんブログ村<&sol;a><&sol;p>&NewLine;<p><a title&equals;"日々の出来事 ブログランキングへ" href&equals;"http&colon;&sol;&sol;blog&period;with2&period;net&sol;link&period;php&quest;1839199&colon;9200"><img src&equals;"http&colon;&sol;&sol;blog&period;with2&period;net&sol;img&sol;banner&sol;c&sol;banner&lowbar;1&sol;br&lowbar;c&lowbar;9200&lowbar;1&period;gif" width&equals;"110" height&equals;"31" border&equals;"0" &sol;><&sol;a><br &sol;>&NewLine;<a style&equals;"font-size&colon; 12px&semi;" href&equals;"http&colon;&sol;&sol;blog&period;with2&period;net&sol;link&period;php&quest;1839199&colon;9200">日々の出来事 ブログランキングへ<&sol;a><&sol;p>&NewLine;&NewLine;

モバイルバージョンを終了