diff --git a/frontend/src/components/side-nav-footer.js b/frontend/src/components/side-nav-footer.js
index d219332bb0..401be8dd86 100644
--- a/frontend/src/components/side-nav-footer.js
+++ b/frontend/src/components/side-nav-footer.js
@@ -1,7 +1,7 @@
 import React from 'react';
 import PropTypes from 'prop-types';
 import { Modal, ModalBody } from 'reactstrap';
-import { gettext, siteRoot } from '../utils/constants';
+import { gettext, lang, siteRoot, mediaUrl, logoPath, logoWidth, logoHeight, siteTitle, seafileVersion } from '../utils/constants';
 
 const propTypes = {
   className: PropTypes.string, 
@@ -21,6 +21,16 @@ class About extends React.Component {
     });
   }
 
+  aboutUrl = () => {
+    let url;
+    if (lang == 'zh-cn') {
+      url = 'http://seafile.com/about/';
+      return url; 
+    }
+    url = 'http://seafile.com/en/about/';
+    return url; 
+  }
+
   render() {
     return (
       <div>
@@ -29,9 +39,9 @@ class About extends React.Component {
           <ModalBody>
             <button type="button" className="close" onClick={this.toggle}><span aria-hidden="true">×</span></button>
             <div className="about-content">
-              <p><img src="/media/img/seafile-logo.png" title="Private Seafile" alt="logo" width="128" height="32" /></p>
-              <p>{gettext('Server Version: ')}6.3.3<br />© 2018 {gettext('Seafile')}</p>
-              <p><a href="http://seafile.com/about/" target="_blank">{gettext('About Us')}</a></p>
+              <p><img src={mediaUrl + logoPath} height={logoHeight} width={logoWidth} title={siteTitle} alt="logo" /></p>
+              <p>{gettext('Server Version: ')}{seafileVersion}<br />© 2019 {gettext('Seafile')}</p>
+              <p><a href={this.aboutUrl()} target="_blank">{gettext('About Us')}</a></p>
             </div>
           </ModalBody>
         </Modal>
diff --git a/frontend/src/utils/constants.js b/frontend/src/utils/constants.js
index 9c0a9da237..6b6272bbc5 100644
--- a/frontend/src/utils/constants.js
+++ b/frontend/src/utils/constants.js
@@ -12,6 +12,7 @@ export const logoHeight = window.app.config.logoHeight;
 export const isPro = window.app.config.isPro === 'True';
 export const lang = window.app.config.lang;
 export const fileServerRoot = window.app.config.fileServerRoot;
+export const seafileVersion = window.app.config.seafileVersion;
 
 //pageOptions
 export const seafileCollabServer = window.app.pageOptions.seafileCollabServer;
diff --git a/seahub/templates/base_for_react.html b/seahub/templates/base_for_react.html
index 9657466870..9ac6bfa6b3 100644
--- a/seahub/templates/base_for_react.html
+++ b/seahub/templates/base_for_react.html
@@ -34,7 +34,8 @@
             loginUrl: '{{ LOGIN_URL }}',
             isPro: '{{ is_pro }}',
             lang: '{{ LANGUAGE_CODE }}',
-            fileServerRoot: '{{ FILE_SERVER_ROOT }}'
+            fileServerRoot: '{{ FILE_SERVER_ROOT }}',
+            seafileVersion: '{{ seafile_version }}',
         },
         pageOptions: {
             seafileCollabServer: '{{seafile_collab_server}}',