diff --git a/client/coral-framework/actions/auth.js b/client/coral-framework/actions/auth.js
index ee6f6a817..f99450901 100644
--- a/client/coral-framework/actions/auth.js
+++ b/client/coral-framework/actions/auth.js
@@ -3,22 +3,32 @@ import translations from './../translations';
 const lang = new I18n(translations);
 import * as actions from '../constants/auth';
 import coralApi, {base} from '../helpers/response';
-import {addItem} from './items';
+import {addItem, updateItem} from './items';
 
 // Dialog Actions
 export const showSignInDialog = (offset = 0) => ({type: actions.SHOW_SIGNIN_DIALOG, offset});
 export const hideSignInDialog = () => ({type: actions.HIDE_SIGNIN_DIALOG});
 
+export const createDisplayNameRequest = () => ({type: actions.CREATE_DISPLAYNAME_REQUEST});
 export const showCreateDisplayNameDialog = () => ({type: actions.SHOW_CREATEDISPLAYNAME_DIALOG});
 export const hideCreateDisplayNameDialog = () => ({type: actions.HIDE_CREATEDISPLAYNAME_DIALOG});
-export const createDisplayName = (formData) => (dispatch) => {
-  coralApi('/users', {method: 'POST', body: formData})
+
+export const updateDisplayName = displayName => ({type: actions.UPDATE_DISPLAYNAME, displayName});
+
+export const createDisplayName = (userId, formData) => dispatch => {
+  dispatch(createDisplayNameRequest());
+  coralApi(`/users/${userId}/displayname`, {method: 'POST', body: formData})
     .then(() => {
       dispatch(createDisplayNameSuccess());
       dispatch(hideCreateDisplayNameDialog());
+      dispatch(updateItem(userId, 'displayName', formData.displayName, 'users'));
+      dispatch(updateDisplayName(formData.displayName));
     })
-    .catch(() => dispatch(createDisplayNameFailure(lang.t('createdisplay.errorCreate'))));
+    .catch(() => {
+      dispatch(createDisplayNameFailure(lang.t('createdisplay.errorCreate')));
+    });
 };
+
 const createDisplayNameSuccess = () => ({type: actions.CREATEDISPLAYNAME_SUCCESS});
 const createDisplayNameFailure = error => ({type: actions.CREATEDISPLAYNAME_FAILURE, error});
 
diff --git a/client/coral-framework/actions/items.js b/client/coral-framework/actions/items.js
index e289e9f60..692ec5648 100644
--- a/client/coral-framework/actions/items.js
+++ b/client/coral-framework/actions/items.js
@@ -203,7 +203,6 @@ export function postItem (item, type, id, mutate) {
       parent_id: null
     }
   }).then(({data}) => {
-    console.log('it workt');
     console.log(data);
   });
 
diff --git a/client/coral-framework/components/CreateDisplayNameDialog.js b/client/coral-framework/components/CreateDisplayNameDialog.js
index 8b61989aa..02c6eae4d 100644
--- a/client/coral-framework/components/CreateDisplayNameDialog.js
+++ b/client/coral-framework/components/CreateDisplayNameDialog.js
@@ -1,11 +1,13 @@
 import React from 'react';
+import FormField from './FormField';
+import Button from 'coral-ui/components/Button';
 import {Dialog} from 'coral-ui';
 import styles from './styles.css';
 import I18n from 'coral-framework/modules/i18n/i18n';
 import translations from '../translations';
 const lang = new I18n(translations);
 
-const CreateDisplayNameDialog = ({open, handleClose, offset, loggedIn}) => (
+const CreateDisplayNameDialog = ({open, handleClose, offset, formData, handleSubmitDisplayName, handleChange}) => (
   <Dialog
     className={styles.dialog}
     id="createDisplayNameDialog"
@@ -20,25 +22,22 @@ const CreateDisplayNameDialog = ({open, handleClose, offset, loggedIn}) => (
         <h1>
           {lang.t('createdisplay.writeyourusername')}
         </h1>
-        Logged {loggedIn}
+      </div>
+      <div>
+        <p>{lang.t('createdisplay.yourusername')}</p>
+        <form id="saveDisplayName" onSubmit={handleSubmitDisplayName}>
+          <FormField
+            id="displayName"
+            type="string"
+            label={lang.t('createdisplay.displayName')}
+            value={formData.displayName}
+            onChange={handleChange}
+          />
+        <Button id="save" type="submit" className={styles.saveButton}>{lang.t('createdisplay.save')}</Button>
+        </form>
       </div>
     </div>
   </Dialog>
 );
 
-// <form onSubmit={props.handleSignIn}>
-//   <FormField
-//     id="displayName"
-//     type="string"
-//     label={lang.t('createdisplay.displayName')}
-//     value="yeah"
-//     onChange={props.handleSubmitForm}
-//   />
-//   <div className={styles.action}>
-//     <Button id='save' type="submit" cStyle="black" className={styles.saveButton} full>
-//       {lang.t('createdisplay.save')}
-//     </Button>
-//   </div>
-// </form>
-
 export default CreateDisplayNameDialog;
diff --git a/client/coral-framework/constants/auth.js b/client/coral-framework/constants/auth.js
index 27fa8890f..a61975420 100644
--- a/client/coral-framework/constants/auth.js
+++ b/client/coral-framework/constants/auth.js
@@ -4,6 +4,10 @@ export const CLEAN_STATE = 'CLEAN_STATE';
 export const SHOW_SIGNIN_DIALOG = 'SHOW_SIGNIN_DIALOG';
 export const HIDE_SIGNIN_DIALOG = 'HIDE_SIGNIN_DIALOG';
 
+export const CREATE_DISPLAYNAME_REQUEST = 'CREATE_DISPLAYNAME_REQUEST';
+export const CREATEDISPLAYNAME_SUCCESS = 'CREATEDISPLAYNAME_SUCCESS';
+export const CREATEDISPLAYNAME_FAILURE = 'CREATEDISPLAYNAME_FAILURE';
+export const CREATE_DISPLAYNAME = 'CREATE_DISPLAYNAME';
 export const SHOW_CREATEDISPLAYNAME_DIALOG = 'SHOW_CREATEDISPLAYNAME_DIALOG';
 export const HIDE_CREATEDISPLAYNAME_DIALOG = 'HIDE_CREATEDISPLAYNAME_DIALOG';
 
@@ -35,3 +39,5 @@ export const CHECK_LOGIN_SUCCESS = 'CHECK_LOGIN_SUCCESS';
 export const CHECK_LOGIN_FAILURE = 'CHECK_LOGIN_FAILURE';
 
 export const CHECK_CSRF_TOKEN = 'CHECK_CSRF_TOKEN';
+
+export const UPDATE_DISPLAYNAME = 'UPDATE_DISPLAYNAME';
diff --git a/client/coral-framework/constants/user.js b/client/coral-framework/constants/user.js
index 9c6f508fe..57f4e706b 100644
--- a/client/coral-framework/constants/user.js
+++ b/client/coral-framework/constants/user.js
@@ -5,3 +5,4 @@ export const COMMENTS_BY_USER_REQUEST = 'COMMENTS_BY_USER_REQUEST';
 export const COMMENTS_BY_USER_SUCCESS = 'COMMENTS_BY_USER_SUCCESS';
 export const COMMENTS_BY_USER_FAILURE = 'COMMENTS_BY_USER_FAILURE';
 export const LOGOUT_SUCCESS = 'LOGOUT_SUCCESS';
+export const UPDATE_DISPLAYNAME = 'UPDATE_DISPLAYNAME';
diff --git a/client/coral-framework/containers/ChangeDisplayNameContainer.js b/client/coral-framework/containers/ChangeDisplayNameContainer.js
index 17e681388..e252119de 100644
--- a/client/coral-framework/containers/ChangeDisplayNameContainer.js
+++ b/client/coral-framework/containers/ChangeDisplayNameContainer.js
@@ -30,12 +30,13 @@ class ChangeDisplayNameContainer extends Component {
     super(props);
     this.state = this.initialState;
     this.handleChange = this.handleChange.bind(this);
-    this.handleSubmitForm = this.handleSubmitForm.bind(this);
+    this.handleSubmitDisplayName = this.handleSubmitDisplayName.bind(this);
     this.handleClose = this.handleClose.bind(this);
     this.addError = this.addError.bind(this);
   }
 
   componentDidMount() {
+    window.authCallback = this.props.facebookCallback;
     const {formData} = this.state;
     const errors = Object.keys(formData).reduce((map, prop) => {
       map[prop] = lang.t('createdisplay.requiredField');
@@ -70,7 +71,7 @@ class ChangeDisplayNameContainer extends Component {
     const {addError} = this;
 
     if (!value.length) {
-      addError(name, lang.t('displayName.requiredField'));
+      addError(name, lang.t('createdisplay.requiredField'));
     } else {
       const { [name]: prop, ...errors } = this.state.errors; // eslint-disable-line
       // Removes Error
@@ -87,16 +88,16 @@ class ChangeDisplayNameContainer extends Component {
     this.setState({showErrors: show});
   }
 
-  handleSubmitForm(e) {
+  handleSubmitDisplayName(e) {
     e.preventDefault();
     const {errors} = this.state;
     const {validForm, invalidForm} = this.props;
     this.displayErrors();
     if (this.isCompleted() && !Object.keys(errors).length) {
-      createDisplayName(this.state.formData);
+      this.props.createDisplayName(this.props.user.id, this.state.formData);
       validForm();
     } else {
-      invalidForm(lang.t('signIn.checkTheForm'));
+      invalidForm(lang.t('createdisplay.checkTheForm'));
     }
   }
 
@@ -105,15 +106,16 @@ class ChangeDisplayNameContainer extends Component {
   }
 
   render() {
-    const {loggedIn, auth, offset, user} = this.props;
+    const {loggedIn, auth, offset} = this.props;
     return (
       <div>
         <CreateDisplayNameDialog
           open={auth.showCreateDisplayNameDialog}
           offset={offset}
           handleClose={this.handleClose}
-          user={user}
           loggedIn={loggedIn}
+          handleSubmitDisplayName={this.handleSubmitDisplayName}
+          {...this}
           {...this.state}
           {...this.props}
         />
@@ -127,7 +129,7 @@ const mapStateToProps = state => ({
 });
 
 const mapDispatchToProps = dispatch => ({
-  createDisplayName: formData => dispatch(createDisplayName(formData)),
+  createDisplayName: (userid, formData) => dispatch(createDisplayName(userid, formData)),
   showCreateDisplayNameDialog: () => dispatch(showCreateDisplayNameDialog()),
   hideCreateDisplayNameDialog: () => dispatch(hideCreateDisplayNameDialog()),
   invalidForm: error => dispatch(invalidForm(error)),
diff --git a/client/coral-framework/reducers/auth.js b/client/coral-framework/reducers/auth.js
index ff0f72b4a..cb7b102df 100644
--- a/client/coral-framework/reducers/auth.js
+++ b/client/coral-framework/reducers/auth.js
@@ -43,6 +43,14 @@ export default function auth (state = initialState, action) {
     return state.merge(Map({
       showCreateDisplayNameDialog: false
     }));
+  case actions.CREATEDISPLAYNAME_SUCCESS :
+    return state.merge(Map({
+      showCreateDisplayNameDialog: false,
+      error: ''
+    }));
+  case actions.CREATEDISPLAYNAME_FAILURE :
+    return state
+      .set('error', action.error);
   case actions.CHANGE_VIEW :
     return state
       .set('error', '')
@@ -109,6 +117,9 @@ export default function auth (state = initialState, action) {
     return state
       .set('passwordRequestFailure', 'There was an error sending your password reset email. Please try again soon!')
       .set('passwordRequestSuccess', null);
+  case actions.UPDATE_DISPLAYNAME:
+    return state
+      .merge({'user': {'displayName': action.displayName}});
   default :
     return state;
   }
diff --git a/client/coral-framework/translations.json b/client/coral-framework/translations.json
index 5900aad3e..0e191d89d 100644
--- a/client/coral-framework/translations.json
+++ b/client/coral-framework/translations.json
@@ -10,7 +10,8 @@
       "displayName": "Display Name",
       "save": "Save",
       "requiredField": "Required field",
-      "errorCreate": "Error when changing display name"
+      "errorCreate": "Error when changing display name",
+      "checkTheForm": "Invalid Form. Please, check the fields"
     },
     "error": {
       "email": "Not a valid E-Mail",
@@ -37,9 +38,10 @@
     "createdisplay": {
       "writeyourusername": "Escribe tu nombre",
       "yourusername": "Tu nombre es visible publicamente en todos los comentarios que publiques. Es necesario tener un nombre de usuario antes de poder publicar tu primer comentario.",
-      "displayName": "Nombre",
+      "displayName": "Nombre a mostrar",
       "save": "Guardar",
-      "requiredField": "Campo necesario"
+      "requiredField": "Campo necesario",
+      "checkTheForm": "Formulario Invalido. Por favor, verifica los campos"
     },
     "error": {
       "email": "No es un email válido",