new-post7

آموزش ساخت post type اسلایدر در وردپرس

آموزش ساخت post type اسلایدر در وردپرس

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

دوستان عزیز برای ساخت post type اسلایدر در وب سایت های وردپرسی ، فایل فانکشن موجود در پوسته وب سایت وردپرسی خود را در حالت ویرایش باز کنید. سپس کد زیر را قبل از ?> داخل آن قرار دهید:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
add_theme_support( 'post-thumbnails' );
function slider_register() {
    $args = array(
        'label' => __('اسلایدر'),  /////////////// نام post type
        'singular_label' => __('اسلایدر'),
        'public' => true,   ///////////// حالت عمومی post type
        'show_ui' => true,  /////////////// نمایش Post type
        'capability_type' => 'post'//////////// نوع post type
        'hierarchical' => false,
        'rewrite' => true,
        'supports' => array('title', 'editor', 'thumbnail')   ////////////// امکاناتی که  post type خواهد داشت
       );
    register_post_type( 'slider' , $args );   ///////////// ساخت post type
}
add_action('init', 'slider_register');

حال به توضیح کد فوق میپردازیم.
به تابع add_theme_support( ‘post-thumbnails’ ); که در کد فوق وجود دارد توجه کنید که با استفاده از این کد تعیین می کنید که این post type در وب سایت وردپرسی شما اسلایدر از تصویر شاخص پشتیبانی می کند و مطالب آن دارای تصویر شاخص هستند و در کنار آن تابع slider_register وجود دارد نام تابعی است که که توسط آن post type ساخته می شود. این تابع دارای یک آرایه است که داخل آن آرگومان های post type تعریف می شود.

خب دوستان عزیز کد زیر را هم به ادامه کد فوق اضافه نمائید:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
add_filter("manage_edit-slider_columns", "slider_edit_columns");
function slider_edit_columns($columns){
        $columns = array(
            "cb" => "<input type=\"checkbox\" />",
            "title" => "slider",
            "image" => "image",
        ); 
        return $columns;
}
function slider_thumbnail_url($pid){
    $image_id = get_post_thumbnail_id($pid);
    $image_url = wp_get_attachment_image_src($image_id,'screen-shot');
    return  $image_url[0];
}
add_action("manage_posts_custom_column""slider_custom_columns");
function slider_custom_columns($column){
        global $post;
         $image_id = get_post_thumbnail_id($pid);
    $image_url = wp_get_attachment_image_src($image_id,'screen-shot');
        switch ($column)
        
            case "image":
                $custom = get_post_custom();
                echo '<img src="'.$image_url[0].'" width="50" height="50" />';
                break;
        }
}

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

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

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
function slider_shortcode($atts,$content = null) {
global $post;
  $posts = new WP_Query($atts);
  query_posts('post_type=slider');  // نام post type که ساخته این را قرار میدیم
  ob_start();?>
<div id="carousel-main-slider" class="carousel slide" data-ride="carousel">
<div class="carousel-inner">
<?php  $slider=0; if (have_posts()) : while (have_posts()) : the_post(); ?>
<div class="item <?php if ($slider==0) { echo "active";} else { echo "";} ?>">
           <?php the_post_thumbnail('full');  //////// تصویر شاخص ?> 
<div class="carousel-caption">
<h3><?php the_title();   /////// عنوان اسلایدر ?></h3>
    <?php the_content();   ///////// محتوای اسلایدر?>
</div>
</div>
<?php $slider++;  endwhile; endif; ?>
  </div>
  <a class="left carousel-control" href="#carousel-main-slider" role="button" data-slide="prev">
    <span class="glyphicon glyphicon-chevron-left"></span>
  </a>
  <a class="right carousel-control" href="#carousel-main-slider" role="button" data-slide="next">
    <span class="glyphicon glyphicon-chevron-right"></span>
  </a>
</div>
<?php
  wp_reset_query();
   return ob_get_clean()
 ; }
add_shortcode('big_slider', 'slider_shortcode');  ////

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

1
[big_slider]