افزونه پیمایش صفحه. افزونه پیمایش صفحه وردپرس (صفحه بندی).

در مقاله امروز در مورد افزونه ای به نام WP-PageNavi. این افزونه مفید به شما امکان می دهد تا ناوبری صفحه به صفحه وبلاگ وردپرس خود را راحت تر از روش پیش فرض سازماندهی کنید. در اصل، راحتی ناوبری صفحه استاندارد یک سوال نسبی است و استفاده از ابزارهای به اصطلاح پیش فرض کاملاً ممکن است، اما WP-PageNavi گزینه بسیار جذاب تری را به ما ارائه می دهد. اگر به‌طور پیش‌فرض دو دکمه «پیش‌تر» و «بعد» را به عنوان پیمایش صفحه داشته باشیم، یعنی صفحات را به‌طور متوالی در جستجوی مورد نیاز خود پیمایش کنیم، پس از اینکه WP-PageNavi در نهایت نصب و پیکربندی شد، دکمه‌هایی دریافت می‌کنیم که نشان می‌دهند. شماره صفحات، که به ما امکان می دهد به راحتی به صفحه مورد نظر برویم. بسته به تنظیمات انتخاب شده، نوار ناوبری ممکن است متفاوت به نظر برسد، اما کمی بعد به این موضوع خواهیم پرداخت.

یک وبلاگ نویس تازه کار برای استفاده از افزونه PageNavi برای سازماندهی ناوبری وبلاگ چه دلایل خاصی ممکن است داشته باشد؟ شاید در ابتدا چنین نیازی ایجاد نشود و دو دکمه برای پیمایش پنج صفحه وبلاگ کاملاً کافی باشد. اما با گذشت زمان، حجم اطلاعات و در نتیجه صفحات به طور پیوسته در حال افزایش است، و پیمایش منظم ناخوشایند می شود، و برای خواننده آسان تر است که به خاطر بیاورد که در کدام صفحه خواندن را به پایان رسانده یا مقاله لازم را پیدا کرده است تا اینکه چند بار به خاطر بیاورد. بر روی دکمه "بعدی" کلیک کنید. به همین دلیل است که PageNavi یک تکامل منطقی از ناوبری تقریباً هر وبلاگ است. البته افزونه های مشابه دیگری نیز وجود دارند، اما این WP-PageNavi است که بیشترین شهرت و محبوبیت را به دست آورده است.

نصب WP-PageNavi

طبیعتا قبل از کار با این افزونه آن را دانلود و نصب می کنیم. پس از اینکه بایگانی مورد نیاز را با افزونه دانلود کردیم، باید بسته بندی شود. در نتیجه، پوشه‌ای به نام WP-PAGENAVI دریافت می‌کنیم که سپس آن را به سرور میزبان شما در پوشه با افزونه‌های وردپرس آپلود می‌کنیم که با نام wp-content/plugins/ پیدا می‌کنیم.

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

باید به این نکته توجه ویژه داشت که پوشه ای که فایل های افزونه در آن قرار دارند باید مستقیماً در سرور میزبان کپی شود. اگر پوشه ای به همین نام را که پوشه مورد نیاز ما در داخل آن قرار دارد کپی کنید، وردپرس نمی تواند افزونه نصب شده را ببیند و بر این اساس نمی تواند به کار خود ادامه دهد.
پس از اتمام کپی کردن فایل های افزونه WP-PageNavi، قدم بعدی شما این است که وارد قسمت مدیریت وردپرس شوید و "Plugins" را انتخاب کنید. پس از این، پنجره مدیریت افزونه در مقابل شما ظاهر می شود، جایی که انتخاب شما پیوند "غیر فعال" ("غیر فعال"، در نسخه انگلیسی) است. این عمل به شما امکان می دهد لیستی از افزونه های نصب شده اما هنوز فعال نشده را برای وبلاگ خود باز کنید.

در این لیست، باید افزونه WP-PageNavi مورد نیاز خود را پیدا کنید و روی پیوند «فعال کردن» کلیک کنید (این افزونه درست زیر نام افزونه قرار دارد).

درج کد خروجی افزونه WP-PageNavi در قالب های قالب وردپرس

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

به عنوان یک قاعده، استفاده از پیمایش صفحه در صفحه اصلی مرتبط است (این فایل INDEX.PHP در پوشه با موضوع مورد استفاده است)، و همچنین در دو مورد دیگر - در صفحه بایگانی (ARHIVE.PHP) و صفحه نتایج جستجو برای کل وبلاگ (SEARCH.PHP). بنابراین، در این سه فایل است که باید کد سرویس افزونه PageNavi را وارد کنیم که به ما امکان می دهد یک پنل ناوبری مناسب را در جای مناسب در وبلاگ وردپرس خود نمایش دهیم. برای درج کد سرویس افزونه PageNavi در فایل های قالب مورد نیاز، باید از طریق پروتکل FTP به وبلاگ متصل شده و به پوشه ای با موضوع مورد استفاده فعلی بروید.

ابتدا بیایید فایلی به نام INDEX.PHP را در پوشه تم پیدا کنیم و ویرایش آن را در راحت ترین و آشناترین ویرایشگر شروع کنیم (من شخصاً از Notepad پیشرفته Notepad ++ برای این منظور استفاده می کنم).

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

کد پیمایش صفحه در فایل INDEX.PHP تم شما می تواند شبیه هر چیزی باشد، اما اکنون باید آن را به درستی شناسایی کرده و سپس آن را با خط تماس افزونه wp_pagenavi که در نظر داریم جایگزین کنید. این خط به شکل زیر است: . تغییرات ایجاد شده در فایل را ذخیره می کنیم، به صفحه اصلی وبلاگ می رویم و مطمئن می شویم که همه چیز دقیقاً همانطور که نیاز داشتیم کار می کند.

در اصل، کد پیمایش استاندارد موجود در فایل INDEX.PHP نیازی به حذف ندارد، تا بعداً وقتی افزونه ما را حذف کردید، پیمایش صفحه وبلاگ شما به اندازه کافی کار کند. برای انجام این کار، به جای کد استاندارد برای پیمایش صفحه، باید شرطی بنویسید که تعیین می کند چه زمانی پیمایش استاندارد وردپرس نمایش داده شود و چه زمانی نوار پیمایش صفحه که با استفاده از افزونه WP-PageNavi ایجاد می شود، نمایش داده شود. .

به هر حال، کفایت ناوبری نیز در این است که بتوان به عنوان مثال، از صفحه اصلی به هر صفحه دیگری دسترسی داشت. به راحتی می توان فهمید که دکمه های استاندارد «به جلو» و «بازگشت» برای این منظور مناسب نیستند، به خصوص برای وبلاگ های چند صفحه ای.

پس از اتمام کار با فایل INDEX.PHP، باید همین کار را برای فایل های باقیمانده (SEARCH.PHP و ARCHIVE.PHP) از همان پوشه موضوعی وبلاگ خود انجام دهید. پس از انجام موفقیت آمیز این عملیات، می توانیم فرض کنیم که ما به طور کامل نحوه تنظیم صفحه نمایش پانل را که ناوبری صفحه را در وبلاگ وردپرس ما ارائه می دهد، مشخص کرده ایم. با این حال، این همه چیز نیست، زیرا اکنون ما در شرف آشنایی با تنظیمات افزونه هستیم که به ما امکان می دهد ساختار پانل پیمایش صفحه را تغییر دهیم.

راه اندازی دقیق WP-PageNavi

برای شروع راه اندازی افزونه، باید «PageNavi» یا در نسخه روسی، «List of pages» را در منوی سمت چپ پنل مدیریت وردپرس از قسمت «تنظیمات» انتخاب کنید. این عمل پنجره ای را باز می کند که حاوی لیستی از تنظیمات افزونه WP-PageNavi در ناحیه قالب های لیست صفحه است.

فیلد اول که «الگوی فهرست کل صفحات» نام دارد، حاوی نمایش مشخصی از صفحه فعلی و تعداد کل صفحات است. اگر این گزینه انتخاب شده باشد، در وبلاگ وردپرس، پانل پیمایش صفحه به لیستی متوالی از صفحات تبدیل می شود که شماره صفحه فعلی برجسته شده است. شما همچنین می توانید یک کلمه به این قسمت اضافه کنید، به عنوان مثال، "صفحه" - این به هیچ وجه بر عملکرد خود تأثیر نمی گذارد. در صورت وجود چنین تمایلی می توان این زمینه را به طور کامل پاک کرد.

فیلدهای زیر نامگذاری شده اند "عنصر صفحه فعلی"، بیشتر - "عنصر صفحه". ما محتویات این فیلدها را لمس نمی کنیم، زیرا در اینجا نمایش صفحات (هم صفحه فعلی و هم سایر موارد) به صورت شماره سریال تنظیم می شود. در مورد پنل WP-PageNavi، همه چیز در اینجا کاملاً استاندارد و طبیعی به نظر می رسد. یک سیستم ناوبری صفحه مشابه اکنون در بسیاری از وبلاگ ها یافت می شود.

فیلدهای متنی برای صفحات اول و آخر برای تعیین متن نمایش داده شده بر روی دکمه ها برای انتقال به صفحه اول و آخر در نظر گرفته شده است. راه حل کلاسیک این است که به جای متن برای فیلد صفحه اول یکی بنویسید و «متن برای آخرین صفحه» را با خط %TOTAL_PAGES% پر کنید - به لطف این، تعداد کل صفحات وبلاگ شما در آخرین صفحه نمایش داده می شود. خط

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

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

اکنون زمان آن است که به تنظیمات بیشتر افزونه WP-PageNavi بروید و به تنظیمات لیست صفحه بروید. اولین چیزی که در پنجره ملاقات می کنیم "تنظیمات لیست صفحه"- این مورد "استفاده از pagenavi-css.css" است که به شما امکان می دهد با علامت زدن کادر، فایل را با شیوه نامه های آبشاری که با افزونه مورد بحث امروز ارائه می شود غیرفعال یا متصل کنید.

فیلد بعدی به نام "سبک فهرست صفحات"، از ما دعوت می کند تا یک لیست کشویی از سبک های CSS را باز کنیم، که اساساً از ما دعوت می کند از بین دو سبک ارائه شده، یک سبک را انتخاب کنیم. سبک معمولی دکمه‌های پیمایش صفحه است که قبلاً ذکر کردیم، در حالی که سبکی به نام «لیست کشویی» پیمایش را به شکل یک لیست کشویی لاکونیک با شماره صفحه نمایش می‌دهد.

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

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

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

در نهایت یک فیلد فراخوان شد "نمایش تعداد صفحات بزرگتر در چند عدد"این فرصت را فراهم می کند تا مرحله ای را تنظیم کنید که با آن تعداد صفحات دور وبلاگ شما نمایش داده شود. به عنوان مثال، در اولین مورد از این فیلدهای شرح داده شده، ما یک سه، و برای دوم - یک دو قرار می دهیم. این امر منجر به این واقعیت می شود که در پانل WP-PageNavi، با شماره صفحه فعلی شماره 1 و تعداد صفحات نمایش داده شده با شماره 5، پس از صفحات نمایش داده شده به ترتیب از اول تا پنجم، صفحات با شماره 6، 8، 10 قابل مشاهده خواهد بود - یعنی سه صفحه از وبلاگ شما با یک مرحله (فاصله) برابر با دو. با این حال، لازم نیست از این تابع استفاده کنید، فقط برای تعداد اعداد دور نمایش داده شده، 0 را در فیلد قرار دهید.

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

کار با ظاهر نوار ناوبری صفحه

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

با این حال، می توانید ویژگی های اضافی را مستقیماً به فایل CSS موضوع فعلی وردپرس خود اضافه کنید ( wp-content/themes/current theme/style.css) و نه به فایل افزونه مربوطه که در: .

راه دیگر برای تغییر ظاهر نوار پیمایش صفحه ما که در صفحات وبلاگ در هنگام استفاده از افزونه WP-PageNavi قرار داده شده است، تغییر فایل استایل خود افزونه است. این فایل در پوشه قرار دارد /wp-content/plugins/wp-pagenavi/pagenavi-css.css.

(3)

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

این امر در مورد پیمایش صفحه (صفحه بندی) صفحات نیز صدق می کند که در ابتدا در وردپرس وجود ندارد. اما با انتخاب یکی از 10 بهترین افزونه برای سایت خود به راحتی می توان این مشکل را برطرف کرد.

1.WP-PageNavi

یکی از محبوب ترین و پرکاربردترین افزونه ها. با استفاده از تابع داخلی wp_pagenavi()پیوندهای معمول ← بازگشت | بعدی → به صفحه بندی جذاب تغییر می کند.

2. صفحه بندی هوشمند WP


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

3. صفحه بندی ساده

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

4. صفحه بندی الفبایی


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

5. صفحه بندی jPages برای وردپرس


این یکی از بهترین افزونه ها برای ایجاد صفحه بندی برای صفحات گالری، نظرات و غیره است. با کمک آن، گالری ها به یک گالری با صفحه بندی تبدیل می شوند.

6. صفحه بندی کنید


این افزونه به شما این امکان را می دهد تا مطابق با نیاز خود صفحه بندی صفحه ایجاد کنید. می توانید شماره گذاری را در یک صفحه افزایش دهید، تعداد واحدهای نمایش را انتخاب کنید. به طور پیش فرض می تواند 10 باشد.

7. پست بعدی Fly Box برای وردپرس


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

8. پلاگین صفحه‌نمایش JQuery


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

9. صفحه بندی هوشمند


یک افزونه عالی که 11 گزینه صفحه بندی مختلف را ارائه می دهد.

پاداش. سبک های CSS برای افزونه WP-PageNavi


مجموعه ای عالی از سبک های CSS برای افزونه های محبوب وردپرس - WP-PageNavi و WP-Paginate. شامل صفحات HTML با نمایش سبک است و هر سبک حاوی یک فایل CSS جداگانه است.

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

با استفاده از پیمایش صفحه، کاربر می تواند بدون نیاز به پیمایش از صفحه ای به صفحه دیگر، مستقیماً به صفحه 6 یا 8 برود. این پیمایش برای موتورهای جستجوگر نیز مفید است. با استفاده از افزونه های رایگان وردپرس ارائه شده در این مقاله، می توانید پیمایش صفحه را در وب سایت خود نصب کنید.

1 – WP Page Navi

WP Page Naviیک افزونه محبوب است که به بازدیدکنندگان وب سایت شما اجازه می دهد تا به راحتی از صفحه ای به صفحه دیگر حرکت کنند. گزینه Posts/New Posts جدید را با یک پیمایش صفحه بندی شده جایگزین می کند. این افزونه به منابع زیادی نیاز ندارد و بر سرعت بارگذاری صفحه تأثیر نمی گذارد.

این افزونه با اکثر تم های موجود سازگار است.

  • به منابع کمی نیاز دارد.
  • سئو دوستانه
  • بسیار محبوب.
2 – صفحه بندی WP

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

با استفاده از آن، حتی می توانید ناوبری را از طریق نظرات به پست ها اضافه کنید، این کار بارگذاری صفحه را آسان تر می کند.

نکات و ویژگی های کلیدی:

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

6 شیوه نامه برای مطابقت با سایت شما و پشتیبانی از دو زبان وجود دارد.

نکات و ویژگی های کلیدی:

  • از پیمایش ساده صفحه استفاده می کند.
  • از پیمایش نظرات استفاده می کند.
  • برگه های سبک برای انواع مختلف نمایش وجود دارد.
  • 6 نوع سبک وجود دارد.
4 – Page Links Plus

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

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

نکات و ویژگی های کلیدی:

  • به شما امکان شماره گذاری پست ها و صفحات را می دهد.
  • گزینه ای برای مشاهده کل ضبط وجود دارد.
  • تنظیمات زیادی وجود دارد.
  • نسخه حرفه ای موجود است.
5 – صفحه بندی الفبایی

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

می توان آن را در هر نقطه از سایت شما با استفاده از یک کد کوتاه استفاده کرد.

نکات و ویژگی های کلیدی:

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

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

پشتیبانی CDN به شما کمک می کند تا گالری تصاویر خود را سئو دوستانه کنید. همچنین حافظه پنهان برای افزایش سرعت بارگذاری صفحه و همچنین Ajax برای ایجاد تغییرات بدون نیاز به بارگذاری مجدد صفحه وجود دارد.

نکات و ویژگی های کلیدی:

  • ناوبری از طریق گالری تصاویر وجود دارد.
  • پشتیبانی CDN در دسترس است.
  • سئو دوستانه
  • ذخیره سازی در دسترس است.
7 – صفحه بندی پست پیشرفته
پلاگین صفحه بندی پست پیشرفتهدر ورودی های شما پیمایش خواهد کرد. اگر پست شما خیلی بزرگ است، می توانید از این افزونه برای تقسیم آن به چندین صفحه استفاده کنید. برای اینکه با دکمه های دیجیتال معمولی سردرگم نشوید، با استفاده از این افزونه می توانید متن و عکس را روی دکمه ها قرار دهید. می توانید از کد کوتاه برای صفحه بندی پست خود به هر شکلی که دوست دارید استفاده کنید.

Ajax به شما کمک می کند تا بدون نیاز به بارگذاری مجدد کل صفحه به یک بخش بروید.

نکات و ویژگی های کلیدی:

  • تقسیم یک رکورد
  • استفاده از متن و تصویر روی دکمه ها
  • استفاده از کدهای کوتاه
  • با استفاده از Ajax
8 – صفحه بندی هوشمند WP
صفحه بندی هوشمند WPروشی مناسب برای نمایش پست های جدا شده توسط صفحات، همراه با فیلدی که در آن می توانید شماره صفحه را وارد کنید، به شما امکان می دهد فورا به صفحه مورد نیاز خود برسید. اگر پست های زیادی در سایت خود داشته باشید، این بسیار مفید است و رفتن به صفحه ای را برای کاربران دشوار می کند که بسیار دور است. اگر 4000 صفحه پست دارید و کاربر می خواهد صفحه 2555 را ببیند، این افزونه می تواند خدمات ارزشمندی را به شما ارائه دهد.

نکات و ویژگی های کلیدی:

  • از پیمایش ساده صفحه استفاده می کند.
  • یک فیلد برای پیمایش مستقیم به صفحه مورد نظر وجود دارد.
  • تم های مطابق
  • یک تغییر در سبک ها وجود دارد.
9 – صفحه بندی jPages برای وردپرس
این یک پلاگین جی کوئری الهام گرفته شده از jPages است که صفحه بندی گالری تصاویر و نظرات شما را آسان می کند. این یک پلاگین کاملا واکنش گرا است که ناوبری محتوا را برای انواع دستگاه ها با اندازه های مختلف صفحه نمایش فراهم می کند. jPages Pagination For WordPress یک افزونه کوچک است که به شما امکان می دهد به راحتی ناوبری را با jQuery ادغام کنید.

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

نکات و ویژگی های کلیدی:

  • jQuery استفاده می شود.
  • پلاگین واکنش گرا.
  • توسط مرورگرهای اصلی پشتیبانی می شود.
  • ادغام آسان.
نتیجه گیری
این مقاله لیستی از بهترین افزونه های رایگان صفحه بندی وردپرس را ارائه می دهد که می تواند به شما در صفحه بندی سایت خود به بهترین شکل ممکن کمک کند. همه افزونه ها دارای ویژگی های متفاوتی هستند، پس یکی را انتخاب کنید که مناسب سایت شما باشد.

4 761

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

منوی ناوبری وردپرس

چرا به منو نیاز دارید؟ این به شما امکان می دهد ساختار سایت خود را به کاربران ارائه دهید - به آنها کمک می کند بخش ها را مرور کنند و به سرعت اطلاعات مورد نیاز خود را پیدا کنند.

منو را می توان در بالا/پایین و راست/چپ صفحه سایت قرار داد.

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

ایجاد منوی وردپرس

می توانید یک منو از پنل مدیریت وردپرس - ظاهر - منوها اضافه کنید.

یک پنجره جدید "ایجاد منو" روی صفحه ظاهر می شود که از دو ناحیه تشکیل شده است. ناحیه سمت چپ شامل صفحات، پیوندهای سفارشی و دسته‌های شما می‌شود. و در سمت راست آیتم های منو قابل تنظیم هستند.

بیایید اولین منوی شما را ایجاد کنیم.

یک نام برای منوی خود ارائه دهید، به عنوان مثال. "My First Menu" و سپس روی دکمه "Create Menu" کلیک کنید.

تنظیمات منو در مقابل شما ظاهر می شود:

همانطور که می بینید، تم وب سایت وردپرس Azbuka 3 گزینه چیدمان منو ارائه می دهد: اصلی، ثانویه، پاورقی.

نام ها و مکان های منو به موضوع انتخاب شده بستگی دارد و ممکن است متفاوت باشد.

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

سپس مکان منوی خود را انتخاب کرده و ذخیره کنید.

می‌توانید طرح‌بندی‌های مختلف را امتحان کنید تا ببینید چگونه به نظر می‌رسد تکمیل شده است.

قرار دادن آیتم های منو

متوجه خواهید شد که هر آیتم منوی اضافه شده به ترتیبی است که آن را اضافه کرده اید. به عنوان مثال، صفحه درباره من در انتها و صفحه محصولات در ابتدا ظاهر می شود.

نگران نباشید، می توانید آیتم های منو را با ماوس بکشید و رها کنید و آنها را به ترتیبی که می خواهید مرتب کنید.

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

ایجاد یک منوی کشویی پیمایش وردپرس

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

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

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

حالا بیایید یک آیتم زیر منو برای منوی جدید خود اضافه کنیم.

در ساختار، عنصر را درست زیر عنصر اصلی آن بکشید، سپس عنصر را کمی به سمت راست بکشید. متوجه خواهید شد که به طور خودکار به یک آیتم زیر منو تبدیل می شود.

به این ترتیب می توانید چندین سطح از زیر منوها ایجاد کنید. اما، متأسفانه، همه تم ها از ایجاد چنین منوهای چند سطحی پشتیبانی نمی کنند - اکثر آنها به شما اجازه می دهند فقط 2 سطح ایجاد کنید.

اضافه کردن دسته ها به منو

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

متوجه خواهید شد که دسته ها به عنوان گزینه های منو ظاهر می شوند. همانند صفحات، می‌توانید دسته‌ها را با ماوس بکشید و رها کنید تا آنها را به ترتیبی که می‌خواهید مرتب کنید.

در مثال زیر، مطمئن شدم که همه دسته‌ها به عناصر فرزند صفحه وبلاگ تبدیل می‌شوند.

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

ویرایش یک آیتم منو

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

این بدان معنا نیست که شما نمی توانید آن را تغییر دهید.

عنصر را گسترش دهید و آن را در صورت نیاز ویرایش کنید.

در اینجا می توانید عنوان، متن پیوند را تغییر دهید و یک ویژگی عنوان به پیوند اضافه کنید. منو را ذخیره کنید تا همه تغییرات خود را از دست ندهید.

حذف از منو

همچنین آیتم منو را گسترش دهید و در پایین متن قرمز "حذف" را مشاهده خواهید کرد.

مناطق منوی ناوبری

هر تم انواع خاص خود را از طرح بندی منوی ناوبری ارائه می دهد.

در تم این سایت که در نمونه ها نشان دادم 3 نوع چیدمان منو وجود دارد. ممکن است تعداد آنها در موضوع شما کم و بیش باشد. و البته آنها را می توان متفاوت نامید.

افزودن منوی پیمایش در نوار کناری

علاوه بر مناطق استاندارد، می توانید یک منو به نوار کناری و سایر مناطق با ویجت اضافه کنید.

در پنل مدیریت، "Appearance" - "Widgets" را انتخاب کنید و ویجت "Custom Menu" را به نوار کناری اضافه کنید.

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

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

وقتی صحبت از دکمه های اجتماعی در منوها می شود، برخی از تم ها دکمه های داخلی رسانه های اجتماعی را ارائه می دهند.

اگر طرح زمینه شما آنها را ندارد، می توانید افزونه ای مانند Menu Social Icons را نصب کنید تا خودتان دکمه ها را اضافه کنید.

شما ممکن است علاقه مند باشید:

اگر سوالی دارید در نظرات بنویسید.

و ما را دنبال کنید

روز بخیر، دوستان عزیز! امروز با شما در مورد نحوه ساخت چنین چیزی زیبا و راحت در وردپرس صحبت خواهیم کرد پیمایش صفحهبا استفاده از افزونه WP-PageNavi یا کد ساده. من شما را نمی دانم، اما من شخصاً از ناوبری داخلی در موتور وردپرس اصلاً خوشم نمی آید.

این چه نوع ناوبری است؟ خوب، اگر وبلاگ هنوز جوان بود و مقالات زیادی در مورد آن وجود نداشت، اما اگر در حال حاضر بیش از 200-300 مورد از آنها وجود داشته باشد، چه؟ در این مورد، چنین پیمایشی به راحتی می تواند بسیاری از خوانندگان شما را بترساند، زیرا هیچ کس نمی خواهد روی دکمه "پست قبلی" کلیک کند تا زمانی که نبض خود را از دست بدهد تا به مطالب مورد نظر برسد. علاوه بر این، این کتیبه به قدری نامحسوس به نظر می رسد که ممکن است به سادگی دیده نشود، که در نهایت منجر به کاهش بازدید از صفحه به ازای هر بازدید کننده و زمان صرف شده در سایت می شود، و این در حال حاضر هنگام تبلیغ هر سایتی بسیار مهم است که نمی توان آن را نادیده گرفت. . بنابراین، اگر هنوز قصد دارید پیمایش صفحه به صفحه را انجام دهید، می توانید از هر روشی که در زیر ارائه شده است استفاده کنید.

پیمایش صفحه برای وردپرس با استفاده از افزونه WP-PageNavi.

روش 1. افزونه WP-PageNavi را از اینجا دانلود کنید و آن را در وبلاگ آپلود کنید، آن را فعال کنید، به پنل مدیریت وبلاگ در "تنظیمات" "لیست صفحات" بروید. در اینجا ما باید تنها یک پارامتر را پیکربندی کنیم - "تعداد صفحات برای نمایش". من شخصاً 10 را مشخص کردم تا ناوبری من برای بازدیدکنندگان بسیار قابل مشاهده باشد. به هر حال، اگر ناگهان کل پیمایش صفحه شما در قالب قالب شما قرار نگیرد، یعنی اگر چیزی شبیه به این باشد:

سپس می توانید به سادگی این تعداد را کاهش دهید یا حتی بهتر از آن، کتیبه "صفحه" را از تنظیمات افزونه حذف کنید و آنها را با فلش ها جایگزین کنید. خوب، پس از آن، روی ذخیره کلیک کنید و ببینید که چگونه ما اکنون یک پیمایش صفحه به صفحه ساده در وبلاگ داریم. اگر این اتفاق نیفتاد، به "ویرایشگر" "ظاهر" بروید، فایل قالب اصلی (index.php) را باز کنید و به دنبال چیزی شبیه به این باشید: یا چیزی شبیه به آن و تغییر آن به: ، ضبط را ذخیره کنید.

اگر می‌خواهید این پیمایش نه تنها در صفحه اصلی، بلکه در بخش‌های جداگانه و در حین جستجوها نیز باشد، با فایل‌های archive.php و search.php همان عملیات را انجام می‌دهیم. خوب، می‌خواهم به شما هشدار دهم که این افزونه برای همه کار نمی‌کند، بنابراین اگر چیزی برای شما کار نکرد، می‌توانید افزونه مشابه WP-Page Numbers را نصب کنید. اگر آن را نصب کنید، باید کد خاصی را نیز وارد کنید در همین فایل ها

سبک های طراحی زیبا برای پیمایش صفحه افزونه های WP-PageNavi و WP-Page Numbers.

احتمالاً قبلاً متوجه شده اید که پیمایش صفحه من بسیار بهتر و جذاب تر از شما به نظر می رسد. این به این دلیل است که من یک افزونه اضافی به سبک WP-Page Numbers دارم , که برای WP-PageNavi و WP-Page Numbers کار می کند. اگر به طور ناگهانی مثل من یک کدنویس هستید، به اصطلاح، حرفه ای نیستید، به اصطلاح خودتان طرح هایی را در فایل های افزونه تجویز کنید، می توانید به سادگی این افزونه را برای خود نصب کنید. پس از نصب آن، یک تب جدید PageNavi Style در پنل مدیریت شما ظاهر می شود. در آن می توانید هر سبک طراحی پیمایش صفحه را که دوست دارید انتخاب کنید.

در مجموع، این افزونه دارای 20 نوع سبک با تمام رنگ های موجود است. همچنین، اگر به طور ناگهانی چیزی از لیست را دوست نداشتید، در تب Select StyleSheet می توانید تنظیمات را از "Existing Styles" به "Custom" تغییر دهید، یک ویرایشگر در مقابل شما ظاهر می شود که می توانید تنظیمات را مشخص کنید. ، رنگ ها و غیره شما نیاز دارید. اگر چنین است، ترجمه آنها این است:

رنگ عنوان - رنگ سرصفحه.

رنگ پس زمینه - رنگ پس زمینه.

رنگ پس زمینه فعال / فعلی- رنگ دکمه زمانی که نشانگر ماوس را روی آن قرار می دهید.

اندازه قلم - اندازه فونت.

پیوند ماوس ماوس / رنگ فعال- رنگ پیوند زمانی که نشانگر ماوس را روی آن قرار می دهید.

رنگ مرز پیوند - رنگ حاشیه دکمه با شماره صفحه.

پیوند مرزی ماوس / رنگ فعال- رنگ حاشیه هنگام نگه داشتن نشانگر ماوس.

تراز کردن پیمایش - تراز در صفحه: مرکز، چپ یا راست.

چگونه بدون افزونه WP-PageNavi پیمایش صفحه را انجام دهیم؟

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

روش 2.به "ویرایشگر" "ظاهر" بروید و فایل تابع تم (functions.php) و در آخر قبل از تگ را باز کنید؟>

تابع wp_corenavi() (

$pages = "";
$max = $wp_query->max_num_pages;


$a["total"] = حداکثر $;
$a["current"] = $current;
$total = 1; //1 - نمایش متن "صفحه N از N"، 0 - نمایش داده نمی شود
$a["mid_size"] = 3; //چند لینک به سمت چپ و راست لینک فعلی نشان داده شود
$a["end_size"] = 1; //چند لینک در ابتدا و در پایان نمایش داده شود
$a["prev_text"] = """; //متن پیوند "صفحه قبلی"
$a["next_text"] = """; //متن پیوند "صفحه بعدی"
if ($max > 1) echo "

";
if ($total == 1 && $max > 1) $pages = ""."\r\n";

if ($max > 1) echo "
";
}

به هر حال، کد دارای توضیحاتی به زبان روسی است، بنابراین در صورت نیاز می توانید کمی با اعداد بازی کنید. اکنون، مانند افزونه WP-PageNavi، به فایل‌های: functions.php، index.php و archive.php بروید و خط را در آنجا پیدا کنید. و بعد از آن یا چند خط دیگر کد را اضافه کنید

روش 3. این روش مشابه روش دوم است، اما کد هنوز کمی متفاوت است. در فایل تابع تم (functions.php) در انتهای قبل از تگ ?>، این کد را وارد کرده و ورودی را ذخیره کنید.

تابع navigation() (
جهانی $wp_query، $wp_rewrite;
$pages = "";
$max = $wp_query->max_num_pages;
if (!$current = get_query_var("paged")) $current = 1;
$a["base"] = str_replace (999999999، "%#%"، get_pagenum_link (999999999));
$a["total"] = حداکثر $;
$a["current"] = $current;
$total = 0; //1 - نمایش متن "صفحه N از N"، 0 - نمایش داده نمی شود
$a["mid_size"] = 2; //چند لینک به سمت چپ و راست لینک فعلی نشان داده شود
$a["end_size"] = 5; //چند لینک در ابتدا و در پایان نمایش داده شود
$a["prev_text"] = ""قبلی"; //متن پیوند "صفحه قبلی"
$a["next_text"] = "بعدی"; //متن پیوند "صفحه بعدی"
if ($max > 1) echo "

";
اگر ($total = 1 && $max > 1) $pages = " صفحه " . $current . " از " . $max .""."\r\n";
echo $pages . پیوندهای_صفحه ($a)؛
if ($max > 1) echo "
";
}

. حالا به فایل شیوه نامه (style.css) بروید و این کد سبک را در جایی وارد کنید، جایی که کدهای فایل با نقطه شروع می شوند و ورودی را ذخیره کنید.

.navigator (حاشیه:10px 7px;
پس زمینه:#fff;
حاشیه: 1px جامد #aaa;
padding: 15px;
overflow:hidden;
اندازه فونت: 13px;
رنگ:#000;)

.navigator a(پس زمینه: #fff;
حاشیه: 1px جامد #DDDDDD;
رنگ: #000000;
اندازه فونت: 13px;
بالشتک: 10 پیکسل؛
تزیین متن: هیچ ؛)


پس زمینه:#f1f8f9;
حاشیه: 1px جامد #C6D2D4؛)

.navigator a:hover(پس زمینه: #fff;
حاشیه: 1px جامد #111;
رنگ: #0000cc;
اندازه فونت: 13px;
بالشتک: 10 پیکسل؛
تزیین متن: هیچ ؛)

.navigator span.pages (padding: 3px 5px;
پس زمینه:#f1f8f9;
حاشیه: 1px جامد #C6D2D4؛)

.navigator span.current (پس زمینه: #fff;
حاشیه: 1px جامد #111;
رنگ: #0000cc;
اندازه فونت: 15px;
بالشتک: 10 پیکسل؛
تزیین متن: هیچ ؛)

.navigator span.extend (padding: 3px 5px;
پس زمینه:#f1f8f9;
حاشیه: 1px جامد #C6D2D4؛)

.str(پس زمینه: #fff;
حاشیه: 1px جامد #DDDDDD;
رنگ: #000000;
اندازه فونت: 13px;
بالشتک: 10 پیکسل؛
تزیین متن: هیچ ؛)

روش 4. در فایل تابع تم (functions.php) در انتهای قبل از تگ ?>، این کد را وارد کرده و ورودی را ذخیره کنید.

تابع my_pagenavi ($pages = ""، $range = 2)
{
$showitems = ($range * 2)+1;

جهانی $paged;
if (خالی ($paged)) $paged = 1;

اگر ($pages == "")
{
جهانی $wp_query;
$pages = $wp_query->max_num_pages;
اگر (!$pages)
{
$pages = 1;
}
}

if (1 != $pages)
{
پژواک"

»;
}
}

در فایل های: functions.php، index.php و archive.php خط را در آنجا پیدا می کنیم و بعد از آن یا چند خط دیگر کد را اضافه کنید . حالا به فایل style sheet (style.css) رفته و مانند مثال قبلی، این کد را وارد کرده و ورودی را ذخیره کنید.

صفحه بندی .(
روشن: هر دو
اندازه فونت: 12px;
margin-top: 10px;
text-align: center;
}

دامنه صفحه‌بندی، صفحه‌بندی a (
text-decoration: هیچ;
حاشیه: 1px جامد #BFBFBF;
padding: 3px 5px;
حاشیه: 2px;
}

صفحه بندی a:hover(
حاشیه-رنگ: #000;
}
صفحه‌بندی .current(
فونت-وزن: پررنگ;
}

روش 5. این فایل را دانلود کنید، کد را از آن بگیرید و در انتهای آن قبل از تگ ?> در (functions.php) قرار دهید و ورودی را ذخیره کنید. اگر موردی بود، پیشاپیش بابت مشکل پیش آمده عذرخواهی می کنم، زیرا کد برای انتشار خیلی بزرگ بود. اکنون در فایل های: functions.php، index.php و archive.php خط را در آنجا پیدا می کنیم. و بعد از آن یا چند خط دیگر کد را اضافه کنید

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

به اشتراک بگذارید