携帯やスマホで見れる簡単カレンダー作成

ブログ記事に簡単にカレンダーを設置する方法

起業や個人事業が成功するお手伝い
営業とWeb集客に強いビジネス心理コンサルタント漆沢英一です

ブログカスタマイズ事例／ご提供サービス／お問い合わせ・お申込み／ご提供事例／お客様の声／プロフィール

最近おかげさまで、仙台市以外からのお問い合わせも増えています。

今週末は、東京出張の予定です。

現場の営業時代、都内はもちろん地方出張へもいろいろ行きました。

そのころの感覚・・・

初めての場所や駅に行くことが、何となく楽しかった感覚を思い出しています。

来年4月には秋田出張の予定もあるのでいまから楽しみにしています。

携帯やスマートフォンの読者様向けの簡単カレンダー

お店の休みや予定をGoogleカレンダーで表示されているブログも多いかと思います。

しかし、残念ながら携帯やスマートフォン表示では、Googleカレンダーが表示されません。

今回は、携帯やスマートフォンの読者様向けの簡単カレンダーを、HTMLの知識なしで簡単に作成する方法をお伝えします。

（ブログ記事をタグ編集エディタで作成することが前提です）

■が予約可能日です。

営業日・店休日・定休日カレンダーの作成
[ネットショップ用のカレンダーをHTMLタグで自動作成]

こちらのサイトは、HTMLタグの知識不要で簡単操作、もちろん無料＆コピーライトなし＆リンク不要で商用利用可能な素晴らしいサイトです。

カレンダー作成方法

たったの4ステップで、簡単にカレンダーが作成できます。

[1]色を設定します。好きな＃カラーコードを入力します。

⇒今回は色見本から選んでみました。

[2]年月を設定します。

[3]定休日（土日祝祭日）をチェックします。

⇒6月を設定し、色を変えたい日を設定します。

[4]カレンダーの横幅を設定します。数値を入力します

⇒今回は300に設定します。

カレンダーを作成するをクリックすると完成プレビューとタグが作成されます。

タグの中の『定休日です』を変更します。

⇒今回は『予約可能日です』にします。

出来たタグが下記になります。

<table border="0" cellpadding="2" cellspacing="1" bgcolor="#CC0033" width="300">
<tr align="center" bgcolor="#FFFFFF">
<td colspan="7">2014年6月</td>
</tr>
<tr align="center" bgcolor="#E6D7C9">
<td>日</td>
<td>月</td>
<td>火</td>
<td>水</td>
<td>木</td>
<td>金</td>
<td>土</td>
</tr>
<tr align="center" bgcolor="#FFFFFF">
<td bgcolor="#FFCC66">1</td>
<td>2</td>
<td>3</td>
<td>4</td>
<td>5</td>
<td>6</td>
<td>7</td>
</tr>
<tr align="center" bgcolor="#FFFFFF">
<td bgcolor="#FFCC66">8</td>
<td>9</td>
<td>10</td>
<td>11</td>
<td>12</td>
<td>13</td>
<td>14</td>
</tr>
<tr align="center" bgcolor="#FFFFFF">
<td bgcolor="#FFCC66">15</td>
<td>16</td>
<td>17</td>
<td>18</td>
<td>19</td>
<td>20</td>
<td>21</td>
</tr>
<tr align="center" bgcolor="#FFFFFF">
<td bgcolor="#FFCC66">22</td>
<td>23</td>
<td>24</td>
<td>25</td>
<td>26</td>
<td>27</td>
<td>28</td>
</tr>
<tr align="center" bgcolor="#FFFFFF">
<td bgcolor="#FFCC66">29</td>
<td>30</td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
</table>
<font color="#FFCC66">■</font>が予約可能日です。

タグ編集エディタの場合、このままブログに貼ると改余な空白が表示されるので、下記のように改行を削除し一行にしましょう。

改行コードを削除するのに便利なサイトです。
初心者にもやさしい簡単HTML作成

<table border="0" cellpadding="2" cellspacing="1" bgcolor="#CC0033" width="300"><tr align="center" bgcolor="#FFFFFF"><td colspan="7">2014年6月</td></tr><tr align="center" bgcolor="#E6D7C9"><td>日</td><td>月</td><td>火</td><td>水</td><td>木</td><td>金</td><td>土</td></tr><tr align="center" bgcolor="#FFFFFF"><td bgcolor="#FFCC66">1</td><td>2</td><td>3</td><td>4</td><td>5</td><td>6</td><td>7</td></tr><tr align="center" bgcolor="#FFFFFF"><td bgcolor="#FFCC66">8</td><td>9</td><td>10</td><td>11</td><td>12</td><td>13</td><td>14</td></tr><tr align="center" bgcolor="#FFFFFF"><td bgcolor="#FFCC66">15</td><td>16</td><td>17</td><td>18</td><td>19</td><td>20</td><td>21</td></tr><tr align="center" bgcolor="#FFFFFF"><td bgcolor="#FFCC66">22</td><td>23</td><td>24</td><td>25</td><td>26</td><td>27</td><td>28</td></tr><tr align="center" bgcolor="#FFFFFF"><td bgcolor="#FFCC66">29</td><td>30</td><td></td><td></td><td></td><td></td><td></td></tr></table><font color="#FFCC66">■</font>が予約可能日です。

一行になったタグをブログに貼ると、下記のようなカレンダーが表示されます。

■が予約可能日です。

最新エディタで使用すると、枠線が表示されません。

「border="0"」を「border="1"」に変更すると枠線が表示されます。

たったの4ステップで、簡単にカレンダーが作成できます。

ブログのアクセント、お客さまへのサービスに使用してみてはいかがでしょうか？

◇最後までお読み頂きありがとうございます◇