すべてのカテゴリ

こんにちは。maiko＊です。台風大丈夫でしたか？私は首都圏に住んでいるのでこれからかな・・とソワソワしております。みなさまも、安全を第一にお過ごしくださいませ。【maiko＊】新卒から人材会社で5年以上、キャリアは営業→Webマーケティングへ。現在はWixを使ったWebサイトデザインと集客マーケティングを兼務中。さて今日は、タイトルの通り、Wixのホームページ改善でよくお問い合わせをいただく”入力してもらえる”「問い合わせフォーム」の設置について。Wixで問い合わせフォームを設置するWixでは無料プランから問い合わせフォームの設置が可能です。サイト全体で7項目までは無料で設置できます。Wixはノーコードツールなので、フォームの設置は10秒で完了です！とても簡単！フォームをただ設置すると危険？ホームページを作るときに、必ずある「サイトの目的」。その目的が果たせる問い合わせフォームを作らなければ設置してるだけで問い合わせは来ません。私が問い合わせフォームを制作するときに修正する４つのポイントを実際にBefore ＆ Afterで作って比較できればと思います。初めての方でも簡単にできる作業もあるので是非ご覧ください！Before：テンプレのフォームをそのまま活用▼フォームを設置して、必要な項目以外を削除しただけの状態です。（レイアウト調整はするとして）この状態でも十分使えますが、「入力してもらう」ための仕掛けを追加していきます。【すぐできる】フォームで改善するポイント4つ①入力例を追加するテキスト入力欄へサンプルの入力例をグレーで追加する→Wixの「プライマリデータ」に記載すればO

どうも、こんにちは。一時期、テレビでココナラのCMが流れてた時期がありましたよね？（今も流れてるのかな？）“得意を売り買い　ココナラ♪”っていう、耳にのこるメロディーのやつ。あのCMが流れてる時期、私はすでにココナラの存在を知っていたのですが、自分がサービスを受ける側になることはあっても、出品する側になることはないだろうな、と思ってました。なぜなら、自分にはこれといった”得意なこと”はないと思ってたからです。時はたち、今、私は“出品する側”になっています。それは、とある人の本を読んだことがきっかけです。その本には“あなたが普段「当たり前にしていること」が、他の人にとっては高度な「スキル」になりうるわけ。そして、そのスキルを提供して、お金に交換することができる。”ということが書いてあったのですが、その文を読んだ時に「あれ？じゃあ、私の“当たり前”や“できること”にも値段をつけて売ってみてもいいのかもしれない」と思ったわけです。お問い合わせフォームからの営業代行作業はもともと、某クラウドソーシングサービス上で受注していたのですが、1000件、2000件…とまとまった件数をお引き受けするととても喜んでいただけたり、リピートでお願いされたりと非常に好評でした。誰にでもできる作業かもしれませんが、件数が増えると、それなりの作業量になります。フォーム営業は、同じことの繰り返し、単純作業が延々と続きます。そういった作業が苦手だ！面倒くさくてたまらない！！という方は是非、お気軽にご相談ください♪

 WordPressで記事を書く前に待っていた環境構築の話WordPressを立ち上げて、テーマなど最低限の設定を終えたとき。「これで、ようやく記事が書ける」そんな気持ちになっていました。残る作業は、お問い合わせフォームを設置するだけ。正直、それほど時間はかからないだろうと思っていたのです。 「その方が簡単そう」から始まったフォームを設置する方法を考えたとき、最初に思い浮かんだのは外部のメールフォームサービスでした。以前使ったことがあったので、慣れているぶん安心感があります。そんな中で、「WordPressならフォーム用のプラグインがありますよ」と教えてもらいました。それなら、そのままWordPressの中で完結した方がシンプルそうだ。そう考えて、定番の Contact Form 7 を導入しました。このときはまだ、それが長い寄り道の始まりになるとは思ってもいませんでした。ここまでは順調フォームそのものは驚くほど簡単にできました。項目を並べて、ショートコードを貼り付ける。拍子抜けするほどあっさり終わります。「思っていたより簡単だ」少し得意になっていたのを覚えています。あとはメールアドレスを設定して、テスト送信をするだけ。そこで終わるはずでした。 え？テストメールを送ります。届きません。もう一度送ります。やっぱり届きません。フォームは表示されています。入力もできます。送信ボタンを押せば「送信しました」と表示される。なのに、メールだけが届かない。迷惑メールフォルダも確認しました。ありません。何度試しても結果は同じでした。原因を調べ始めて、初めて「SMTP」という言葉を知りました。も

おはようございます。アメリカの今のワクチン接種状況から、日本の明るい未来が見えてきているのでしょうか。切に早く落ち着いて欲しいものですね。色々な業種の方々より、ご案内のメールを最近多く頂いております。アフターコロナ、ウィズコロナですかね、先を見据えて動かれているのか若しくは、7月より雇用調整助成金が対象外になる予定なので、今のうちに空いているスタッフに見込み客を見つけてきなさい。ということで仕事を振っているのか。理由は分かりませんが、とにかく多い！昨年の今頃は、050から始まる営業電話が多かったですね。在宅で出来る様に、スタッフにアプリをインストールしてもらい、在宅で営業をしていたんでしょうね。で、その先の営業相手企業の担当者も在宅。意思決定権者がお互い近くにいる訳もなく、結局営業効率は悪かったでしょうね。今や問い合わせメールも自動化出来てしまい、クレームも受注も、外注出来てしまい、賢い発注側は、自宅でゆっくり、、、なんてことも出来てしまう時代ですね。ただ、有益な情報もたまにあるため、やはり、セールス内容、キャッチの内容など、見せ方が上手なところが勝ちですね。そういったところも全てカバーできそうなものがこのココナラというプラットフォームかなと思っています。ただ、色々なプラットフォームがあり、得意・不得意な分野、規約の違いなどの特性もあるため、色々使ってみて、自分にフィットするところを使うべきかと思います。そういったことも、今や比較サイトやブログなどあるため、ググったり、Twitter見たりして、いかに多くの情報を取りに行き、情報を取捨選択し、正しい選択すれば、コストは最低限でい

フォームに数字以外を入力したくない時ってありますよね？クライアントからの依頼で、これに対応しようとして、散々苦労したことがありましたので、こちらにメモしておこうと思います。普通に考えると…0123456789だけを入力できるようにすればいい！ってなるんですが、実はこれだけでは、「全角入力」のキーはすべて素通りで入力できてしまいます。概要●input type属性はtelにするこれにより、スマートフォンでは数字以外が入力できなくなります。（ただしコピペされたら素通り）●jQueryで全角入力を制御する。これにより、PCで半角数字以外が入力された時に弾きます。input type属性をnumberにしない理由　その１number属性だと、スマートフォンではなんでも入力できてしまいます。input type属性をnumberにしない理由　その２パソコンで、↑、↓を押してしまうと値が変わってしまいます。jQueryで全角入力を制御下記のようなコードを入力します。#formfieldidは環境に合わせて書き換えてください。記載する場所ですが、プラグイン「Simple Custom CSS and JS」　がオススメです。$(document).on('keydown', '#formfieldid', function(e){  let k = e.keyCode;  let str = String.fromCharCode(k);  if(!(str.match(/[0-9]/) || (37 <= k && k <= 40) || k === 8 ||

今日は、制作中のホームページに追加したお問い合わせフォームのプラグイン WPForms について少し深掘りしてみました。今回は特にお問い合わせが送信されたときのメール通知の仕組みを確認してみました。WPFormsでは、フォームから送信があったときに管理者にメールが届くように設定することができます。設定画面を見ると、いくつか項目がありました。例えば送信先メールアドレスメール件名フォーム名送信元メールアドレスReply-Toなどです。最初はそれぞれの意味が少し分かりにくかったのですが、調べながら設定を確認していくと仕組みが見えてきました。例えば送信先メールアドレス→ お問い合わせがあったときに通知が届くメールアドレスメール件名→ 届くメールのタイトルReply-To→ 返信ボタンを押したときに返信先になるメールアドレスなど、それぞれ役割が違っていることが分かりました。こうした設定を理解しておくことで、実際にお問い合わせが来たときの対応もスムーズになりそうです。WordPressはプラグインを入れるだけで機能が使えることが多いですが、こうして一つ一つの設定を理解していくことも大切だと感じました。⭐️本日の学び⭐️WPForms無料版できること基本的なお問い合わせフォーム作成管理者へのメール通知送信先メールアドレス設定有料版じゃないとできないこと複数の通知設定Reply-To の細かい設定高度な通知カスタマイズ

こんにちは、えーさっぷです。このたび、WordPress管理しているホームページやブログサイトにお問い合わせフォームを作成するサービスを出品いたしました。「今のフォーム、なんかださいんだよなあ〜」「最低限の項目しかないので、もう少しカスタマイズしたい」など、色々なお悩みを解決いたします！コーポレートサイトでは必要不可欠な「確認画面」→「サンクスページ」へのページ遷移も実装可能です。追加CSSを利用することで、フォームの形状も自由にカスタマイズできますので、あのサイトみたいにカッコよくしたいなどのご要望にもお応えします。ご納品後の設定で不安な方には、別途オプションで簡単なマニュアルもお送りいたします。ご興味がお持ちの方は、下記までお気軽にメッセージください。

ご覧いただきありがとうございます。初心者にも親切丁寧なWEBデザイナーmore design officeの樹下です。お客様があなたのサービスに興味を持ち、「お問い合わせ」のページにたどり着いたとします。しかし、そこで待っているフォームが非常に使いにくかったらどうなるでしょうか。「入力項目が多すぎる」「どこが必須か分からない」「エラーばかり出る」こうしたストレスを感じた瞬間、お客様は「やっぱり後でいいや」と、お問い合わせを諦めてしまいます。お問い合わせフォームは、お客様があなたに「声を届ける」ための大切な場所です。その場所は、誰にとっても優しく、親切でなければなりません。今日は、お客様の心理的ハードルを下げ、スムーズにお問い合わせをいただくための「親切丁寧な入力フォーム」の作り方について、4つのポイントで詳しく解説します。1. 入力項目は「必要最低限」に絞り込むお客様にとって、文字を入力するのは非常に手間がかかる作業です。良かれと思って「性別」「生年月日」「住所」「当サービスを知ったきっかけ」など、多くの項目を求めていませんか？お問い合わせの段階では、まず「連絡が取れること」が最優先です。・名前（ニックネーム可）・メールアドレス・お問い合わせ内容これら「必要最低限」の項目からスタートしましょう。より詳しい情報は、お申し込み後のヒアリングで伺えば十分です。項目を絞る勇気が、お問い合わせの数を増やします。イメージ画像： 内容は必要最低限で2. 「必須」と「任意」をパッと見て分かるようにするどの項目が必ず入力しなければならないのか（必須）どちらでも良いのか（任意）これが分からないと、

※ この手順では「Google広告」と「Googleタグマネージャー」にアカウントが設定されている前提でご案内いたします。※ お問い合わせフォームが送信された後のThank youページがない場合は、Googleタグマネージャーの「フォーム送信イベント」を利用してコンバージョンを測定します。まず、Google広告で目標コンバージョンタグを用意します。1. Google広告の「目標」をクリックします。2. 「コンバージョンアクションを作成」をクリックします。3. 「ウェブサイトで発生したコンバージョン」が選択されていることを確認します。4. 「続行」をクリックします。次の画面で「測定の対象」を選択します。ご希望の測定対象がない場合は「全て表示」にクリックします。5. 「全て表示」にクリックします。6. 今回は「リードフォームの送信」を選択しますが、「予約」や「見積もりのリクエスト」など御社のフォームの役割によって測定の対象を選んでください。7. 「コンバージョンアクションを追加する」にクリックします。8. 測定する項目を選択します。9. 「手動イベントを作成する」を選択します。10. 新しいコンバージョンの名前を入力します。11. イベントを使用にクリックします。12. 「保存して次へ」をクリックします。13. 「Googleタグマネージャーを使用する」タブを選択します。14. ①「コンバージョンID」と②「コンバージョンラベル」をメモします。※ 私の場合は以下の画面を開いたまま、別にブラウザーを開いてGTMの設定を行います。次はGoogleタグマネージャーでの手順をご案内いたし

WordPressのお問い合わせフォームで「送信しました」と表示されたのに、管理者にも送信者にもメールが届かない。昨日までは届いていたのに、急に止まった——このようなとき、最初からSMTPプラグインを入れ直したり、DNSを変更したりすると、かえって原因が分かりにくくなります。メールは、フォームから受信箱へ直接届くわけではありません。「フォーム → WordPress → 送信サーバー → 受信サーバー → 受信箱」という複数の場所を通ります。WordPressの送信処理が成功しても、受信箱への到着まで保証されたわけではありません。そこで、上流から一つずつ確認します。【最初に分けたい4つの状態】同じ「届かない」でも、状態は異なります。・フォーム送信そのものが完了していない・WordPressがメール送信処理を開始できていない・送信サーバーから先で拒否、保留、迷惑メール判定されている・管理者向け通知は届くが、自動返信だけ届かない管理者向け通知と自動返信は、宛先や送信元が別です。片方だけ届かない場合は、共通部分より、そのメールだけに使う設定を優先して確認できます。【1. 再現条件を1件だけ記録する】まず、問い合わせページURL、送信日時、入力した宛先、画面に出た完了・エラー文言、管理者通知と自動返信のどちらが未着かを記録します。何度も連続送信すると、迷惑メール判定や送信制限の影響が混ざります。テスト用の内容だと分かる件名で、個人情報を含めず、1件ずつ結果を残します。【2. フォーム送信がWordPressまで届いたか確認する】フォームプラグインに送信履歴、応募データ、決済・予約記録な

アクセスはあるのに問い合わせが来ない —その原因がフォームにある場合があります。入力項目の多さ・ボタンの文言・フォームの位置・送信後の体験— これらを少し変えるだけで、同じアクセス数でも問い合わせ数が変わってきます。フォームのCVR（コンバージョン率）を改善する実践的なアイデアを整理します。フォームを設置しているのに、なぜか使われていない」という状況は少なくありません。フォームを開いてみると、入力欄が10項目以上あったり、エラーメッセージが分かりにくかったり、送信ボタンが小さかったりします。お客様にとって「使いにくい」と感じる要因がいくつか重なると、途中で離脱されてしまいます。この記事で分かること・CVR（コンバージョン率）とは何か・フォームの離脱を生む5つの原因・入力項目の整理——何を残して何を省くか・送信ボタンの文言・サイズ・色の最適化・送信後の「サンキューページ」がCVRに与える影響CVR（コンバージョン率）とはCVR（Conversion Rate）とは、サイトを訪問したお客様のうち「問い合わせ・予約・購入」などの目標行動をとった割合のことです。アクセス数が同じでも、CVRが上がれば問い合わせ数は増えます。新規集客に費用をかける前に、既存のアクセスから成果を最大化するCVR改善は、費用対効果の高い取り組みです。■一般的なホームページの問い合わせCVRの目安：1〜3%■フォームのCVRに最も影響する要因のひとつ：項目数■フォームを操作する端末の大半はスマートフォン：スマホフォームの離脱を生む5つの原因01. 入力項目が多すぎる初めて問い合わせるお客様に、名前・住所・電話番

問い合わせフォームや予約導線は、サービスに興味を持ってくれた方が実際に行動してくれる、とても大事な入り口です。だからこそ、少しの分かりにくさが離脱につながってしまうこともあります。今回は、見直すと変わりやすいポイントをいくつか書いてみます。まず一つ目は、入力項目が多すぎないかです。必要な情報を取りたい気持ちは自然ですが、最初の段階でたくさん入力が必要だと、それだけで負担に感じられてしまいます。問い合わせや予約の時点では、本当に必要な項目に絞ることが大切です。二つ目は、次に何が起きるのか分かるかどうかです。送信したらどうなるのか、予約した後に何が届くのか、どれくらいで連絡が来るのかが見えないと、不安になりやすいです。少し説明があるだけでも、安心感はかなり変わります。三つ目は、エラーや迷うポイントが分かりやすいかです。入力ミスがあったときに、どこを直せばよいか分からないと、それだけで途中でやめたくなってしまいます。「どこが違うのか」「どう直せばよいのか」が伝わるだけで、使いやすさはかなり変わります。また、予約導線や申込導線では、全体の流れが自然かどうかも大事です。たとえば、必要な情報がいきなり多く出てきたり、途中で戻りたくなったり、今どの段階にいるのか分かりにくかったりすると、進みにくさにつながります。こうした部分は、作る側から見ると気づきにくいこともありますが、使う側にとっては意外と大きな負担になります。フォームや導線は、ただ情報を集める場所ではなく、相手が最初に安心して一歩進める場所でもあると思っています。「何となく使いにくい気がする」「離脱が多い気がする」という場合は、少し見

Webサイト制作において、お問い合わせフォームはオリジナルコードでの実装をお断りしております。その理由と代替案をご説明します。（なお、WordPressサイトの場合は、プラグインを使用して構築いたします。）オリジナルコードでの実装をお断りする理由1. セキュリティリスクの高さお問い合わせフォームは外部からデータが入る場所のため、様々な危険性があります。・不正アクセスの危険性：フォームを通じてサイト全体に侵入される可能性・情報漏洩のリスク：お客様や利用者の個人情報が外部に漏れる危険性・迷惑メール（スパム）の自動送信：フォームが迷惑メールの送信元として悪用される可能性・サイト改ざんのリスク：フォームの脆弱性を突かれてサイト内容が書き換えられる危険性2. 継続的なメンテナンス問題セキュリティ対策は一度きりではなく、常に最新状態を保つ必要があります。・新たな攻撃手法への対応が常に必要・サーバー環境の変化に合わせた調整が必要・個人開発者では継続的な安全性確保が困難3. 個人情報保護への対応お問い合わせフォームでは個人情報を扱うため、法的責任も伴います。おすすめの代替サービス【注意】WordPressサイト制作の場合は例外です。WordPressを利用する場合は、定期的に更新されている信頼性の高いフォームプラグインを使用するため、この制限の対象外となります。WordPressサイトでは、プラグインを通じて適切なセキュリティ対策が継続的に提供されるため、標準的なお問い合わせフォームの実装が可能です。静的サイト制作の場合は、以下のサービス利用をおすすめしています。1. 専門フォームサービス（例

コンタクトフォームのいたずら・いやがらせ対策のカスタマイズのご依頼がありました。相談内容具体的な内容は、コンタクトフォームから無効な・届かないメールアドレスで問い合わせが届くというものです。送信者は、メールアドレス入力欄に無効なメールアドレスを入力して送信しているので、単純なスパム対策では防げません。送信者のメールアドレスが有効であることを確認してから、問合せメールが届くようにして欲しい、というご依頼でした。対応内容サイトで利用しているフォームプラグインは、Contact form 7でした。無効なメールアドレス対策としてよくあるのが、メールアドレスを2回入力させるものです。この方法は、メールアドレスの入力間違いを防ぐもので、メールアドレスが有効か無効かの判断できません。今回のご依頼に対応するには、Contact form 7でお問い合わせメールを送信する前に、メールアドレスの有効性確認ステップを追加する必要があります。Contact form 7はカスタマイズ性が高く、メールアドレスの有効性を確認するステップを追加できます。もし、メールアドレスが無効である場合には、お問い合わせメールが届かないようにすることで、無効な問合せを防ぐようにしました。これで、いたずらや嫌がらせのメールは届かなくなります。是非ご相談くださいもし、無効なメールアドレスからお問い合わせメールが届いて困っているという場合は、対応可能です。是非ご相談ください。

中小企業のホームページにとって、お問い合わせフォームは命。人間でいうところの「心臓」ですよね。この記事では、過去に数え切れないほどのお問い合わせフォームを見てきた中で印象に残っているダメな事例を４つ、ご紹介します。ちなみにこの記事の中で言う、「ダメ」とは、「ホームページの訪問者にストレスを与えていないか」この１点です。特にデザインなどの見た目ではなく、使い勝手の良し悪しについて、になります。（もちろん、アパレルや飲食関係など、見栄えが重要なポイントになる場合もあると思います）電話番号が見えない【ダメ度★★★】ちゃんと入力できているか、不安じゃないですか？電話番号を入力したものの、間違っていないかどうかの視認ができないケースです。注文内容で確認したい事があったときのためのお客さまの電話番号が間違っていたら、結構致命的な事態になりかねません。メールアドレスが分からない限り、お客さまからの電話を待つことになりませんか。解決策としては、フォーム内の番号が視認できるのは、できるだけメールアドレスなど、別の連絡先も入手すべきでしょう。言語明瞭でも意味不明【ダメ度★★】必要パラグラフって何よ？「いわゆる、必須項目のことだよね」ってほとんどの訪問者は、自分の脳内変換をすることで乗り越えてくれるはず、と言いたいところですが、脳内変換させている時点で「ホームページ訪問者にストレスを与えている」と判断します。意味不明な絵文字・テキスト【ダメ度★】鉛筆マークって、、、さてこちらは、「お問い合わせはこちら」の左側にある【鉛筆マーク】について。細かいことかも知れませんが、ボクはいいたい。📩（封筒）とか、せ

WordPressを長く運用していると、少しずつ気になることが増えていきます。・セキュリティ設定が正しいのか分からない・PHPを更新するよう案内が届いた・使っていないプラグインが残っている・お問い合わせフォームやメールの動作が不安・何を、どこまで依頼すればよいか説明できない一つずつを見ると小さな問題に見えますが、実際に調査すると、複数の設定や古い仕組みが関係していることがあります。今回は、京都御所西 小川金正堂様のWordPressサイトで担当した、セキュリティ改善、PHP更新、お問い合わせフォーム移行、運用環境の整理についてご紹介します。本記事はお客様から公開の許可をいただき、実際に行った仕事をもとに作成しています。ご相談は、複数のWordPress設定についてでした今回ご相談いただいたのは、WordPressのセキュリティ設定をはじめとする、複数の技術的な設定についてです。長年運用されてきたサイトだったため、特定の設定だけを変更するのではなく、まず現在の状態を確認しました。調査を進めると、次のような確認・対応が必要だと分かりました。・複数のセキュリティ機能の重複・使用していないテーマやプラグイン・停止中のプラグイン・PHP更新時の互換性・既存のお問い合わせフォーム・管理者通知や自動返信などのメール送信・本番環境へ安全に反映するための手順このような場合、表示されている問題だけを直しても、別の場所に原因や古い設定が残る可能性があります。そのため、現状を調べ、必要な仕事と不要な仕事を分けるところから始めました。本番サイトを直接変更せず、先に検証しましたWordPressの設定変更

ホームページはある。 アクセスも少しはある。 でも、 問い合わせが来ない… この原因、実は 「お問い合わせページ」にあることも多いです。 ■ 失敗① 入力項目が多すぎるよくあるのが、 ・名前 ・住所 ・電話番号 ・会社名 ・年齢 ・詳しい内容… など、入力項目が多すぎるパターンです。 入力が面倒になるほど、 途中でやめてしまう人が増えます。 問い合わせは、 できるだけかんたんにが基本です。■ 失敗② 不安をそのままにしている問い合わせの前に、 多くの人が不安を感じています。 たとえば、 ・営業されないか ・料金がかかるのか ・本当に返信が来るのか こうした不安があると、 送信まで進みにくくなります。 ■ 失敗③ メリットが書かれていないお問い合わせページに、 ただフォームだけ置いているケースも多いです。 ですが、それだけでは弱いです。 ・相談は無料です ・お気軽にご連絡ください ・無理な営業はしません こうした一言があるだけで、 問い合わせのハードルは下がります。 ■ 失敗④ スマホで使いにくいスマホで見ると、 ・入力しづらい ・ボタンが押しにくい ・画面が見づらい こうなっていると、 それだけで離脱されます。 今はスマホからの問い合わせが多いので、 ここはとても重要です。 ■ 問い合わせが増えるシンプルな形お問い合わせページは、 シンプルで大丈夫です。 ✔ 入力項目は少なめ ✔ 不安を減らす一言を入れる ✔ ボタンを分かりやすくする ✔ スマホでも使いやすい これだけで、 反応は変わってきます。 ■ 小さな改善で大きく変わるお問い合わせページは、 少しの工夫で変わりやすい部分

はじめにお問い合わせフォームの設置で必ず悩むのが、「どう管理するか」です。メールで管理する方法もありますが、運用していくと、・見落とす・埋もれる・探しにくいといった問題が発生します。そこで最近増えているのが、「スプレッドシートで管理する方法」です。シンプルですが、実務ではかなり強力です。ただし、注意点もあります。今回は、実際の運用ベースでメリット・デメリットを整理します。スプレッドシート管理とはお問い合わせフォームから送信された内容を、Googleスプレッドシートに自動で記録し、・一覧で確認・並び替え・共有できるようにする仕組みです。メリット一覧性が非常に高いメールと違い、すべての問い合わせが「1画面で見える」状態になります。・誰から来たか・いつ来たか・対応済みかがすぐ分かります。特に件数が増えてくると、この差はかなり大きくなります。並び替え・検索・抽出が自由スプレッドシートはデータ操作が非常に強力です。・未対応だけ表示・日付順に並び替え・特定の名前で検索などが簡単にできます。業務効率はメール管理より明らかに上がります。チーム共有が簡単URLを共有するだけで、・複数人で同時に確認・リアルタイム更新・コメントでやり取りが可能です。小規模なチームであれば、これだけで十分回ります。データ分析ができるスプレッドシートは単なる一覧ではなく、・問い合わせ数の推移・内容の傾向・対応状況などを可視化できます。簡易的なCRMのような使い方も可能です。開発コストが低いスプレッドシートを使う場合、・データベース設計・管理画面の作成が不要になります。APIやGASと連携するだけで構築できるため、初期コ

入力項目は必要最低限度に！ホームページに必ずあるお問い合わせフォーム。サイトによって入力項目が多岐にわたるものもあれば、簡潔で必要最低限のシンプルな場合もあります。ここで考えて欲しいのが、設置した入力項目が本当に必要なのか？実はなんとなく問うてるだけで、特に尋ねる必要がないものも多いのではないでしょうか？訪問者の立場からすれば、入力項目が多いほど「面倒くさい」のです。入力項目をパッと見て、離脱する人も少なくありません。せっかくお問い合わせフォームのページまでたどり着いたのに、そこで離脱されてしまっては、サイト運営者の苦労も水の泡です。入力項目を設定する際には、「本当にそれが必要か？」をよく考える必要があります。要らないものは極力、削りましょう。メールアドレスの2重確認は必須！メールアドレスを2回入力して間違いがないか確認することは重要です。みなさんも、様々なサービスにログインする際、ハッキリと覚えていると自信のあるログイン情報を入力してもエラーになることはありませんか？それは、ログイン情報の記憶ミスや単純なタイプミスです。これが結構多い。過去に営業で2000以上のWeb制作会社へ、お問い合わせフォームからメッセージを送信したことがあります。正確な記録は残していませんが、約8割のフォームがメールのダブルチェックを行なっていませんでした。つまり、メールの誤入力により、運営者側にメッセージが届いていないケースが一定数発生しているはずです。サイト運営者にとって、もっとも勿体ない重大なミスであり、同時に問い合わせをしてくださったお客さんを無視、スルーした形になります。お客さんを獲得できな

こんにちは。美容マーケターのコウイチです。まず、お知らせでブログ制作が案件作業で少しバタバタしており受付休止してましたが、ようやく作業が一通り終わりまして受付開始しました。コンタクトフォーム7をカスタマイズ現在、嬉しい事にご提案からサイト制作を4件ほど制作中でようやく２週間つきっきりで制作してました。企業サイトの場合固定ページが増えるので特に目標ゴールが問い合わせが欲しいという方が多く、プラグインのコンタクトフォーム7の使い方がイマイチわからないという方が多いですね。ブログのお問い合わせページカスタマイズ受注されて、コンタクトフォームのCSSを編集して制作したのが２種類でした！【デフォルト】【メニュー用のお問い合わせカスタマイズ】主に企業様向けですね。【記事内用のカスタマイズ】こちらは、記事内ですね。例えば、商品の簡単な商品ので知りたい、服なら寸法やサイズなど、わざわざメニューから項目をいっぱい設定して問い合わせは面倒くさい方はフッターや記事に固定で作成してアクションを増やすのも効果的ですね。一応、HTMLやCSS、jQurery（勉強中）と静的ページは作成してカスタマイズも出来ますが、どちらかというとテンプレートの最大限引き出す設定やカスタマイズやプラグイン機能をひたすら勉強して、初心者の方でもプロ並みのサイトそれもオリジナル感も引き出せるお手伝いをしております。今回の企業サイト制作はOne Pressを導入してコンテンツ量はクライアント様的に少し少なかったですが、画像制作とお問い合わせページをカスタマイズしてみました。出品サービスもこれから増やしていきますので是非ともご検討

Firebaseでバックエンドの実装をExpressで！Firebaseでバックエンドの処理を実装するには「ファンクション（Functions）」を使います。この記事では、Node.jsでバックエンドを実装する際に広く利用されているExpressのモジュールを使ってFirebaseのバックエンド機能を実装する方法を解説しています。 Firebaseのバックエンド（Functions）利用の手順 最初に、Firebaseのバックエンドを利用するための手順を簡単に説明します。 他の機能と同じで、Firebaseプロジェクトを作成します。 その後は、 ＊　Firebaseのプロジェクトフォルダの作成 ＊「firebase init」でFirebaseのプロジェクトフォルダの初期化 ＊　必要なモジュールのインストール ＊　バックエンドのコードの作成 ＊　Typescriptを利用する場合、「コンパイル」 ＊　開発用のPCでテスト ＊　インターネットに公開（デプロイ） ＊　Firebaseのプロジェクトフォルダの作成 これは、開発用のPCでFirebaseのバックエンドのプロジェクトフォルダを作成します。要領はFirebaseのホスティングの設定の場合とほぼ同じです。フォルダを新規に作成するだけです。 フォルダを作成したら、作成したフォルダに移動します。 FirebaseのSDKをインストールします。すでに「-g」オプションを付けてインストールしている場合は不要です。 $ npm install -g firebase-tools そのあとで、Firebase Admin SD

第1章：なぜ、あなたのフォームは「届かない」のか？Web制作15年の苦い経験「あれ？お問い合わせメールが届いていない…？」クライアントからのその一言に、ヒヤッとした経験はありませんか？Web制作の実務で、一番避けたいトラブルですよね。ネットにあるコードをコピペして使っていると、PHPのバージョンが変わったり、サーバーの設定が少し変わっただけで、突然「SyntaxError」を起こしてしまうことがあるんです。私は15年Web制作をしていますが、何度もそんな苦い思いをしてきました。だからこそ、「システムは完璧じゃない」という前提で、いかに「確実な証拠」を残すかが大切だと気づいたんです。第2章：GASが最強の「お守り」になる3つの理由（Bcc・スプレッドシート・0円）そこで私が辿り着いた、とっておきの「お守り」がGoogle Apps Script（GAS）です。理由は3つ。1つ目は、Bcc送信。お客さんへの自動返信と同時に、自分にも同じメールが届くので、「確かに送った」という証拠になります。2つ目は、スプレッドシートへのバックアップ。メールはうっかり消してしまうかも知れませんが、シートに全データを記録しておけば、いつでも見返せて安心です。3つ目は、サーバー代が0円なこと！Googleのシステムを使うのでPHPも不要、セキュリティ対策もバッチリ。まさにフリーランスや初学者に味方の「最強ツール」なんです。第3章：【準備】3分で完了！スプレッドシートと環境設定実装はとっても簡単です。まず、Googleスプレッドシートを新しく作って、1行目に「お名前」「メールアドレス」といった項目を書きま

はじめに個人サイトや小規模サイトを運営していると、お問い合わせの管理で次のような問題が起こります。メール管理だと見落としがある過去の問い合わせを探しにくい複数人で共有できないこの問題を解決する方法としてよく使われるのがお問い合わせ内容をGoogleスプレッドシートに保存する方法です。こんなサービスも作成しました。↓↓↓この記事ではフォーム → スプレッドシート連携の方法Google Apps Script（GAS）での実装実際に作ってわかった問題を解説します。お問い合わせフォームをスプレッドシートで管理するメリット問い合わせ内容をスプレッドシートに保存すると、次のメリットがあります。履歴管理 問い合わせ履歴を一覧管理できる検索 名前やメールで検索できる共有 チームで共有できる分析 問い合わせ数の分析ができる構造としては次のようになります。お問い合わせフォーム        ↓サーバー        ↓Googleスプレッドシートこの仕組みを作ることで、問い合わせ管理が非常に楽になります。主な方法としては以下の３つGoogleフォーム 最も簡単だが自由度が低いWordPressプラグイン WordPressサイトのみAPI連携 自由度が高いGoogle公式でもGoogle Apps Script を使ってWebアプリを作る方法が紹介されています。GASを使うと、次の構成が作れます。HTMLフォーム      ↓fetch POST      ↓GAS Webアプリ      ↓Googleスプレッドシートメリットは次の通りです。サーバー不要Googleサービスと連携しやすい無料で

個人事業主として便利なWebサービスを作りました。「お問い合わせフォームの内容をGoogleスプレッドシートに自動記録する仕組み」です。メインの機能はお問い合わせフォームの内容をスプレッドシートに保存する。一見するとシンプルな仕組みですが、奥の深いサービスになっています。きっかけ一番の理由は自分が欲しかったからです。ワードプレスなどのCMSを使わずホームページやウェブサービスを運営していると、必ず必要になるのが お問い合わせフォームです。既存のサービスをつかうとメールは届くけど👇の問題が。。。・メールで届くだけで管理がしにくい・過去の履歴を探しにくい・スパムの件数が尋常じゃない（1分数十件とか。とくにWORDPRESSは恰好の標的）というのもあって、スプシで管理できるとそのままタスク管理もできるし複数人で見ることもできるし便利だと思うのは全人類の共通認識ではないでしょうか。特に小規模サイトや個人事業主の場合、この「メールだけで問い合わせを管理している」というケースがとても多いように感じました。仕組みのイメージ仕組みとしてはとてもシンプルです。ホームページのフォーム        ↓お問い合わせAPI        ↓Googleスプレッドシートフォームから送信された内容をAPIで受け取り、そのままスプレッドシートに1行ずつ記録されていきます。👇これだけで問い合わせ履歴の管理やスタッフとの連携が楽になります。実際楽になったんですよ、ほんと。僕メール見ないし。上の画像をみるとわかるのですが、送信元のサイトや直前に見ていたサイト、グローバルIPアドレスや送信者の環境も記録するようにな

■ あるカフェ店主さんの悩み小さなカフェ 兼 洋菓子店を営む、店主のミカさん。この店を始めてからずっと、月に十数件は必ず、席の予約やギフトのお菓子の問い合わせが入っていたので、それが当たり前だと思っていました。ところがここ1年ほど、ホームページからの問い合わせがぱったり止まってしまったのです。「あれ…？ ずっと安定して問い合わせが来ていたのに…。みんなウチに興味がなくなっちゃったのかな…？」ホームページには美味しそうなケーキやお菓子の写真を載せ続けているし、アクセス解析を見ても、ホームページには毎日お客さんが訪れている。それなのに、問い合わせフォームからはずっとゼロのまま。ミカさんは不安で胸がざわついていました。「この1年、いったい何が起きているんだろう…？」■ 実は「問い合わせゼロ＝人気ゼロ」ではないそんなある日、いつも来てくれる常連さんがミカさんにこう声をかけました。「この前ね、ホームページから予約の問い合わせをしたんだけど…返事がこなくて…」ミカさんはびっくり。「えっ！？ 通知のメール、来ていないかも…」常連さんは申し訳なさそうに続けます。「そういえば、前は、私にも、自動返信メールというのが来ていたけど、それも来ていなくて・・・。私が何か間違えたのかな？と思って、結局電話したんだけどね。もしかして、ほかの人もそうなっているのかな…？」その言葉を聞いて、ミカさんは背筋がゾッとしました。「まさか…“問い合わせゼロ”は、お店への興味が減ったんじゃなくて、メールが届いていなかっただけ…？」■ 問い合わせは送られているのに、メールが届かない？ミカさんは、Webに詳しい知人に相談しま

この記事では、ワードプレスサイトに自作のお問い合わせ機能を実装する方法を解説いたします。ダウンロードしたファイルをサーバーにアップするだけで、下記の機能を備えたお問い合わせ機能を実装できます。ファイルのコードを編集するとオリジナルのお問い合わせ機能を簡単に実装できます。①未入力項目の確認②入力内容の確認ページ③お問い合わせ完了後のサンクスページ④ユーザーへのお問い合わせ内容のメール送信⑤サイト運営者へのお問い合わせ内容のメール送信お問い合わせ機能を実装するにあたっては、サーバーにファイルをアップロードできる知識が必要です。私は、さくらインターネットのサーバーを利用していますので、解説画像等はさくらインターネットの環境のものになりますが、各々の環境の方法で、実装してください。アップロードするファイルは、記事を購入していただくことで閲覧できます。各ファイルのコードを記述しますので、コピペしてファイルを作成して下さい。アップロードするファイル下記の6つのファイルを作成して、お使いのサーバーにアップロードします。①contact-index.phpベースとなるファイルです。お問い合わせ完了後に送信されるメールに表示される名前とメールアドレスを設定したり、お使いのテーマに合わせたヘッダー、フッターの読込を設定します。②contact-input.phpお問い合わせフォームの内容を記述しています。③contact-check.phpお問い合わせフォームの入力項目のエラーチェックをおこなうファイルです。④contact-confirm.phpお問い合わせ内容の確認ページのファイルです。⑤co