Wordで文章を作り、ワードプレスに貼り付けると表示が変になる件

word
おかぴー

こんにちは!
WEBデザイナーのおかぴー(@blueokap)です。

僕の詳しいプロフィールと、このブログについてはこちら

 

今回も「JIN」のテーマを使っている松浦さんからご質問をいただきました。

記事作成時に、Wordのソフトを利用して文章を書いてから、ワードプレスの投稿で貼り付けをして改行すると、行間がなぜか変になるというご相談です。

今回のポイント
  • Wordで文章を作成している
  • 作成した文章をそのままワードプレスに貼り付けると、意図しないコードが付いてきてしまう

 



今回のご相談内容

松浦さん

お世話になってます。

ブログ記事の行間についての質問です。
Wordで記事を作成して、ワードプレスに張り付けているのですが
改行すると行間が、少し空きすぎている気がします。

もう少し幅を狭めるにはどうしたらいいのでしょうか?

おかぴー

松浦さん、こんにちは。
ご質問ありがとうございます^^

実は「Word」で文章を作ると意図しない指示(コード)が勝手に入ってしまいます。

文字の大きさ・行間など目に見えない指定をされるので、ワードプレスにそのまま貼り付けると意図しないコードを連れてきてしまうので、表示が変になっている可能性が高いです。

 

たとえば、僕のMacbookの「Pages」というMac版のワードと言えるソフトでやってみたところ、下の図のような感じになりました。

文章作成はこんな感じ↓(普通に文字打っただけ)

word 文章作成

 

これをコピペして、「ビジュアルモード」で貼り付け↓

word 文章作成

 

貼り付けた文章を「テキストモード」に表示を変えてみたところ、こんな感じに↓

word 文章貼り付け

 

「・・・おや??」

なぜか変な<span class="s1">というタグが入っているのが気になります(笑)。
そして、赤枠内全部が意図しないタグが出てしまっています。

Wordではこのように何かしらのHTML・CSSのコードを作成するため、そのまま貼り付けると表示がおかしくなるということです。

ですので、今後カスタマイズするときにも役に立つツールで文章を作成するのがいいのではないかと思いました。

 

解決策

今回の解決策の一つとして、「テキストエディタ」を利用して文章を作成→貼り付けるのがおすすめです。

テキストエディタ

文字打ちに特化したツール。
画像の貼り付けはできず、装飾などもあまりできないですが動作が非常に軽いことが特徴。

さらには、Wordのソフトと違い、各プログラミング言語のコーディングにも対応していて、ワードプレス上のデータのバックアップにも利用できます。

WEB制作の現場でも常に使われるツールです。

 

おかぴー

テキストエディタを使えば、最初から余分なコードが入らずに文章が作成できますし、

松浦さんのパソコンはWindowsということなので、「TeraPad」というテキストエディタが個人的にはおすすめです。

無料ですし、動作も軽いので文章作成には困らないと思います。

松浦さん

ありがとうございます。
テキストエディタも試してみますね。

 

Windows・Macで利用できる使いやすいテキストエディタは、
こちらの記事でインストール・設定方法など詳しく解説していますので参考にしてみてください^^↓

【Mac・Windows対応】無料でおすすめのテキストエディタをご紹介!

2018.09.18

 

先ほどの「ビジュアルモード」での貼り付けを説明していた画像があったと思いますが、
逆に「テキストモード」に貼り付けるとほぼ同じようにコピペすることができました。

それ以外に「Word」を使ってそのまま貼り付けて作成できる方法がないかは、
別途検証していきたいと思います!

 

個人的にはテキストエディタは文章作成もできるし、
バックアップを簡単に取れるツールにもなっています。

何か1つでもテキストエディタを使えるようになると、
ブログ作成が一段とはかどるようになると思いますよー^^


デザイン性の高いブログ ビジネスモデル作りの基礎知識

『ブログの収益化』についての記事リクエストに応えました!

内容の濃い記事になっていますが、

最後まで本気で読んでくれたら、ここまで読んでいるあなたの助けになれると思います^^

この悩みをWEB業界と関わりが深いおかぴーが1から解決します!!


コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

このサイトはスパムを低減するために Akismet を使っています。コメントデータの処理方法の詳細はこちらをご覧ください