آموزش های وردپرسخانهسیستم مدیریت محتواعمومی

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

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

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

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

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

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

راهکار اول: استفاده از افزونه اسکرول به بالای صفحه وردپرس

افزونه‌ای که قصد معرفی اونو دارم با عنوان WPFront Scroll Top در مخزن وردپرس به ثبت رسیده و تا حالا تونسته تا بیش از 40.000 نصب فعال و کسب امتیاز 5 را ازآن خودش بکنه که با استفاده از این افزونه میتونید تا اقدام به افزودن دکمه بازگشت به بالای صفحه در وردپرس کنید. برای استفاده از این افزونه با کلیک روی دکمه زیر به صفحه افزونه در مخزن وردپرس مراجعه کنید و سپس با استفاده از آموزش نحوه نصب و کار کردن با افزونه ها در وردپرس اقدام به نصب و فهال سازی این افزونه در سایت وردپرسی خودتون بکنید.

دانلود افزونه WPFront Scroll Top

بعد از نصب و فعال سازی افزونه مشابه تصویر زیر منویی با نام WPFront در پیشخوان سایت وردپرسی شما اضافه خواهد شد،‌ روی منو کلیک کنید تا به صفحه تنظیمات و سفارشی سازی دکمه اسکرول هدایت شوید.

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

Enabled: برای فعال کردن نمایش دکمه اسکرول وردپرس این گزینه را فعال کنید.

JavaScript Async: با فعال کردن این گزینه امکان اسکرول توسط جاوا اسکریپت اضافه شده و کارکرد بهتری را در هنگام بازگشت به بالای صفحه در وردپرس خواهید داشت.

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

Button Size: اندازه ثابت دکمه اسکرول را بر حسب پیکسل انتخاب کنید. در صورت قرار دادن صفر این مقدار به صورت رسپانسیو در هر نمایشگر به اندازه استاندارد نمایش داده خواهد شد.

Button Opacity: میزان کدر بودن دکمه اسکرول وردپرس را انتخاب کنید.

Button Fade Duration: مدت زمان محو شدن دکمه اسکرول پس از رسیدن به بالای صفحه را بر حسب میلی ثانیه انتخاب کنید.

Scroll Duration: مدت زمان اسکرول را انتخاب کنید.

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

Auto Hide After: مدت زمان مورد نظر برای مخفی شدن دکمه اسکرول بر حسب ثانیه را وارد کنید.

Hide on Small Devices: با فعال کردن این گزینه در نمایشگرهایی با اندازه کوچک که در بخش بعدی یعنی در فیلد Small Device Max Width حداکثر اندازه آن را مشخص می‌کنید دکمه اسکرول نمایش داده نخواهد شد.

Hide on Small Window: با فعال کردن این گزینه نیز مشابه مورد قبل برای پنجره مرورگر در محیط ویندوز،‌لینوکس،‌مک و سایر سیستم‌عامل‌های کامپیوتری می‌توانید حداکثر اندازه را در فیلد Small Window Max Width وارد کنید تا دکمه اسکرول در آنها مخفی شود.

Hide on WP-ADMIN: در صورتی که تمایلی به نمایش دکمه اسکرول وردپرس در پیشخوان وردپرس ندارید این گزینه را فعال کنید تا از بخش پیشخوان مخفی شود.

Hide on iframes: با فعال کردن این گزینه دکمه اسکرول در آی‌فریم‌هایی که در صفحات خود استفاده می‌کنید مخفی خواهد شد.

Move Admin Menu: با فعال کردن این گزینه منوی تنظیمات این افزونه به زیر منوی تنظیمات در پیشخوان وردپرس منتقل خواهد شد.

Button Style: از این بخش نوع دکمه خود را در حالت متنی، تصویر یا فونت آویسام انتخاب کنید.

Location: در این بخش هم میتونید موقعیت نمایش دکمه در بالا یا پایین صفحات با امکان نمایش در سمت چپ یا راست صفحه را انتخاب کرده و از بخش Margin نیز می‌توانید به ترتیب فاصله آن را از بخش افقی و عمودی تعیین کنید.

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

Filter: از این بخش نیز قادر خواهید بود تا نمایش دکمه اسکرول وردپرس را برای صفحات خاصی غیرفعال کنید.

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

Image Button: از این بخش میتونید تصویر مورد نظر برای اسکرول وردپرس را انتخاب کرده و یا اینکه از بخش Custom URL آدرس تصویر دلخواه خود را برای نمایش به عنوان دکمه اسکرول در وردپرس وارد کنید. بعد از اینکه تصویر دلخواه خودتون را انتخاب کردید در فیلد Image ALT هم میتونید تا عنوان تصویر را وارد کنید.

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

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

اما اگر تمایلی به استفاده از افزونه نداشتید میتونید تا به راحتی با ند خط کدنویسی و تغییرات در قالب وردپرس خودتون امکان اسکرول به بالای صفحه را فراهم کنید. برای این منظور ابتدا وارد هاست خودتون شده و روی دکمه File Manager کلیک کنید.

افزودن منو به قالب وردپرس

بعد از اینکه وارد صفحه مدیریت فایل‌ها در هاست خودتون شدید به مسیر /public_html/wp-content/themes/ مراجعه کنید و سپس وارد پوشه قالبی که از اون استفاده میکنید و در حال حاضر روی سایت شما فعال است کلیک کنید. بعد از اینکه وارد پوشه قالب شدید وارد پوشه js شوید، در صورتی که چنین پوشه‌ای ندارید یک پوشه با نام js در اون ایجاد کنید و سپس با استفاده از برنامه ویرایشگر متن مثل notepad کدهای زیر را در فایلی با نام scrolltotop.js ذخیره کرده و در نهایت داخل پوشه js آپلود کنید.


jQuery(document).ready(function($){
$(window).scroll(function(){
if ($(this).scrollTop() < 200) {
$('#smoothup') .fadeOut();
} else {
$('#smoothup') .fadeIn();
}
});
$('#smoothup').on('click', function(){
$('html, body').animate({scrollTop:0}, 'fast');
return false;
});
});

12345678910111213jQuery(document).ready(function($){$(window).scroll(function(){if ($(this).scrollTop()



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


وردپرس با WPFront Scroll Top
اضافه کردن دکمه بازگشت به بالا در وردپرس با WPFront Scroll Top


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


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


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


وردپرس با افزونه Scroll
دکمه بازگشت به ابتدای صفحه در وردپرس با افزونه Scroll Bar With


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


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


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


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

برچسب ها

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

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

1 × دو =

دکمه بازگشت به بالا
بستن