アメブロdeアクセスアップ

アメブロ メールフォームをサイドバーに設置する方法 | アメブロのテンプレートやツールを使って、アクセスアップする方法やアメブロカスタマイズの方法をご紹介します。


テーマ:サイドバーカスタマイズ

アメブロで、メールフォームを設置させてみましょう。
メニューバーに設置する方も多いでしょうが、
今回は、サイドバーに設置して、カスタマイズしてみましょう。

 

 

 

 

アメブロで、メニューバーを作成している方って、
ビジネスタイプの方が多いです。

それに、趣味ブログなどはメニューバーなど、いらん!!

という方もいらっしゃるはず!!

 

 

ならば、サイドバーに設置するのはどうかしら?

 

 

サイドバーなら、目に留まりやすいし、
カスタマイズも簡単です。

さっそく、やってみましょう。

 

 

hanaフリースペースを使う方法

メールフォームを作成したことがない方は、
このブログでも、記事にしていますので、
こちらを、参考にしてくださいね。 →  【メールフォームの作成方法】

 

 

CSSやプラグインを使わなくても、サイドバーにメールフォームを
設置していきます。

今回は、【フリースペース】を使います。

 

フリースペースは、HTMLタグも使えるし、 とっても簡単です。

 

例として、【すごいアメブロテンプレート】を使って、
解説していきますね。

 

 

まず、【記事投稿】で、大まかなメールフォームへの、誘導案内を書きます。

 

こんな感じ。

 

記事投稿

 

普段は、通常表示で、記事編集をしていると思いますが、
フリースペースを利用するときは、HTML形式でなければ、
反映されません。

まず、通常表示で、文字装飾や、画像の位置などを
作成しておきましょう。

 

それから、HTML表示をクリック。

 

2012y06m21d_110544387ソースが表示されますので、
全部こぴーして、メモなどに貼っておきましょう。

 

 

そしたら、記事を全部消してください。

 

 

 

 

※全部をドラックしてコピーします。

 

 

サイドバー_フリースペース

 

 

 

 

次にサイドバーから、【フリースペースの編集】を選びます。

 

 

 

 

 

 

 

初めてフリースペースを使う方は、空白になっているはずですので、
そこに、先ほど記事投稿から作成し、コピーしたソースを、
そのまま貼りつけます。

 

2012y06m21d_112819128

 

 

 

 

← ソースを貼った感じ。

 

 

 

 

※もし、フリースペースを使っているなら、一番下に貼ってくださいね。

 

02_pnk_p

 

フリースペースは、スペースが入っていると、 表示できません。

<br>(改行タグ)の使用ができませんので
ソースを貼ったら、<br>タグと、スペースをとってください。

 

 

ここで、プレビューを見ても、反映されませんので、
まず、保存しましょう。

 

 

 

フリースペースの、配置を設定します。

 

フリースペース設置

 

サイドバーから、配置設定をクリック。

フリースペースを表示させたい場所に、 ドラックして移動させます。

 

 

私の場合は、プロフィールの下に設置しました。

 

メールフォーム設置完了 ここで、プレビューで確認してみましょう。

 

 

うまく表示されていたら、保存します。

 

← こんな感じです。

 

 

 

 

 

 

 

 

いい感じでしょう!!

 

こんな風に、サイドバーから、誘導してあげるのも、
ひとつの手段です。

 

 

サイドバーの、見易いい部分に設置することが、 おすすめ!!

 

ぜひ、お試しあれ!!

 

 

お問い合わせは、お気軽にメールをしてくださいね。

 

 

テンプレートデザイン・カスタマイズのこと、アクセスアップのこと、
アメブロのことならお任せあれ!

Copyright © アメブロdeアクセスアップ All Rights Reserved.