Title: Front Side Support
Last modified: August 20, 2016

---

# Front Side Support

 *  [Koff](https://wordpress.org/support/users/orenkolker/)
 * (@orenkolker)
 * [13 years, 4 months ago](https://wordpress.org/support/topic/front-side-support/)
 * Hej,
 * I just wanted to share some code that can be helpful for others to allow adding
   front side edit option with a shortcode.
 *     ```
       function editavatar_func($atts) {
            extract(shortcode_atts(array(
       	      'size' => '250'
            ), $atts));
             global $user_ID;
       	if ($user_ID) {
       	$user_info = get_userdata($user_ID);
       	$id = $user_info->ID;
       	}
       	 if(isset($_POST['user_avatar_edit_submit']))
             {
   
                    do_action('edit_user_profile_update', $id);
             }
   
               ob_start();
       	wp_nonce_field( 'simple_local_avatar_nonce', '_simple_local_avatar_nonce', false );
               $nonce = ob_get_contents();
               ob_end_clean();
   
              $output = '<form id="your-profile" action="" method="post">';
               $output .=$nonce ;
              $output .=' <div class="avatar-wrap">';
               $output .='  <div class="avatar">';
       	$output .=  get_avatar( $id ,$size);
               $output .=' </div>';
               $output .= '<input type="file" name="simple-local-avatar" id="simple-local-avatar" />';
               $output .=' </div>';
             $output .= '<input type="submit" name="user_avatar_edit_submit" value="OK"/>';
             $output .= '</form>';
           $output .='<script type="text/javascript">var form = document.getElementById(\'your-profile\');form.encoding = \'multipart/form-data\';form.setAttribute(\'enctype\', \'multipart/form-data\');</script>';
   
            return $output;
       }
       add_shortcode('editavatar', 'editavatar_func');
       ```
   
 * [http://wordpress.org/extend/plugins/simple-local-avatars/](http://wordpress.org/extend/plugins/simple-local-avatars/)

Viewing 4 replies - 1 through 4 (of 4 total)

 *  [Boba Lou Lou](https://wordpress.org/support/users/boba-lou-lou/)
 * (@boba-lou-lou)
 * [13 years, 3 months ago](https://wordpress.org/support/topic/front-side-support/#post-3441771)
 * Would we put this code in the plugin itself or the function section of our theme?
 *  [Ov3rfly](https://wordpress.org/support/users/ov3rfly/)
 * (@ov3rfly)
 * [13 years, 3 months ago](https://wordpress.org/support/topic/front-side-support/#post-3441775)
 * [@koff](https://wordpress.org/support/users/koff/): Just for info, you should
   be able to use the result of `wp_nonce_field()` directly.
 * Current code:
 *     ```
       ob_start();
       wp_nonce_field( 'simple_local_avatar_nonce', '_simple_local_avatar_nonce', false );
       $nonce = ob_get_contents();
       ob_end_clean();
       ```
   
 * Replacement, note the second ‘false’ parameter, untested:
 *     ```
       $nonce = wp_nonce_field( 'simple_local_avatar_nonce', '_simple_local_avatar_nonce', false, false );
       ```
   
 * [http://codex.wordpress.org/Function_Reference/wp_nonce_field](http://codex.wordpress.org/Function_Reference/wp_nonce_field)
 * [@boba](https://wordpress.org/support/users/boba/) Lou Lou: Would suggest `function.
   php` of theme – if you put it in plugin, it will be overwritten by plugin updates…
 *  [voji91](https://wordpress.org/support/users/voji91/)
 * (@voji91)
 * [13 years, 3 months ago](https://wordpress.org/support/topic/front-side-support/#post-3441805)
 * [Florence said](http://wordpress.org/support/topic/plugin-simple-local-avatars-using-this-plugin-in-a-front-end-page?replies=16):
 * Here’s how I did it:
 * Instal Simple Local Avatars
 * Install this plugin [http://wordpress.org/extend/plugins/php-code-for-posts/](http://wordpress.org/extend/plugins/php-code-for-posts/)
 * Add a new shortcode and enter this code:
 *     ```
       <?php get_header();
       global $user_ID;
       if ($user_ID) {
       $user_info = get_userdata($user_ID);
       $id = $user_info->ID;
       }
        ?>
   
       <?php if(isset($_POST['user_avatar_edit_submit']))
             {
                  do_action('edit_user_profile_update', $id);
             }
       ?>
   
       <form id="your-profile" action="" method="post">
           <?php
           $myAv = new simple_local_avatars();
           $myAv->edit_user_profile($user_info);
           ?>
           <input type="submit" name="user_avatar_edit_submit" value="OK"/>
       </form>
       ```
   
 * Copy and paste the shortcode onto a page and voilla! There’s your front-end avatar
   uploader!
 *  [Jupitercow](https://wordpress.org/support/users/jcow/)
 * (@jcow)
 * [13 years ago](https://wordpress.org/support/topic/front-side-support/#post-3441883)
 * You need to make sure you include `enctype="multipart/form-data"` or the form
   will not upload an image on most servers, it will only send $_POST data, not 
   $_FILES data.
 * So the form open should be:
 * > `<form id="your-profile" action="" method="post" enctype="multipart/form-data"
   > >`

Viewing 4 replies - 1 through 4 (of 4 total)

The topic ‘Front Side Support’ is closed to new replies.

 * ![](https://ps.w.org/simple-local-avatars/assets/icon.svg?rev=2783752)
 * [Simple Local Avatars](https://wordpress.org/plugins/simple-local-avatars/)
 * [Frequently Asked Questions](https://wordpress.org/plugins/simple-local-avatars/#faq)
 * [Support Threads](https://wordpress.org/support/plugin/simple-local-avatars/)
 * [Active Topics](https://wordpress.org/support/plugin/simple-local-avatars/active/)
 * [Unresolved Topics](https://wordpress.org/support/plugin/simple-local-avatars/unresolved/)
 * [Reviews](https://wordpress.org/support/plugin/simple-local-avatars/reviews/)

 * 4 replies
 * 5 participants
 * Last reply from: [Jupitercow](https://wordpress.org/support/users/jcow/)
 * Last activity: [13 years ago](https://wordpress.org/support/topic/front-side-support/#post-3441883)
 * Status: not resolved