اینتر من

درباره سایت

آخرین مطالب

امکانات وب

صفحه بندی مطالب وردپرس با افزونه WP-PageNavi

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

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

این افزونه با ارائه تگ تمپلیت wp_pagenavi() یک صفحه بندی زیبا را برای سایت وردپرس شما به ارمغان می آورد .

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

۱- فایل فشرده افزونه را اکسترکت کنید و آن را در پوشه plugins قرار دهید .

۲- افزونه را از طریق منوی ” افزونه ها ” / ” افزونه های نصب شده ” فعال کنید .

روش استفاده از افزونه WP-PageNavi :

برای استفاده از افزونه WP-PageNavi شما نیاز دارید که در پوسته خود فراخوانی های توابع next_posts_link() و previous_posts_link() را پیدا کنید و آنها را با wp_pagenavi() جایگزین کنید .

مثال زیر را برای پوسته ۲۰۱۲ وردپرس مشاهده کنید :

در پوسته ۲۰۱۲ وردپرس فراخوانی های توابع پیش فرض صفحه بندی وردپرس به صورت زیر می باشند

<div class="nav-previous"><?php next_posts_link( __( '<span class="meta-nav">←</span> Older posts', 'twentyten' ) ); ?></div> <div class="nav-next"><?php previous_posts_link( __( 'Newer posts <span class="meta-nav">→</span>', 'twentyten' ) ); ?></div>

<div class="nav-previous"><?php next_posts_link( __( '<span class="meta-nav">←</span> Older posts', 'twentyten' ) ); ?></div>

<div class="nav-next"><?php previous_posts_link( __( 'Newer posts <span class="meta-nav">→</span>', 'twentyten' ) ); ?></div>

خطوط بالا باید با کد زیر جایگزین شوند

<?php wp_pagenavi(); ?>

و برای صفحه بندی چند بخشی کد زیر را پیدا کنید

<?php wp_link_pages( ... ); ?>

و با کد زیر جایگزین نمایید

<?php wp_pagenavi( array( 'type' => 'multipart' ) ); ?>

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

تغییر در استایل یا CSS افزونه WP-PageNavi

برای تغییر دادن استایل پیش فرض صفحه بندی افزونه WP-PageNavi کافیست فایل pagenavi-css.css را از پوشه افزونه به پوشه پوسته یا قالب جاری سایت وردپرس خود منتقل کنید و تغییرات خود را در آنجا اعمال کنید .

همچنین باید در تنظیمات افزونه تیک گزینه “Use pagenavi.css? ” را بردارید و فایل css افزونه را به صورت مستقیم به فایل style.css قالب اضافه کنید .

تغییر نام کلاس ها در افزونه WP-PageNavi

یکسری فیلتر در افزونه WP-PageNavi قرار دارد که بوسیله آنها می توانید نام کلاس های اختصاص داده شده به المان های داخل افزونه را تغییر دهید .

لیست فیلتر ها را در زیر مشاهده می کنید :

wp_pagenavi_class_pages
wp_pagenavi_class_first
wp_pagenavi_class_previouspostslink
wp_pagenavi_class_extend
wp_pagenavi_class_smaller
wp_pagenavi_class_page
wp_pagenavi_class_current
wp_pagenavi_class_larger
wp_pagenavi_class_nextpostslink
wp_pagenavi_class_last

یک مثال برای نحوه استفاده از فیلترها در افزونه WP-PageNavi

// Simple Usage - 1 callback per filter add_filter('wp_pagenavi_class_previouspostslink', 'theme_pagination_previouspostslink_class'); add_filter('wp_pagenavi_class_nextpostslink', 'theme_pagination_nextpostslink_class'); add_filter('wp_pagenavi_class_page', 'theme_pagination_page_class'); function theme_pagination_previouspostslink_class($class_name) { retu 'pagination__control-link pagination__control-link--previous'; } function theme_pagination_nextpostslink_class($class_name) { retu 'pagination__control-link pagination__control-link--next'; } function theme_pagination_page_class($class_name) { retu 'pagination__current-page'; } // More Concise Usage - 1 callback for all filters add_filter('wp_pagenavi_class_previouspostslink', 'theme_pagination_class'); add_filter('wp_pagenavi_class_nextpostslink', 'theme_pagination_class'); add_filter('wp_pagenavi_class_page', 'theme_pagination_class'); function theme_pagination_class($class_name) { switch($class_name) { case 'previouspostslink': $class_name = 'pagination__control-link pagination__control-link--previous'; break; case 'nextpostslink': $class_name = 'pagination__control-link pagination__control-link--next'; break; case 'page': $class_name = 'pagination__current' break; } retu $class_name; }

// Simple Usage - 1 callback per filter

add_filter('wp_pagenavi_class_previouspostslink', 'theme_pagination_previouspostslink_class');

add_filter('wp_pagenavi_class_nextpostslink', 'theme_pagination_nextpostslink_class');

add_filter('wp_pagenavi_class_page', 'theme_pagination_page_class');

function theme_pagination_previouspostslink_class($class_name) {

retu 'pagination__control-link pagination__control-link--previous';

}

function theme_pagination_nextpostslink_class($class_name) {

retu 'pagination__control-link pagination__control-link--next';

}

function theme_pagination_page_class($class_name) {

retu 'pagination__current-page';

}

// More Concise Usage - 1 callback for all filters

add_filter('wp_pagenavi_class_previouspostslink', 'theme_pagination_class');

add_filter('wp_pagenavi_class_nextpostslink', 'theme_pagination_class');

add_filter('wp_pagenavi_class_page', 'theme_pagination_class');

function theme_pagination_class($class_name) {

switch($class_name) {

case 'previouspostslink':

$class_name = 'pagination__control-link pagination__control-link--previous';

break;

case 'nextpostslink':

$class_name = 'pagination__control-link pagination__control-link--next';

break;

case 'page':

$class_name = 'pagination__current'

break;

}

retu $class_name;

}

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

برچسب: نویسنده: محمد رضا جوادیان تاريخ: دوشنبه 13 ارديبهشت 1395 ساعت: 9:11

درباره سایت

آخرین مطالب

امکانات وب

صفحه بندی مطالب وردپرس با افزونه WP-PageNavi

روش استفاده از افزونه WP-PageNavi :

تغییر در استایل یا CSS افزونه WP-PageNavi

تغییر نام کلاس ها در افزونه WP-PageNavi

یک مثال برای نحوه استفاده از فیلترها در افزونه WP-PageNavi

صفحه بندی

آرشیو مطالب

پيوندهای روزانه

لینک دوستان

خبرنامه