ویدیوهای فارسی و رایگان آموزش وردپرس

همینک دانلود و تماشا کنید

WP Sticky Sidebar افزونه سایدبار چسبان

سایدبار چسبان به نوار کناری ای گفته می‌شود که حتی با بالا و پایین رفتن صفحهٔ سایت، همچنان تمامی قسمت‌های آن برای بازدید کننده مشهود است. مزیت استفاده از سایدبار چسبان این است که همواره در معرض دید بازدید کننده است و کاری می‌کند تا وی بهتر بتواند در بین صفحات مختلف سایت جابجا شود. بنابراین نرخ پرش سایت کاهش یافته و سبب بهبود بازدید سایت می‌گردد. برای تبدیل سایدبار معمولی سایت به یک سایدبار چسبان، روش های مختلفی وجود دارد که یکی از آنها استفاده از افزونه سایدبار چسبان با نام WP Sticky Sidebar است. در ادامه آموزش نحوهٔ استفاده از این آموزش را تقدیم شما خواهیم کرد.

WP Sticky Sidebar افزونه سایدبار چسبان

کاری که این افزونه انجام می‌دهد این است که با ترکیب CSS و javaScript عنصر نوار کناری سایت را به صورت ثابت در می‌آورد. البته تقریباً در ۹۰ درصد مواقع، افزونه به صورت خودکار قادر نیست نوار کناری را پیدا کند، تا آن را به صورت ثابت درآورد. به همین دلیل ما باید شناسهٔ ID یا Class نوار کناری را به افزوده بدهیم به او بگوییم که این عنصر نوار کناری است و لطفاً آن را برای ما متحرک کن!

آموزش کار با افزونه WP Sticky Sidebar

به صفحهٔ افزونه‌ها » افزودن رفته و نام WP Sticky Sidebar را جستجو کرده و روی دکمه نصب و سپس فعال کردن آن کلیک می‌کنیم. این اولین گام برای استفاده از این افزونه است. بعد از آن احتمالاً شما هم مثل من مستقیماً وارد صفحهٔ تنظیمات آن خواهید شد. در مواقعی که برچسب DIV نوار کناری سایت شما در کدهای قالب، دارای ID یا شناسهٔ secondary باشد، نیازی نیست شما کار خاصی انجام دهید. بیشتر قالب های پیش فرض، مثل همان قالب پیش فرض ۲۰۱۶ و ۲۰۱۷ وردپرس، این شناسه را دارند. افزونه برچسب نوار کناری را تشخیص می‌دهد و کارش را انجام می‌دهد. اگر به سایت مراجعه کنید، خواهید دید که نوار کناری خیلی شکیل، به حالت چسبان درآمده است.

یک آموزش جذاب دیگه!  افزونه سایدبار چسبان Fixed Widget for WordPress

اما در مواقعی که قالب شما دارای این شناسه برای نوار کناری نیست، باید به افزونه بفهمانید که برچسب نوار کناری دارای چه شناسه‌ای است. برای این منظور در همان صفحهٔ تنظیمات WP Sticky Sidebar گزینه‌ای با نام Sticky Class وجود دارد. در همان ابتدای صفحه است. در این جعبه شما باید ID یا Class برچسب نوار کناری را وارد کنید.

تنظیمات کلاس CSS نوار کناری در افزونه WP Sticky Sidebar

برای اینکه بدانید ID یا Class برچسب نوار کناری چیست، کمی باید فنی عمل کنید. با مرورگر وارد یکی از صفحات سایت شوید که حاوی سایدبار است. سپس روی عنصر نوار کناری راست کلیک کنید و در مرورگر کروم دستور Inspect را انتخاب کنید. بعد از آن Developer برای شما باز خواهد شد که باید به سربرگ اول یعنی Elements رفته و ID یا Class موجود در Divای که مختص نوار کناری است را پیدا کنید. سپس آن را برداشته و در همان جعبهٔ اول در صفحهٔ تنظیمات، که به شما گفتم، وارد نمایید.

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

یک آموزش جذاب دیگه!  سایدبار متحرک وردپرس

در صفحهٔ تنظیمات افزونه با نام WP Sticky Sidebar Settings چند تا گزینهٔ دیگر هم وجود دارد. مثل گزینه‌های زیر در گروه Settings که با هم کاربردشان را بررسی می‌کنیم.

  • Additional top margin : مقدار حاشیه بیشتر از بالا
  • Additional bottom margin : مقدار حاشیه بیشتر از پایین
  • Disable in small screens : غیر فعال کردن حالت نوار کناری چسبان برای صفحه نمایش‌هایی کوچک‌تر از چیزی که در این قسمت تعیین شده.
  • Update sidebar height : این گزینه هم برای پیدا کردن ایراد، در مواقعی است که پس زمینهٔ نوار کناری حذف می‌شود.
تنظیمات نوار کناری در WP Sticky Sidebar

بعد از انجام تنظیمات مذکور، حتماً روی دکمهٔ SAVE در پایین صفحه کلیک کنید و از صفحه خارج شوید. بعد از آن تغییرات مورد نظرتان را در سایت مشاهده خواهید کرد.

نتیجه کار با افزونه WP Sticky Sidebar

صفحه افزونه WP Sticky Sidebar – Floating Sidebar On Scroll for Any Theme

ارسال دیدگاه

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

آموزش جامع وردپرس

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

آموزش افزونه Yoast SEO

درباره ®WPTutorial

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

هنوز دنبال هاست خوب می‌گردید؟!

🥇 هاست حرفه‌ای همراه با؛ بسته های رایگان ویدیوهای آموزش وردپرس و طراحی سایت !
کد تخفیف 10 درصد : off10wt

خرید هاست و دامین ارزان

هاست فوق العاده