تغییر عکس آواتار در وردپرس - بدون استفاده از افزونه

تغییر عکس آواتار در وردپرس – بدون استفاده از افزونه

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

آشنایی با متدهای add_filter , add_action :

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

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

add_filter( string $tag, callable $function_to_add, int $priority = 10, int $accepted_args = 1 );
add_action( string $tag, callable $function_to_add, int $priority = 10, int $accepted_args = 1 );

$tag : نام هوک مورد نظر برای مثال هوکی که المنت آواتار کاربر را برمیگرداند get_avatar نام دارد.
$function_to_add : نام فانکشن مورد نظر ما برای اجرا و اضافه شدن به لیست این هوک.
$priority : ترتیب قرار گرفت در لیست هوک را بیان میکند هر چر عدد بزرگتر باشد نشان دهنده دیرتر اجرا شدن تابع نسبت به سایر تابع های این هوک است بطور مثال در اینجا ممکن است پلاگینهای زیادی از این هوک استفاده کنند ولی ما بخواهیم اواتار مد نظر تابع خودمان را به کاربر نمایش دهیم لذا باید عدد بزگتری را وارد کنیم مثلا 999 .
$accepted_args : تعداد آرگومان های وردی فانکشن مد نظر ما.

شرح سورس و کار با عکس آواتار در وردپرس :

در اینجا ما به دو هوک برای کار با آواتار نیاز داریم get_avatar و get_avatar_url این دو هوک اولی یک اوتار مثل یک تگ img را بر میگرداند اما دومی فقط ادر آن عکس را برمیگرداند چون پلاگینها و قسمت های مختلف ممکن است از یکی از این ها جهت نمایش عکس آواتار استفاده کنند پس ما باید هر دوتای اینها را پیاده سازی کنیم.

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

get_user_meta( int $user_id, string $key = '', bool $single = false );

$user_id : ایدی کاربر مورد نظر که یک عدد صحیح است.
$key : نام متای مورد نظر ما ک در اینجا مقادیر را در یک متا کی به نام ‘zx_user_avatar‘ ذخیره میکنیم.
$single : اگر برابر true باشد تنها یک مقدار برمیگرداند و در غیر این صورت بصورت یک آرایه مقادیر را بر میگرداند.

برای ذخیره سازی یک متای خاص در این جدول با متد زیر کار میگنیم.

update_user_meta( int $user_id, string $meta_key, mixed $meta_value, mixed $prev_value = '' );

$user_id : ایدی کاربر مورد نظر که یک عدد صحیح است.
$meta_key : نام متای مورد نظر ما ک در اینجا مقادیر را در یک متا کی به نام ‘zx_user_avatar‘ ذخیره میکنیم.
$meta_value : مقدار متای مورد نظر که قرار است ادرس تصویر را ذخیره کنیم.
$prev_value : مقدار متای قبلی را چک میکند اگر برابر این چیزی که گفتیم اپدیت را انجام میدهد و بصورت پیشفرض خالی است و همیشه آپدیت را انجام میدهد در اینجا برای ما کاربردی ندارد.

در ادامه ما باید یک فرم برای ذخیره سازه این اواتار فراهم برای این منظور میبایست این فرم را به صفحه ویرایش اطلاعات کاربر در پنل مدیریت ورد پرس اضافه کنیم. ما در اینجا یک فرم ساده که شامل یک لیبل و یک تکست باکس است را اضافه میکنیم . برای این منظور دو هوک به نام های show_user_profile و edit_user_profile دسترسی داریم که با متد add_action ان ها را صدا میزنیم تا درون فرم ویرایش کاربر نوشته شود.

همجنین برای ذخیره سازی این فیلد متنی که قرار است ادرس تصویر کاربر وارد شود باید هوک های personal_options_update و edit_user_profile_update را با add_action تنظیم و تابع مورد نظر را پیاده سازی کنیم.

سورس پروژه :

این کد ها را میتوانید به فایل function.php قالب خود اضافه کنید و اگه به قسمت وبرایش شناسه کاربری خودتون یا کربرای سایتتون برید میتونید نتیجه را مشاهده کنید و عکس آواتار رو تغییر بدین.

```
<?php
```

add_filter( 'get_avatar' , 'zx_get_avatar' , 999 , 5 );

function zx_get_avatar( $avatar, $id_or_email, $size, $default, $alt ) {

```
    $user = false;
```
```
 
```

    if ( is_numeric( $id_or_email ) ) {

```
        $id = (int) $id_or_email;
```

        $user = get_user_by( 'id' , $id );

    } elseif ( is_object( $id_or_email ) && !empty( $id_or_email->user_id ) ) {

            $id = (int) $id_or_email->user_id;

            $user = get_user_by( 'id' , $id );

```
    } else {
```

        $user = get_user_by( 'email', $id_or_email );

```
    }
```
```
 
```

    if ( $user && is_object( $user ) ) {

            $src =get_user_meta($user->ID,'zx_user_avatar',true);

```
            if(!empty($src))
```

                $avatar = "<img alt='{$alt}' src='{$src}' class='gravatar avatar zx-avatar' height='{$size}' width='{$size}' />";

```
    }
```
```
 
```
```
    return $avatar;
```
```
}
```
```
 
```

add_filter( 'get_avatar_url', 'zx_get_avatar_url', 999, 3 );

function zx_get_avatar_url( $url, $id_or_email, $args ) {

```
    $user = false;
```
```
 
```

    if ( is_numeric( $id_or_email ) ) {

```
        $id = (int) $id_or_email;
```

        $user = get_user_by( 'id' , $id );

    } elseif ( is_object( $id_or_email ) && !empty( $id_or_email->user_id ) ) {

            $id = (int) $id_or_email->user_id;

            $user = get_user_by( 'id' , $id );

```
    } else {
```

        $user = get_user_by( 'email', $id_or_email );

```
    }
```
```
 
```

    if ( $user && is_object( $user ) ) {

            $src =get_user_meta($user->ID,'zx_user_avatar',true);

```
            if(!empty($src))
```
```
                $url=$src;
```
```
    }		
```
```
    return $url;
```
```
}
```
```
 
```

add_action( 'show_user_profile', 'zx_extra_profile_fields' );

add_action( 'edit_user_profile', 'zx_extra_profile_fields' );

function zx_extra_profile_fields( $user ) { ?>

```
    <table class="form-table">
```
```
    <tr>
```

        <th><label for="avatar_url"><?php _e("آواتار کاربر"); ?></label></th>

```
        <td>
```

            <input type="text" name="zx_avatar_url" id="zx_avatar_url"

                value="<?php echo esc_attr( get_the_author_meta( 'zx_user_avatar', $user->ID ) ); ?>"

                class="regular-text" placeholder="<?php _e("url تصویر را وارد کنید"); ?>"/>

```
        </td>
```
```
    </tr>
```
```
    </table>
```
```
<?php }
```
```
 
```

add_action( 'personal_options_update', 'zx_save_extra_profile_fields' );

add_action( 'edit_user_profile_update', 'zx_save_extra_profile_fields' );

```
 
```

function zx_save_extra_profile_fields( $user_id ) {

    if ( !current_user_can( 'edit_user', $user_id ) )

```
        return false;     
```
```
 
```

    update_user_meta( $user_id, 'zx_user_avatar',sanitize_text_field( $_POST['zx_avatar_url'] ) );

```
 
```
```
}
```

جهت درک بیشتر این مطلب میتونید توابع get_user_by و sanitize_text_field رو توی وردپرس بخونید.

تغییر عکس آواتار در وردپرس – بدون استفاده از افزونه - وب سایت رضا احمدی