wordPressにて文字や画像の回り込みを解除する方法

wordpress

wordPressにて記事を投稿する場合、納品先のお客様はhtmlに詳しくない方がほとんどのため、「ビジュアル(ビジュアルリッチエディター)」にて投稿するのだが、フリーブログのように簡単につかえるようでちょっとコツが入ります。

特にメディアを入れるとき、横幅いっぱいの写真なら問題ないのだが、『写真の横に文章を入れる』場合、「メディアを追加」時に、右下あたりにある「添付ファイルの表示設定」の「位置」で回り込み表示をさせます。

——————————————————————————————————

Asahi ANNEX【回り込み表示】 写真を左に置く

——————————————————————————————————

しかし、そのまま、メディアを追加していくと、次のメディアや文章も「回り込み」を続けてしまいます。

wordPressにて文字や画像の回り込みを解除する方法

 

そんな時に必要なのが、「回り込み」の解除。手順としては、

—————————————————————————————————–

①解除したい位置にカーソルを置く。

②CSS編集ボタンをクリック

③④「ボックス」の「回り込み解除(both)」を選択。

⑤「更新」クリック

⑥①にて選択した位置で「開業(Enter)」をクリック

※いくつか解除したい場合は、①~⑥の繰り返し

—————————————————————————————————–

wordPressにて文字や画像の回り込みを解除する方法

wordPressにて文字や画像の回り込みを解除する方法

wordPressにて文字や画像の回り込みを解除する方法

この方法がわかっていれば、写真に回り込みさせたレイアウトなど見やすい記事投稿ができるようになります。

「ビジュアルリッチエディター」。いろいろな機能があるようだがわかりづらい(苦笑)

【追 記】

私のデフォルトの「ビジュアルリッチエディター」では、「CSS編集」が表示されていませんでした。これは、プラグインの「TinyMCE Advanced」を追加して表示されるようになりました。

wordpressのバージョンやThemeによって、うまくいく場合いかない場合があるようです。とりあえず、wordpress3.7.1+Theme「Gridly」の環境ではうまくいきました。