This will work in any Bootstrap theme with the current code.
Requirements:
- Simple Local Avatars
- Make sure the Simple Local Avatars plugin is installed and enabled,
- Edit the functions.php file in child theme and add the following code
<?php
///SIMPLE LOCAL AVATAR
function upload_avatar_shortcode_callback() {
// Make sure the user is logged in
if ( ! is_user_logged_in() ) {
return 'You must be logged in to upload an avatar.';
}
// Get current user's ID
$user_id = get_current_user_id();
// Output the form for uploading an avatar
ob_start();
?>
<form method="post" enctype="multipart/form-data">
<?php
// Display the current user's avatar
echo get_avatar( $user_id, 128, null, null, array('class' ='rounded-circle shadow p-3 mx-auto d-block'));
?>
<br>
<div class="d-grid gap-1 col-6 mx-auto">
<input type="file" id="avatar" name="avatar" accept="image/*" style="display:none;">
<label for="avatar" class="btn btn-primary btn-sm">
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-upload" viewBox="0 0 16 16">
<path d="M.5 9.9a.5.5 0 0 1 .5.5v2.5a1 1 0 0 0 1 1h12a1 1 0 0 0 1-1v-2.5a.5.5 0 0 1 1 0v2.5a2 2 0 0 1-2 2H2a2 2 0 0 1-2-2v-2.5a.5.5 0 0 1 .5-.5z"></path>
<path d="M7.646 1.146a.5.5 0 0 1 .708 0l3 3a.5.5 0 0 1-.708.708L8.5 2.707V11.5a.5.5 0 0 1-1 0V2.707L5.354 4.854a.5.5 0 1 1-.708-.708l3-3z"></path>
</svg>
</label>
<input type="submit" class="btn btn-primary btn-sm mt-2" name="update_avatar" value="<?php _e('Update Avatar') ?>">
<?php wp_nonce_field( 'update_avatar_' . $user_id ); ?>
<input type="hidden" name="action" value="update_avatar">
</div>
</form>
<?php
$output = ob_get_clean();
return $output;
}
add_shortcode( 'upload_avatar', 'upload_avatar_shortcode_callback' );
//shortcode
function handle_upload_avatar_form_submission() {
if ( isset( $_POST['update_avatar'], $_POST['action'] ) && $_POST['action'] === 'update_avatar' ) {
// Verify nonce
$user_id = get_current_user_id();
if ( ! isset( $_POST['_wpnonce'] ) || ! wp_verify_nonce( $_POST['_wpnonce'], 'update_avatar_' . $user_id ) ) {
return;
}
// If a new avatar is uploaded, update the user's avatar
if ( isset( $_FILES['avatar'] ) && ! empty( $_FILES['avatar']['name'] ) ) {
// Load the Simple Local Avatar plugin's class
if ( ! class_exists( 'Simple_Local_Avatars' ) ) {
require_once( ABSPATH . 'wp-content/plugins/simple-local-avatars/simple-local-avatars.php' );
}
// Get the ID of the image just uploaded
$attachment_id = media_handle_upload( 'avatar', 0 );
if ( ! is_wp_error( $attachment_id ) ) {
// Get the URL of the uploaded image
$avatar_url = wp_get_attachment_url( $attachment_id );
// Update the user's avatar
$sla = new Simple_Local_Avatars();
$sla->assign_new_user_avatar( $avatar_url, $user_id );
}
}
}
}
add_action( 'init', 'handle_upload_avatar_form_submission' );
The last step is to post this shortcode to where you like in your theme: [upload_avatar]
Have fun and enjoy!
PS I cant seem to get this post to show the code as 1 snippet