diff --git a/themes/commerce/components/Footer.js b/themes/commerce/components/Footer.js
index 3411773c..aff2cec4 100644
--- a/themes/commerce/components/Footer.js
+++ b/themes/commerce/components/Footer.js
@@ -4,6 +4,8 @@ import CopyRightDate from '@/components/CopyRightDate'
 import { siteConfig } from '@/lib/config'
 import Link from 'next/link'
 import CONFIG from '../config'
+import { decryptEmail, handleEmailClick } from '@/lib/plugins/mailEncrypt'
+import { useRef } from 'react'
 
 /**
  * 页脚
@@ -18,6 +20,10 @@ const Footer = props => {
     parseInt(since) < currentYear ? since + '-' + currentYear : currentYear
   const { categoryOptions, customMenu } = props
 
+  const CONTACT_EMAIL = siteConfig('CONTACT_EMAIL')
+
+  const emailIcon = useRef(null)
+
   return (
     <footer
       id='footer-wrapper'
@@ -128,14 +134,16 @@ const Footer = props => {
                   </div>
                   <div className='text-lg'>
                     {' '}
-                    {siteConfig('CONTACT_EMAIL') && (
+                    {CONTACT_EMAIL && (
                       <a
-                        target='_blank'
-                        rel='noreferrer'
-                        title={'email'}
-                        href={`mailto:${siteConfig('CONTACT_EMAIL')}`}>
+                        onClick={e =>
+                          handleEmailClick(e, emailIcon, CONTACT_EMAIL)
+                        }
+                        title='email'
+                        className='cursor-pointer'
+                        ref={emailIcon}>
                         <i className='transform hover:scale-125 duration-150 fas fa-envelope dark:hover:text-red-400 hover:text-red-600' />{' '}
-                        {siteConfig('CONTACT_EMAIL')}
+                        {decryptEmail(CONTACT_EMAIL)}
                       </a>
                     )}
                   </div>