آموزش ساخت Testimonial در وردپرس،قسمت اول

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

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

دوستان عزیز در اولین قدم باید همانطور که در آموزش های قبلی نیز گفتیم post type را بسازید که در مورد ساخت آن پیشتر سخن گفته ام و شما میتوانید برای آگاهی بیشتر آن را مطالعه نمائید.پس سریعا فایل function.php قالب وردپرس خود را گشوده و کد زیر را در آن قرار دهید:

add_action( 'init', 'testimonials_post_type' );
function testimonials_post_type() {
    $labels = array(
        'name' => 'دیدگاه های مشتریان',
        'singular_name' => 'Testimonial',
        'add_new' => 'افزودن جدید',
        'add_new_item' => 'افزودن دیدگاه جدید',
        'edit_item' => 'ویرایش دیدگاه',
        'new_item' => 'دیدگاه جدید',
        'search_items' => 'جستجو دیدگاه',
        'not_found' =>  'دیدگاهی پیدا نشد',
        'not_found_in_trash' => 'دیدگاهی در زباله دان پیدا نشد',
        'parent_item_colon' => '',
    );
 
    register_post_type( 'testimonials', array(
        'labels' => $labels,
        'public' => true,
        'publicly_queryable' => true,
        'show_ui' => true,
        'exclude_from_search' => true,
        'query_var' => true,
        'rewrite' => true,
        'capability_type' => 'post',
        'has_archive' => true,
        'hierarchical' => false,
        'menu_position' => 10,
        'supports' => array( 'editor' ),
        'register_meta_box_cb' => 'testimonials_meta_boxes', // فراخوانی تابع متاباکس
    ) );
}

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

که برای اینکار باید از تابع add_meta_box() در قالب وردپرس خود استفاده کنیم که این کد به صورت زیر است و شما باید آن را به همین صورت در ادامه کد قبلی اضافه نمائید:

function testimonials_meta_boxes() {
    add_meta_box( 'testimonials_form', 'جزئیات مشتری', 'testimonials_form', 'testimonials', 'normal', 'high' );
}
 
function testimonials_form() {
    $post_id = get_the_ID();
    $testimonial_data = get_post_meta( $post_id, '_testimonial', true );
    $client_name = ( empty( $testimonial_data['client_name'] ) ) ? '' : $testimonial_data['client_name'];
    $source = ( empty( $testimonial_data['source'] ) ) ? '' : $testimonial_data['source'];
    $link = ( empty( $testimonial_data['link'] ) ) ? '' : $testimonial_data['link'];
	$image = ( empty( $testimonial_data['image'] ) ) ? '' : $testimonial_data['image'];
 
    wp_nonce_field( 'testimonials', 'testimonials' );
    ?>


        <label>نام مشتری</label>
        <input type="text" value="<?php echo $client_name; ?>" name="testimonial[client_name]" size="40" />
    



        <label>بیزینس / آدرس سایت</label>
        <input type="text" value="<?php echo $source; ?>" name="testimonial[source]" size="40" />
    



        <label>لینک</label>
        <input type="text" value="<?php echo $link; ?>" name="testimonial[link]" size="40" />
    



        <label>تصویر</label>
        <input type="text" value="<?php echo $image; ?>" name="testimonial[image]" size="40" />
    

    <?php
}

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

add_action( 'save_post', 'testimonials_save_post' );
function testimonials_save_post( $post_id ) {
    if ( defined( 'DOING_AUTOSAVE' ) && DOING_AUTOSAVE )
        return;
 
    if ( ! empty( $_POST['testimonials'] ) && ! wp_verify_nonce( $_POST['testimonials'], 'testimonials' ) )
        return;
 
    if ( ! empty( $_POST['post_type'] ) && 'page' == $_POST['post_type'] ) {
        if ( ! current_user_can( 'edit_page', $post_id ) )
            return;
    } else {
        if ( ! current_user_can( 'edit_post', $post_id ) )
            return;
    }
 
    if ( ! wp_is_post_revision( $post_id ) && 'testimonials' == get_post_type( $post_id ) ) {
        remove_action( 'save_post', 'testimonials_save_post' );
 
        wp_update_post( array(
            'ID' => $post_id,
            'post_title' => 'Testimonial - ' . $post_id
        ) );
 
        add_action( 'save_post', 'testimonials_save_post' );
    }
 
    if ( ! empty( $_POST['testimonial'] ) ) {
        $testimonial_data['client_name'] = ( empty( $_POST['testimonial']['client_name'] ) ) ? '' : sanitize_text_field( $_POST['testimonial']['client_name'] );
        $testimonial_data['source'] = ( empty( $_POST['testimonial']['source'] ) ) ? '' : sanitize_text_field( $_POST['testimonial']['source'] );
        $testimonial_data['link'] = ( empty( $_POST['testimonial']['link'] ) ) ? '' : esc_url( $_POST['testimonial']['link'] );
		$testimonial_data['image'] = ( empty( $_POST['testimonial']['image'] ) ) ? '' : esc_url( $_POST['testimonial']['image'] );
 
        update_post_meta( $post_id, '_testimonial', $testimonial_data );
    } else {
        delete_post_meta( $post_id, '_testimonial' );
    }
}

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

add_filter( 'manage_edit-testimonials_columns', 'testimonials_edit_columns' );
function testimonials_edit_columns( $columns ) {
    $columns = array(
        'cb' => '<input type="checkbox" />',
        'title' => 'عنوان',
        'testimonial' => 'دیدگاه مشتری',
        'testimonial-client-name' => 'نام مشتری',
        'testimonial-source' => 'بیزینس / سایت',
        'testimonial-link' => 'لینک',
        'author' => 'نویسنده',
        'date' => 'تاریخ'
    );
 
    return $columns;
}
 
add_action( 'manage_posts_custom_column', 'testimonials_columns', 10, 2 );
function testimonials_columns( $column, $post_id ) {
    $testimonial_data = get_post_meta( $post_id, '_testimonial', true );
    switch ( $column ) {
        case 'testimonial':
            the_excerpt();
            break;
        case 'testimonial-client-name':
            if ( ! empty( $testimonial_data['client_name'] ) )
                echo $testimonial_data['client_name'];
            break;
        case 'testimonial-source':
            if ( ! empty( $testimonial_data['source'] ) )
                echo $testimonial_data['source'];
            break;
        case 'testimonial-link':
            if ( ! empty( $testimonial_data['link'] ) )
                echo $testimonial_data['link'];
            break;
 
	case 'testimonial-image':
            if ( ! empty( $testimonial_data['image'] ) )
                echo $testimonial_data['image'];
            break;
    }
}

دوستان عزیز قسمت بعدی نمایش Testimonials است.برای اینکه بتوانید دیدگاه های وب سایت را در هر کجای آن نمایش دهید باید از کد زیر استفاده کنید.

function get_testimonial( $posts_per_page = 1, $orderby = 'none', $testimonial_id = null ) {
    $args = array(
        'posts_per_page' => (int) $posts_per_page,
        'post_type' => 'testimonials',
        'orderby' => $orderby,
        'no_found_rows' => true,
    );
    if ( $testimonial_id )
        $args['post__in'] = array( $testimonial_id );
 
    $query = new WP_Query( $args  );
 
    $testimonials = '';
    if ( $query->have_posts() ) {
        while ( $query->have_posts() ) : $query->the_post();
            $post_id = get_the_ID();
            $testimonial_data = get_post_meta( $post_id, '_testimonial', true );
            $client_name = ( empty( $testimonial_data['client_name'] ) ) ? '' : $testimonial_data['client_name'];
            $source = ( empty( $testimonial_data['source'] ) ) ? '' : ' - ' . $testimonial_data['source'];
            $link = ( empty( $testimonial_data['link'] ) ) ? '' : $testimonial_data['link'];
			$image = ( empty( $testimonial_data['image'] ) ) ? '' : $testimonial_data['image'];
            $cite = ( $link ) ? '<a href="' . esc_url( $link ) . '" target="_blank">' . $client_name . $source . '</a>' : $client_name . $source;
 
            $testimonials .= '
<aside class="testimonial">';
            $testimonials .= '
<div class="entry-content">';
            $testimonials .= '

' . get_the_content() . '<span></span>

';
            $testimonials .= '

<cite>' . $cite . '</cite><img src='.$image.' width="50" height="50"/>';
            $testimonials .= '</div>

';
            $testimonials .= '</aside>

';
 
        endwhile;
        wp_reset_postdata();
    }
 
    return $testimonials;
}

استایل دهی

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

p.testimonial-text {
background: #f5f5f5;
padding: 12px;
text-align: justify;
border-radius: 15px;
}
 
p.testimonial-text:after {
	background: url(image/btmarrow.png) no-repeat;
width: 63px;
display: block;
position: absolute;
content: " ";
color: #f5f5f5;
height: 40px;
}
 
.testimonial-client-name img {
display: inline-block;
border-radius: 50px;
margin-bottom: -20px;
margin-right: 10px;
}

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

ممنونم از همراهی شما دوستان عزیز
موفق و پیروز باشید

منبع: بیگ تم مرجع آموزش وردپرس