エクセル画像を2クリックでwordpressに貼り付ける

エクセルの表を2クリックで、wordpressにコピーペーストする手順について記事化します。

なお、wordpress上での表の表示については様々なプラグインがあります。また、基本的には表はhtmlのtableタグによって構成されています。

今回の記事の主旨は、とにかく、簡単に早く、かつ、デザイン的に修正が不要な作業を目指しました。

基本的に、ブログ(サイト)上に表で表示することは、ユーザビリティ重視な方法ではないと思います。

しかし、簡易な表の場合は、表を使用した場合の方が分かりやすい説明の場合もあると考えて、エクセルの表をwordpressにコピーペーストする方法を記事化します。

エクセル⇒wordpressまで、最速、2クリックでコピーペーストできます。

エクセル画像を2クリックでwordpressに貼り付ける。ブログでは表の表示は向かないです

基本的には、パソコンで見る場合はまだしも、特に、小さい画面のスマートフォンで複雑な表を表示することは困難です。

上記を踏まえると、表をwordpress上に全部表示するならば、画像そのものを、JPEGの画像にして、貼り付ける方法があります。

もちろん、字や数字は潰れて、何を表示したいのか分からない状況になります。

表の種類にもよりますが、通常、スマートフォンで見た場合は、文字が縮小され、数字が読み取りにくくなってしまいます。

したがって、スマートフォンで把握できる表情報は、あくまでも、簡易的なインフォメーションとして割り切るべきだと思います。

画像を指で拡大して、スクロールすれば良いという考え方もありますが、拡大してスクロールしている間に、前の数字や関連項目が不明確になり、結果として、スマートフォンで見る表は、訴求力が高いとは言えないものになっています。

エクセル画像を2クリックでwordpressに貼り付ける。表は簡易で、かつ、訴求力が高いものだけを選択

過去、html構文の、tr、th、tdの要素を組み合わせて壮大な表を作成していましたので、これらを踏まえると、スマートフォンで見る読者がいる以上、ブログには、表は簡易で、かつ、訴求力が高いものだけを選択する方がベターかなとも考えました。

基本的には、表を表示する場合は、下記のようになります。

<table>
<tr>
<th>国語</th>
<th>数学</th>
<th>歴史</th>
</tr>
<tr>
<td>50</td>
<td>70</td>
<td>80</td>
</tr>
</table>

国語 数学 歴史
50 70 80

エクセル画像を2クリックでwordpressに貼り付ける。プラグインの使用は極力避けたい

html構文ではなく、プラグインのインストール、また、使用も避けたい。

そこで、昔からあるエクセルの表をコピーして⇒wordpressに貼る手順の紹介です。

歴史 国語 数学
1回目 70 80 90
2回目 60 70 60
平均 65 75 75

 

上記のエクセルの表は、wordpress上は、下記のようになっています。基本的には、table構文は全く同様です。

<table width=”303″>
<tbody>
<tr>
<td width=”72″></td>
<td width=”87″>歴史</td>
<td width=”72″>国語</td>
<td width=”72″>数学</td>
</tr>
<tr>
<td>1回目</td>
<td>70</td>
<td>80</td>
<td>90</td>
</tr>
<tr>
<td>2回目</td>
<td>60</td>
<td>70</td>
<td>60</td>
</tr>
<tr>
<td>平均</td>
<td>65</td>
<td>75</td>
<td>75</td>
</tr>
</tbody>
</table>

<table width=”303″>
<tbody>
<tr>
<td width=”72″></td>
<td width=”87″>歴史</td>
<td width=”72″>国語</td>
<td width=”72″>数学</td>
</tr>
<tr>
<td width=”72″>1回目</td>
<td width=”87″>70</td>
<td width=”72″>80</td>
<td width=”72″>90</td>
</tr>
<tr>
<td width=”72″>2回目</td>
<td width=”87″>60</td>
<td width=”72″>70</td>
<td width=”72″>60</td>
</tr>
<tr>
<td width=”72″>平均</td>
<td width=”87″>65</td>
<td width=”72″>75</td>
<td width=”72″>75</td>
</tr>
</tbody>
</table>
スマートフォンで検証してみましょう。スマートフォンの画面での表の表示を見ましたが、全く問題ありません。

エクセル画像を2クリックでwordpressに貼り付ける。1点だけ注意!wordprssに貼る際はテキストではなくビジュアルモードです

エクセル画像を2クリックでwordpressに貼り付けるまでの手順を、2クリックでできるか否か検証開始です。

では、始めましょう。

まず、エクセルを開いておいて、表を作成しておきます。

次に、wordpressを開いておいて、投稿記事画面=必ずビジュアル画面を表示しておきます。

ビジュアルモードにしないと、html構文の表作成のタグが、コピーペーストできないので、テキストモードではなく、必ず、ビジュアルモードを使ってください。

続けて、エクセルから表をコピーします。右クリックでも、CTRL+CでもOKです。

下の図のように、エクセルの画面上からコピーペーストしたい部分だけを範囲指定して、右クリックまた、CTRL+Cでコピーします。

2重線で囲まれている部分が、範囲指定した部分です。

そして、コピーコマンドのまま、開いておいたwordpressのビジュアルモードの中の表示したい箇所で、右クリックの貼り付け、またはCTRL+Vを押します。

これで完成です。

再度、スマートフォンでの表示具合を確認してOKです。

2クリックでエクセル⇒wordpressへの画像貼り付け完了です。