نحوه افزودن دکمه تماس تلفنی در وردپرس

1402/11/18
165 بازدید
دکمه-تماس-تلفنی

برقراری ارتباط ساده کاربران وب‌سایت شما تاثیر مستقیمی در فروش شما خواهد داشت و دکمه تلفنی که بتوانند با شما تماس بگیرند، باعث افزایش رضایت آن‌ها و در آخر افزایش فروش شما می‌شود.

در این مقاله با ما همراه باشید تا نحوه ساخت دکمه تماس تلفنی را در وردپرس بررسی نماییم.

نحوه کارکردن دکمه‌های تماس تلفنی

به هر دلیلی ممکن است کاربران شما نیاز داشته باشند تا سریعا با شما تماس بگیرند.

بنابراین دکمه تماس در سایت شما ارزش زیادی خواهد داشت.

از دکمه‌های تماس می‌توانید در هر جای سایت خود از جمله پاورقی ، ستون‌ها ، ابزارک‌ها و غیره استفاده نمایید.

افزودن دکمه تماس تلفنی با html

برای برقراری تماس تلفنی در وردپرس می‌توانید کد زیر را در هر جای سایت خود جایگذاری کنید:

<a href="tel:123-456-7890">123-456-7890</a>

 

در قطعه کد بالا href=tel لینک تماس را ایجاد و tel:123-456-7890 شماره تلفنی است که کاربران با آن تماس می‌گیرند.

برای استفاده بهتر از وردپرس هاست مخصوص وردپرس تهیه کنید!

شماره‌ای که بین تگ a است متنی است که به کاربران نمایش داده می‌شود که می‌توانید به جای شماره عبارت ((برای تماس با ما کلیک نمایید)) را قرار دهید.

وقتی کاربران بر روی عبارت کلیک می‌کنند؛ به صفحه شماره‌گیر تلفن خود منتقل می‌شوند تا با شما تماس بگیرند.

نحوه ایجاد مکث در تماس

قبل از شماره‌گیری داخلی، می‌توانید کدی را اضافه کنید که یک مکث کوتاهی ایجاد کند.

با اضافه کردن کد P در مقابل شماره تلفن، مکث یک ثانیه‌ای اضافه می‌کنید که قطعه کد به شکل زیر می‌شود:

<a href="tel:123-456-7890p123"> اکنون تماس بگیرید</a>

 

استفاده از کد کشور

کد کشور را می‌توانید به این دکمه اضافه کنید که شبیه قطعه کد زیر می‌شود:

<a href="tel:+1123-456-7890">123-456-7890</a>

 

راه‌های ارتباطی دیگر با کاربران

شما با استفاده از کدهای html می‌توانید؛ راه‌های ارتباطی دیگری نیز به سایت خود اضافه کنید؛ مانند:
تماس تلفنی
ایمیل
اسکایپ
اس‌ام‌اس (پیام متنی)
فکس

همه موارد بالا را می‌توانید استفاده کنید.

در ادامه با ما باشید تا چند مورد را بررسی نماییم:

افزودن کد تماس به صفحه تماس با ما

یکی از بهترین صفحه‌ها برای افزودن دکمه تماس، صفحه تماس با ما است.

وارد صفحه تماس با ما سایتتان شوید و صفحه را ویرایش کنید.

بر روی بلوک اطلاعات تماس کلیک کنید و گزینه ((ویرایش به عنوان html)) را انتخاب کنید و به جای شماره تلفن، کد را اضافه کنید و دکمه را ذخیره و می‌بینید که به جای شماره تلفن، لینک تماس که قابل کلیک است، تغییر کرده‌است.

نحوه ایجاد کد ایمیل

با html می‌توانید لینک ارسال ایمیل هم بسازید که با mailto: مانند قطعه کد زیر می‌باشد:

<a href="mailto:[email protected]"> [email protected] </a>

 

همانند دکمه تماس تلفن به جای ایمیل می‌توانید از عبارتی مانند ((برای ارسال ایمیل کلیک کنید)) استفاده نمایید:

<a href="mailto: [email protected]">برای ارسال ایمیل کلیک کنید</a>

 

افزودن کد به هدر یا فوتر سایت

با استفاده از ویرایشگر پوسته می‌توانید کد مورد نظرتان را به هدر یا فوتر سایتتان اضافه نمایید ولی برای اینکه ظاهر زیبایی نیز داشته باشد به یک استایل در css هم نیاز دارید.

حتما مقاله راه‌های رفع خطای انتشار ناموفق در وردپرس را بخوانید.

برای این کار وارد پیشخوان وردپرس خود شوید و در قسمت نمایش، وارد گزینه ویرایشگر پوسته شوید و به پوشه پابرگ پوسته بروید و کد را در قسمت <body> قرار دهید.

به این نکته دقت کنید که کد را باید بعد از یک تگ پایان‌دهنده قرار دهید.

زیبا کردن ظاهر لینک‌ها

برای زیباتر کردن ظاهر لینک‌ها کافیست قطعه کد زیر را به قسمت css سفارشی اضافه کنید:

a[href^="tel:"] {
color: brown;
text-decoration: none;
margin-right: 0.em;
}
a[href^="mailto:"] {
color: orange;
text-decoration: none;
margin-right: 0.8em;
}

 

با این کد css چگونه متن را برای tel و mailto تنظیم کند.

فونت شماره تلفن به رنگ زرد و فونت ایمیل به نارنجی تغییر می‌کند و کمی حاشیه نیز به سمت راست هر لینک اضافه می‌شود.

افزونه call now button

نحوه افزودن دکمه تماس تلفنی در وردپرس 2

با افزونه call now button می‌توانید یک دکمه تماس تلفنی را به پایین صفحه برای کاربرانی که با گوشی وارد سایت شما شدند، اضافه کنید که در دستگاه‌های دیگر این دکمه نشان داده نمی‌شود و در صورت تمایل می‌توانید متن نیز به آن اضافه نمایید.

کافیست تا افزونه را نصب و فعال کرده و شماره تلفن خود را در افزونه وارد و دکمه را فعال کنید.

افزونه sticky side buttons

این افزونه به شما این قابلیت را می‌دهد که دکمه‌ای در کنار وب‌سایت شما اضافه شود و هنگام اسکرول می‌توانید آیکون‌های نظیر شماره تلفن ، آدرس ایمیل و آیکون شبکه‌های اجتماعی را به آن اضافه کنید.

می‌توانید مکان نمایش آن و غیره سفارشی کنید.

با تشکر از این که تا پایان آموزش “نحوه افزودن دکمه تماس تلفنی در وردپرس” همراه ما بودید.

6 پاسخ

  1. یکی از بهترین روش های مارکتینگ برای جامعه هدفی که کاربران آشنایی زیاد با محیط وب ندارند!

دیدگاهتان را بنویسید

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *

آخرین مقالات