Buddypress定制头像上传页面

时间:2012-05-16 07:36:45

标签: forms upload buddypress avatar

我希望这个论坛上的某个人可以帮我处理我正在尝试为Buddypress创建的自定义头像上传页面。提前为长电子邮件道歉,但我想尽可能清楚,所以我希望得到一个明确而具体的答案:)

该页面是用户在注册网站后完成的三步“入门”过程的一部分(1.填写个人资料字段2.上传头像3.邀请朋友)。

我不是代码方面的专家,但我通过分别复制和编辑profile / edit.php和invite-anyone / by-email / by-email.php文件中的代码来排序第1步和第3步,然后执行重定向提交到下一步。

要使第1步工作,我还必须编辑bp-xprofile-template.php文件以包含if is_page ... else ...以便页面使用loggedin_user而不是displayed_user。

使用第2步,我的页面显示正确,但在为头像选择图像并点击上传后,页面刷新并且不会进入裁剪,这就是如果你上传了一个头像的话个人资料中的更改头像页面。

如果我将表单操作更改为重定向到登录用户配置文件中的更改头像页面(默认情况下没有操作),则会显示裁剪,但我不希望用户离开“脚步”。

我想也许我需要更改bp-core-template.php中avatar_admin函数集中的某些内容,以便它可以在其他页面上运行,但这不是我的能力。我真的希望有人可以帮助解决这个问题,因为这是完成这个过程的最后一个障碍。

以下是change-avatar.php的代码,这是我已经复制并尝试在自定义页面上工作的内容。我的页面在“if('crop-image'== bp_get_avatar_admin_step()”处停止正常工作。提前感谢。

    <h4><?php _e( 'Change Avatar', 'buddypress' ) ?></h4>

<?php do_action( 'bp_before_profile_avatar_upload_content' ) ?>

<?php if ( !(int)bp_get_option( 'bp-disable-avatar-uploads' ) ) : ?>

    <p><?php _e( 'Your avatar will be used on your profile and throughout the site. If there is a <a href="http://gravatar.com">Gravatar</a> associated with your account email we will use that, or you can upload an image from your computer.', 'buddypress') ?></p>

    <form action="" method="post" id="avatar-upload-form" class="standard-form" enctype="multipart/form-data">

        <?php if ( 'upload-image' == bp_get_avatar_admin_step() ) : ?>

            <?php wp_nonce_field( 'bp_avatar_upload' ) ?>
            <p><?php _e( 'Click below to select a JPG, GIF or PNG format photo from your computer and then click \'Upload Image\' to proceed.', 'buddypress' ) ?></p>

            <p id="avatar-upload">
                <input type="file" name="file" id="file" />
                <input type="submit" name="upload" id="upload" value="<?php _e( 'Upload Image', 'buddypress' ) ?>" />
                <input type="hidden" name="action" id="action" value="bp_avatar_upload" />
            </p>

            <?php if ( bp_get_user_has_avatar() ) : ?>
                <p><?php _e( "If you'd like to delete your current avatar but not upload a new one, please use the delete avatar button.", 'buddypress' ) ?></p>
                <p><a class="button edit" href="<?php bp_avatar_delete_link() ?>" title="<?php _e( 'Delete Avatar', 'buddypress' ) ?>"><?php _e( 'Delete My Avatar', 'buddypress' ) ?></a></p>
            <?php endif; ?>

        <?php endif; ?>

        <?php if ( 'crop-image' == bp_get_avatar_admin_step() ) : ?>

            <h5><?php _e( 'Crop Your New Avatar', 'buddypress' ) ?></h5>

            <img src="<?php bp_avatar_to_crop() ?>" id="avatar-to-crop" class="avatar" alt="<?php _e( 'Avatar to crop', 'buddypress' ) ?>" />

            <div id="avatar-crop-pane">
                <img src="<?php bp_avatar_to_crop() ?>" id="avatar-crop-preview" class="avatar" alt="<?php _e( 'Avatar preview', 'buddypress' ) ?>" />
            </div>

            <input type="submit" name="avatar-crop-submit" id="avatar-crop-submit" value="<?php _e( 'Crop Image', 'buddypress' ) ?>" />

            <input type="hidden" name="image_src" id="image_src" value="<?php bp_avatar_to_crop_src() ?>" />
            <input type="hidden" id="x" name="x" />
            <input type="hidden" id="y" name="y" />
            <input type="hidden" id="w" name="w" />
            <input type="hidden" id="h" name="h" />

            <?php wp_nonce_field( 'bp_avatar_cropstore' ) ?>

        <?php endif; ?>

    </form>

<?php else : ?>

    <p><?php _e( 'Your avatar will be used on your profile and throughout the site. To change your avatar, please create an account with <a href="http://gravatar.com">Gravatar</a> using the same email address as you used to register with this site.', 'buddypress' ) ?></p>

<?php endif; ?>

<?php do_action( 'bp_after_profile_avatar_upload_content' ) ?>

3 个答案:

答案 0 :(得分:0)

  

我的页面在“if('crop-image'== bp_get_avatar_admin_step()”

停止正常工作

那么bp_get_avatar_admin_step()=那个点是什么? 回声看看。

头像实际上传了吗? 如果是这样,你必须弄清楚如何推进admin_step。

  

我想也许我需要更改bp-core-template.php中avatar_admin函数集中的某些内容,但这不是我的能力之外

而不是改变,弄清楚它们是如何被调用的。

答案 1 :(得分:0)

我刚刚完成了我自己的自定义头像页面,并遇到了同样的问题。我想我实际上已经失去了头发。哈哈。我最终调整了我的代码,以确保仍然可以通过获取相关代码的几个块并将其构建为我的主题中的新功能来升级bp。

问题是隐藏的提交值'w'是众多reserved wordpress terms中的一个。

<input type="hidden" name="image_src" id="image_src" value="<?php bp_avatar_to_crop_src(); ?>" />
<input type="hidden" id="x" name="x" />
<input type="hidden" id="y" name="y" />
<input type="hidden" id="w" name="w" />
<input type="hidden" id="h" name="h" />

您需要将此值更改为其他任何值,然后实现您自己的处理函数版本:

  

的BuddyPress / BP-xprofile / BP-xprofile-screens.php-&GT; xprofile_screen_change_avatar();

另外,也许有更好的方法,但是为了裁剪工作,我必须对

内的内容实施单独的调用
bp_core_add_jquery_cropper(){
 wp_enqueue_style( 'jcrop' );
 wp_enqueue_script( 'jcrop', array( 'jquery' ) );
 add_action( 'wp_head', 'bp_core_add_cropper_inline_js' );
 add_action( 'wp_head', 'bp_core_add_cropper_inline_css' );
}

 wp_enqueue_style( 'jcrop' );
 wp_enqueue_script( 'jcrop', array( 'jquery' ) );
 add_action( 'wp_footer', 'bp_core_add_cropper_inline_js' );
 add_action( 'wp_footer', 'bp_core_add_cropper_inline_css' );

在我自己的profile_screen_change_avatar()实现中。

希望这对您或其他人来说仍然有用。让我知道这一切是否有意义(好或不好)。)

答案 2 :(得分:0)

感谢您提出的有用建议。只是补充一点,@ Zenvied的建议非常有效。唯一的事情是我必须添加自己的“bp_core_add_cropper_inline_js()”和“bp_core_add_cropper_inline_css()”的实现,然后在我的“xprofile_screen_change_avatar()”实现中调用它们。所以不要这样:

 wp_enqueue_style( 'jcrop' );
 wp_enqueue_script( 'jcrop', array( 'jquery' ) );
 add_action( 'wp_footer', 'bp_core_add_cropper_inline_js' );
 add_action( 'wp_footer', 'bp_core_add_cropper_inline_css' );

我这样做了:

self::bp_custom_core_add_cropper_inline_css();
self::bp_custom_core_add_cropper_inline_js();
wp_enqueue_style( 'jcrop' );
wp_enqueue_script( 'jcrop', array( 'jquery' ) );

希望这有助于某人! : - )