ساخت دکمه بازگشت به بالای صفحه در وردپرس با افزونه Scroll Top + (ویدئوی آموزشی)

scroll top plugin aylinweb

فهرست مطالب

با عرض سلام خدمت شما عزیزانی که در این بخش با ما همراه هستید. به طور قطع شما هم میدانید زمانی که به پایین یک صفحه می رسید در واقع یک دکمه زیبا و کوچک که معمولا به شکل دایره است در پایین صفحه ظاهر می شود. دکمه برگشت به بالا در واقع به کاربران کمک میکند تا بازگشت به صفحه ابتدایی آسان تر شود و بیشتر به منظور راحتی کاربران در نظر گرفته شده است. دقت داشته باشید که معمولا در وبسایت هایی که محتوای طولانی دارند شما میتوانید از این دکمه استفاده کنید تا به راحتی به اول صفحه برگردید. در این بخش می خواهیم به معرفی افزونه ای بپردازیم که رایگان است و این قابلیت را به آسانی برای شما ایجاد خواهد کرد.

[toc]

افزونه های ایجاد دکمه برای بازگشت به ابتدای صفحه در وردپرس :

همانطور که در بخش های قبل بررسی کرده ایم افزونه های متعددی برای اینکار وجود دارند اما در میان آن ها افزونه Scroll Top یکی از انواع معروف آن هاست.

افزونه بازگشت به بالا
افزونه ساخت دکمه بازگشت به بالا در وردپرس

این افزونه در واقع تاکنون بیش از ۱۰ هزار بار نصب موفق داشته است که در نهایت باعث شده است تا در مخزن وردپرس به عنوان برنامه های پر کاربرد انتخاب شود.

مقاله پیشنهادی ما :ساخت پاپ آپ در وردپرس

بعد از نصب و فعالسازی افزونه Scroll Top به قسمت تنظیمات رفته و شخصی سازی های خود را انجام دهید. برای آشنایی با نصب و فعال کردن افزونه به مقاله پیشنهادی زیر مراجعه کنید.

مقاله پیشنهادی : نصب کردن افزونه در وردپرس

تنظیمات افزونه بازگشت به بالا
تنظیمات و پیکربندی افزونه scroll top

این پلاگین همانطور که گفته شد دارای ویژگی های متعددی است که از جمله آنها می توان نداشتن تنظیمات پیچیده را نام برد. شما دوستان عزیز به راحتی می توانید پس از نصب و آماده سازی افزونه مورد نظر تنظیمات مربوطه را انجام دهید و سپس آن را در وبسایت وردپرسی خود استفاده کنید.

آموزش کار با افزونه Scroll Top:

پس از اینکه افزونه موردنظر را نصب کردید و مراحل فعال سازی را نیز انجام داده اید آیتم هایی را در منوی پیشخوان تنظیمات خواهید دید که تحت عنوان Scroll top settings نامیده شده اند. پس از کلیک کردن روی این بخش خواهید دید که در بخش تنظیمات گزینه های متفاوتی وجود دارد که میتوانید آن ها را به صورت پیش فرض وارد بخش Scroll Bar کنید. در واقع این تنظیمات مربوط به ظاهر هستند و هیچ عملیات و پردازشی را نیز انجام نمی دهند.

افزونه Scroll top به صورت خودکار دکمه برگشت به بالا را قرار میدهد در ادامه به تنظیمات افزونه اشاره میکنیم.

نکته ای که اینجا حائز اهمیت است این است که شما در ابتدای تنظیمات وردپرسی خود مشخص کنید که این افزونه فعال باشد یا غیرفعال. در هرصورت تاکید ما بر زمانیست که این افزونه غیرفعال است در نتیجه بخش تنظیمات را به صورت پیش فرض روی فعال قرار می دهیم. در بخش بعدی میتوانید رنگی را که مدنظر دارید برای پس زمینه دکمه مشخص کنید. این بخش کاملا سلیقه ای است و شما میتوانید با توجه به تم وبسایت خود آن را انتخاب کنید. دقت کنید رنگی را انتخاب کنید که قابل دیدن باشد.

بازگشت به بالای صفحه
دکمه بازگشت به ابتدای صفحه

در بخش بعدی می توانید شکل آیکون را مشخص کنید . در بخش Color میتوان رنگ را انتخاب کنید که همانطور که گفته شد کاملا مطابق با سلیقه شما خواهد بود.

[su_note note_color=”#ff5959″ text_color=”#ffffff” radius=”8″ class=”.aylin_mahmoud”]تا اینجا حدود ۵۰ الی ۶۰ درصد از کارهایی که باید را انجام داده اید. هم اکنون میخواهیم ببینیم که این تنظیمات به چه صورت انجام گرفته اند در نتیجه می توانید روی گزینه ذخیره تغییرات کلیک کنید و سپس ببینید که آیا تغییراتی که اعمال شده است به چه صورت است.[/su_note]

  • گزینه speed در این بخش شما میتوانید سرعت برگشت به بالا را تغییر دهید. این بخش در واقع به صوررت میلی ثانیه تغییر پیدا میکنید که شما بنا به سلیقه و سایت خود انتخاب میکنید.
  • در قسمت Distance میتوانید طوری تنظیم کنید که بعد از چند پیکسل اسکرول کردن به پایین دکمه بالا رفتن به نمایش گذاشته شود. این قسمت میتواند بسیار کاربردی باشد.
  • Animation در این قسمت شما سه گزینه در اختیار دارید که میتوانید انتخاب کنید که با چه مدل انیمیشنی به بالا اسکرول شود و یال هیچ گونه انیمیشنی نداشته باشد.
  • position هم به شما این امکان را میدهد دکمه مورد نظر در سمت چپ باشد یا در سمت راست .
  • در قسمت آخر هم میتوانید اگر کد Css خاصی را در نظر داشتید کد خود را وارد کنید.

هم اکنون با کلیک روی گزینه ی Save settings می توانید وارد صفحه اصلی سایت شوید و همچنین خروجی کار را مشاهده کنید. امیدواریم که این اطلاعات برای شما مفید بوده باشند.

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

در صورت بروز هرگونه مشکل می توانید سوالات خود را با ما مطرح کنید.

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