diff --git a/object/application.go b/object/application.go
index 5571b52a..1a41b0d6 100644
--- a/object/application.go
+++ b/object/application.go
@@ -287,7 +287,7 @@ func extendApplicationWithSigninItems(application *Application) (err error) {
 			Visible:     true,
 			Label:       "\n<style>\n  .provider-img {\n      width: 30px;\n      margin: 5px;\n  }\n  .provider-big-img {\n      margin-bottom: 10px;\n  }\n</style>\n",
 			Placeholder: "",
-			Rule:        "Default",
+			Rule:        "None",
 		}
 		application.SigninItems = append(application.SigninItems, signinItem)
 	}
diff --git a/web/src/auth/LoginPage.js b/web/src/auth/LoginPage.js
index 48d5bf36..2105a6e1 100644
--- a/web/src/auth/LoginPage.js
+++ b/web/src/auth/LoginPage.js
@@ -655,11 +655,8 @@ class LoginPage extends React.Component {
       );
     } else if (signinItem.name === "Providers") {
       const showForm = Setting.isPasswordEnabled(application) || Setting.isCodeSigninEnabled(application) || Setting.isWebAuthnEnabled(application) || Setting.isLdapEnabled(application);
-      let rule ;
-      if (signinItem.rule === "Default") {
-        rule = showForm ? "Small icon" : "Big icon";
-      } else {
-        rule = signinItem.rule;
+      if (signinItem.rule === "None") {
+        signinItem.rule = showForm ? "small" : "big";
       }
 
       return (
@@ -668,7 +665,7 @@ class LoginPage extends React.Component {
           <Form.Item>
             {
               application.providers.filter(providerItem => this.isProviderVisible(providerItem)).map(providerItem => {
-                return ProviderButton.renderProviderLogo(providerItem.provider, application, null, null, rule, this.props.location);
+                return ProviderButton.renderProviderLogo(providerItem.provider, application, null, null, signinItem.rule, this.props.location);
               })
             }
             {
@@ -785,7 +782,7 @@ class LoginPage extends React.Component {
               :
           </div>
           <br />
-          {application.signinItems.map(signinItem => signinItem.name === "Providers" || signinItem.name === "Signup link" ? this.renderFormItem(application, signinItem) : null)}
+          {application.signinItems.map(signinItem => signinItem.name === "ThirdParty" || signinItem.name === "Footer" ? this.renderFormItem(application, signinItem) : null)}
         </div>
       );
     }
diff --git a/web/src/auth/ProviderButton.js b/web/src/auth/ProviderButton.js
index f3764d33..9b9c33aa 100644
--- a/web/src/auth/ProviderButton.js
+++ b/web/src/auth/ProviderButton.js
@@ -131,7 +131,7 @@ export function goToWeb3Url(application, provider, method) {
 }
 
 export function renderProviderLogo(provider, application, width, margin, size, location) {
-  if (size === "Small icon") {
+  if (size === "small") {
     if (provider.category === "OAuth") {
       if (provider.type === "WeChat" && provider.clientId2 !== "" && provider.clientSecret2 !== "" && provider.disableSsl === true && !navigator.userAgent.includes("MicroMessenger")) {
         const info = async() => {
diff --git a/web/src/auth/SignupPage.js b/web/src/auth/SignupPage.js
index 795c8dc9..ee2b233e 100644
--- a/web/src/auth/SignupPage.js
+++ b/web/src/auth/SignupPage.js
@@ -649,7 +649,7 @@ class SignupPage extends React.Component {
         </Form.Item>
         {
           application.providers.filter(providerItem => this.isProviderVisible(providerItem)).map(providerItem => {
-            return ProviderButton.renderProviderLogo(providerItem.provider, application, 30, 5, "Small icon", this.props.location);
+            return ProviderButton.renderProviderLogo(providerItem.provider, application, 30, 5, "small", this.props.location);
           })
         }
       </Form>
diff --git a/web/src/table/SigninTable.js b/web/src/table/SigninTable.js
index 88339634..4fef963e 100644
--- a/web/src/table/SigninTable.js
+++ b/web/src/table/SigninTable.js
@@ -229,11 +229,10 @@ class SigninTable extends React.Component {
         width: "155px",
         render: (text, record, index) => {
           let options = [];
-          if (record.name === "Providers") {
+          if (record.name === "ThirdParty") {
             options = [
-              {id: "Default", name: i18next.t("general:Default")},
-              {id: "Big icon", name: i18next.t("application:Big icon")},
-              {id: "Small icon", name: i18next.t("application:Small icon")},
+              {id: "big", name: i18next.t("application:Big icon")},
+              {id: "small", name: i18next.t("application:Small icon")},
             ];
           }
           if (options.length === 0) {