diff --git a/README.md b/README.md
index 2121b6b..bba6aeb 100644
--- a/README.md
+++ b/README.md
@@ -96,6 +96,12 @@
 <details open>
 <summary><b>July 2023</b></summary>
 
+**23.07.25**
+
+- 修改当缓存中发现多余图片但符合hash标准时，由删除图片改为添加到configs.json，以应对跨设备同步
+- 修复透明模式和兼容模式设置的UI不起效bug
+- 开发者模式的输出日志中，前置提示词修改
+
 **23.07.22**
 
 - 重构项目结构
diff --git a/README_en_US.md b/README_en_US.md
index f16aa10..d9e33ee 100644
--- a/README_en_US.md
+++ b/README_en_US.md
@@ -97,6 +97,12 @@ It is recommended for theme authors to follow the SourceNote theme template and
 <details open>
 <summary><b>July 2023</b></summary>
 
+**23.07.25**
+
+* Change from deleting images to adding them to configs.json when redundant images are found in the cache but meet the hash criteria, in order to handle cross-device synchronization.
+* Fix the bug where the UI settings for transparent mode and compatibility mode are not effective.
+* Modify the prefix prompt in the output logs of developer mode.
+
 **23.07.22**
 
 - Refactor project structure.
diff --git a/src/bgRender.ts b/src/bgRender.ts
index 1f35e7c..fb52053 100644
--- a/src/bgRender.ts
+++ b/src/bgRender.ts
@@ -16,6 +16,7 @@ import {
     CloseCV, MD5, OS, Numpy,
     getThemeInfo
 } from './utils';
+import { type } from 'os';
 
 let np = new Numpy();
 let cv2 = new CloseCV();
@@ -32,7 +33,7 @@ export function createBgLayer() {
 }
 
 export function useDefaultLiaoLiaoBg() {
-    debug(`[Func][applySettings] 没有缓存任何图片，使用默认的了了妹图片ULR来当作背景图`)
+    debug(`[bgRender][applySettings] 没有缓存任何图片，使用默认的了了妹图片ULR来当作背景图`)
     changeBackgroundContent(cst.demoImgURL, cst.bgMode.image)
     configs.set('bgObj', undefined);
 }
@@ -41,7 +42,7 @@ export function changeBackgroundContent(background: string, mode: cst.bgMode) {
     var bgLayer = document.getElementById('bglayer');
 
     if (mode === cst.bgMode.image) {
-        debug(`[Func][changeBackgroundContent] 替换当前背景图片为${background}`)
+        debug(`[bgRender][changeBackgroundContent] 替换当前背景图片为${background}`)
         bgLayer.style.setProperty('background-image', `url('${background}')`);
     } else if (mode == cst.bgMode.video) {
         noticeUI.showIndev();
@@ -52,11 +53,15 @@ export function changeBackgroundContent(background: string, mode: cst.bgMode) {
     }
 };
 
-export function changeOpacity(pluginInstance: BgCoverPlugin, alpha: number, tranMode: number, adaptMode: boolean) {
+export function changeOpacity(pluginInstance: BgCoverPlugin, alpha: number, transMode: number, adaptMode: boolean) {
     // opacity mode: fully transparent (adaptMode=False)
     // css mode: only background transparent (adaptMode=True)
     let opacity = 0.99 - 0.25 * alpha;
 
+    if (typeof transMode == 'string'){
+        transMode = parseInt(transMode);
+    };
+
     const [themeMode, themeName] = getThemeInfo();
 
     let operateElement: {
@@ -110,7 +115,8 @@ export function changeOpacity(pluginInstance: BgCoverPlugin, alpha: number, tran
     let themeAdaptObject: cst.themeAdaptObject;
     let themeAdaptElement: string[] = [];
 
-    if (themeName in adp.toAdaptThemes) { // 如果当前的主题在主题适配列表中
+    if (themeName in adp.toAdaptThemes && adaptMode) { 
+        // 如果当前的主题在主题适配列表中且启用兼容模式
         // 获取constance.ts的配置中，所有需要适配主题对应的element id和对应的css值
         themeAdaptObject = adp.toAdaptThemes[themeName];
         // >>> "Savor": {...}
@@ -122,7 +128,7 @@ export function changeOpacity(pluginInstance: BgCoverPlugin, alpha: number, tran
             const itemName = themeAdaptElement[i];
 
             // 如果是".xxxx"开头，说明这边要改的是css的样式
-            debug(`[Func][chageOpacity] 添加主题适配列表内容${itemName}.slice(0,1) === '.'`, itemName.slice(0,1) === '.')
+            debug(`[bgRender][chageOpacity] 添加主题适配列表内容${itemName}.slice(0,1) === '.'`, itemName.slice(0,1) === '.')
             if (itemName.slice(0,1) === '.') {
                 // 如果不含有当前的元素，则添加
                 if (!operateElement.css.operateCssStyle.includes(itemName)) {
@@ -136,7 +142,7 @@ export function changeOpacity(pluginInstance: BgCoverPlugin, alpha: number, tran
         }
     }
 
-    debug(`[Func][changeOpacity] operateElement: `, operateElement)
+    debug(`[bgRender][changeOpacity] operateElement: `, operateElement)
 
     /**
      * 用户打开图片背景
@@ -152,7 +158,10 @@ export function changeOpacity(pluginInstance: BgCoverPlugin, alpha: number, tran
         let rmElementStyle: string[];
         let restoreCssStyle: string[];
 
-        if (adaptMode) { // 开启css的透明模式
+        debug(`${transMode}, ${typeof transMode}`)
+
+        if (transMode === 1 ) { // 开启css的透明模式（部分透明）
+            debug(`[bgRender][changeOpacity] 检测到tranMode为${transMode} - 部分透明模式`)
             addOpacityElement = operateElement.css.operateOpacityElement;
             zIndexValue = operateElement.css.zIndexValue;
             addElementStyle = operateElement.css.operateElementStyle;
@@ -161,7 +170,8 @@ export function changeOpacity(pluginInstance: BgCoverPlugin, alpha: number, tran
             rmOpacityElement = operateElement.opacity.operateOpacityElement;
             rmElementStyle = operateElement.opacity.operateElementStyle;
             restoreCssStyle = operateElement.opacity.operateCssStyle;
-        } else {  // 开启 opacity 透明模式
+        } else {  // 开启 opacity 透明模式 (全局透明)
+            debug(`[bgRender][changeOpacity] 检测到tranMode为${transMode} - 全局透明模式`)
             addOpacityElement = operateElement.opacity.operateOpacityElement;
             zIndexValue = operateElement.opacity.zIndexValue;
             addElementStyle = operateElement.opacity.operateElementStyle;
@@ -195,7 +205,7 @@ export function changeOpacity(pluginInstance: BgCoverPlugin, alpha: number, tran
                 var themeAdaptColor: string;
                 var adaptColor: string;
 
-                debug(`[Func][changeOpacity] 修改元素ID为${elementid}的元素alpha值`);
+                debug(`[bgRender][changeOpacity] 修改元素ID为${elementid}的元素alpha值`);
 
                 if (themeAdaptElement.includes(elementid)) {
                     // 如果当前元素的css在主题适配列表中，直接获取适配列表中的配置
@@ -207,7 +217,7 @@ export function changeOpacity(pluginInstance: BgCoverPlugin, alpha: number, tran
                     adaptColor = cv2.changeColorOpacity(themeAdaptColor, opacity);
                 }
 
-                debug(`[Func][changeOpacity] ${elementid} originalColor: ${themeAdaptColor}, adaptColor: ${adaptColor}`);
+                debug(`[bgRender][changeOpacity] ${elementid} originalColor: ${themeAdaptColor}, adaptColor: ${adaptColor}`);
 
                 changeItem.style.setProperty('background-color', adaptColor, 'important');
                 changeItem.style.setProperty('background-blend-mode', `lighten`);
@@ -224,16 +234,16 @@ export function changeOpacity(pluginInstance: BgCoverPlugin, alpha: number, tran
         }
 
         // 遍历修改css自身的值
-        if (adaptMode) {
+        if (transMode === 1) {
             var sheets = document.styleSheets;
             if (editCssStyle.length + restoreCssStyle.length > 0) {
                 // 遍历所有的css style，找到指定的css
                 for (var i in sheets) {
-                    debug(`[Func][changeOpacity] 当前遍历到的CSS Style文件为：`, sheets[i].href)
+                    debug(`[bgRender][changeOpacity] 当前遍历到的CSS Style文件为：`, sheets[i].href)
                     try {
                         var rules = sheets[i].cssRules;
                     } catch (err) {
-                        const errorMessage = `[${pluginInstance.i18n.addTopBarIcon} Plugin] ${pluginInstance.i18n.themeCssReadDOMError}<br>ErrorFile: <code>${sheets[i].href}</code> when calling <code> document.styleSheets[${i}].cssRules;</code>`
+                        const errorMessage = `[${window.bgCoverPlugin.i18n.addTopBarIcon} Plugin] ${window.bgCoverPlugin.i18n.themeCssReadDOMError}<br>ErrorFile: <code>${sheets[i].href}</code> when calling <code> document.styleSheets[${i}].cssRules;</code>`
                         // showMessage(errorMessage, 0, 'error');
 
                         error(errorMessage, err);
@@ -268,7 +278,7 @@ export function changeOpacity(pluginInstance: BgCoverPlugin, alpha: number, tran
                             }
                             
                             rule.style.setProperty('background-color', transparentColor, 'important');
-                            debug(`[Func][changeOpacity]修改css属性表${csstext},从${cssColor}修改为透明色${transparentColor}`, rule.style);
+                            debug(`[bgRender][changeOpacity]修改css属性表${csstext},从${cssColor}修改为透明色${transparentColor}`, rule.style);
                         }
 
                         // 需要恢复的css属性
@@ -281,7 +291,7 @@ export function changeOpacity(pluginInstance: BgCoverPlugin, alpha: number, tran
                                 rule.style.removeProperty('background-color')
                             }
                             
-                            debug(`[Func][changeOpacity]恢复css属性表${csstext}为主题默认色${pluginInstance.cssThemeStyle[csstext]}`, rule.style);
+                            debug(`[bgRender][changeOpacity]恢复css属性表${csstext}为主题默认色${pluginInstance.cssThemeStyle[csstext]}`, rule.style);
                         }
                     }
                 }
@@ -298,7 +308,7 @@ export function changeOpacity(pluginInstance: BgCoverPlugin, alpha: number, tran
             operateElement.opacity.operateOpacityElement,
             operateElement.css.operateOpacityElement,
         )
-        debug(`[Func][changeOpacity] 移除下列元素的opacity和z-index值:`, removeOpacityElement)
+        debug(`[bgRender][changeOpacity] 移除下列元素的opacity和z-index值:`, removeOpacityElement)
         for (let eid in removeOpacityElement) {
             const elementid: string = removeOpacityElement[eid]
             var changeItem = document.getElementById(elementid)
@@ -310,7 +320,7 @@ export function changeOpacity(pluginInstance: BgCoverPlugin, alpha: number, tran
             operateElement.opacity.operateElementStyle,
             operateElement.css.operateElementStyle,
         );
-        debug(`[Func][changeOpacity] 移除下列元素的background-color和blend-mode值:`, removeCssElement);
+        debug(`[bgRender][changeOpacity] 移除下列元素的background-color和blend-mode值:`, removeCssElement);
         for (let eid in removeCssElement) {
             const elementid: string = removeCssElement[eid];
             var changeItem = document.getElementById(elementid);
@@ -328,11 +338,11 @@ export function changeOpacity(pluginInstance: BgCoverPlugin, alpha: number, tran
         if (removeCssStyle.length > 0 && adaptMode) {
             // 遍历所有的css style，找到指定的css
             for (var i in sheets) {
-                debug(`[Func][changeOpacity] 当前遍历到的CSS Style文件为：`, sheets[i])
+                debug(`[bgRender][changeOpacity] 当前遍历到的CSS Style文件为：`, sheets[i])
                 try {
                     var rules = sheets[i].cssRules;
                 } catch (err) {
-                    const errorMessage = `[${pluginInstance.i18n.addTopBarIcon} Plugin] ${pluginInstance.i18n.themeCssReadDOMError}<br>ErrorFile: <code>${sheets[i].href}</code> when calling <code> document.styleSheets[${i}].cssRules;</code>`
+                    const errorMessage = `[${window.bgCoverPlugin.i18n.addTopBarIcon} Plugin] ${window.bgCoverPlugin.i18n.themeCssReadDOMError}<br>ErrorFile: <code>${sheets[i].href}</code> when calling <code> document.styleSheets[${i}].cssRules;</code>`
                     // showMessage(errorMessage, 0, 'error');
 
                     error(errorMessage, err);
@@ -375,10 +385,10 @@ export function changeBgPosition(x: string, y: string) {
     var bgLayer = document.getElementById('bglayer');
 
     if (x == null || x == undefined) {
-        debug(`[Func][changeBgPosition] xy未定义，不进行改变`)
+        debug(`[bgRender][changeBgPosition] xy未定义，不进行改变`)
         bgLayer.style.setProperty('background-position', `center`);
     } else {
-        debug(`[Func][changeBgPosition] 修改background-position为${x}% ${y}%`)
+        debug(`[bgRender][changeBgPosition] 修改background-position为${x}% ${y}%`)
         bgLayer.style.setProperty('background-position', `${x}% ${y}%`);
     }
 }
@@ -395,26 +405,26 @@ export async function applySettings(pluginInstance: BgCoverPlugin) {
 
     // 缓存文件夹中没有图片 | 用户刚刚使用这个插件 | 用户刚刚重置了插件数据 | 当前文件404找不到
     const cacheImgNum = fileManagerUI.getCacheImgNum()
-    debug(`[Func][applySettings] cacheImgNum= ${cacheImgNum}`)
+    debug(`[bgRender][applySettings] cacheImgNum= ${cacheImgNum}`)
     if (cacheImgNum === 0) {
         // 没有缓存任何图片，使用默认的了了妹图片ULR来当作背景图
         useDefaultLiaoLiaoBg();
     } else if (configs.get('bgObj') === undefined) {
         // 缓存中有1张以上的图片，但是设置的bjObj却是undefined，随机抽一张
-        debug(`[Func][applySettings] 缓存中有1张以上的图片，但是设置的bjObj却是undefined，随机抽一张`)
+        debug(`[bgRender][applySettings] 缓存中有1张以上的图片，但是设置的bjObj却是undefined，随机抽一张`)
         await topbarUI.selectPictureRandom(pluginInstance);
     } else {
         // 缓存中有1张以上的图片，bjObj也有内容且图片存在
-        debug(`[Func][applySettings] 缓存中有1张以上的图片，bjObj也有内容且图片存在`)
+        debug(`[bgRender][applySettings] 缓存中有1张以上的图片，bjObj也有内容且图片存在`)
         let bgObj = configs.get('bgObj')
         let fileidx = configs.get('fileidx')
         // 没有开启启动自动更换图片，则直接显示该图片
         if (bgObj.hash in fileidx && !configs.get('autoRefresh')) {
-            debug(`[Func][applySettings] 没有开启启动自动更换图片，则直接显示当前图片`)
+            debug(`[bgRender][applySettings] 没有开启启动自动更换图片，则直接显示当前图片`)
             changeBackgroundContent(bgObj.path, bgObj.mode)
         } else {
             // 当bjObj找不到404 | 用户选择随机图片，则随机调一张作为bjObj
-            debug(`[Func][applySettings] 用户选择随机图片，则随机调一张作为bjObj`)
+            debug(`[bgRender][applySettings] 用户选择随机图片，则随机调一张作为bjObj`)
             await topbarUI.selectPictureRandom(pluginInstance);
         }
     }
diff --git a/src/bugreportUI.ts b/src/bugreportUI.ts
index a42ca01..5d934b4 100644
--- a/src/bugreportUI.ts
+++ b/src/bugreportUI.ts
@@ -3,12 +3,12 @@ import BgCoverPlugin from "./index"
 
 export function bugReportDialog(pluginInstance: BgCoverPlugin) {
     const dialog = new Dialog({
-        title: `${pluginInstance.i18n.bugReportLabel}`,
+        title: `${window.bgCoverPlugin.i18n.bugReportLabel}`,
         content: `
-        <div class="b3-dialog__content">${pluginInstance.i18n.bugReportConfirmText}</div>
+        <div class="b3-dialog__content">${window.bgCoverPlugin.i18n.bugReportConfirmText}</div>
         <div class="b3-dialog__action">
-            <button class="b3-button b3-button--cancel">${pluginInstance.i18n.cancel}</button><div class="fn__space"></div>
-            <button class="b3-button b3-button--text">${pluginInstance.i18n.confirm}</button>
+            <button class="b3-button b3-button--cancel">${window.bgCoverPlugin.i18n.cancel}</button><div class="fn__space"></div>
+            <button class="b3-button b3-button--text">${window.bgCoverPlugin.i18n.confirm}</button>
         </div>
         <div class="b3-dialog__action">
         `,
diff --git a/src/constants.ts b/src/constants.ts
index 9ca913f..5d1f551 100644
--- a/src/constants.ts
+++ b/src/constants.ts
@@ -1,5 +1,9 @@
 import packageInfo from '../plugin.json'
 
+declare global {
+    interface Window { bgCoverPlugin : any; }
+}
+
 export enum bgMode {
     image = 0,
     video = 1,
diff --git a/src/fileManagerUI.ts b/src/fileManagerUI.ts
index b9f8e09..746561b 100644
--- a/src/fileManagerUI.ts
+++ b/src/fileManagerUI.ts
@@ -43,7 +43,7 @@ export async function checkCacheDirctory(pluginInstance: BgCoverPlugin) {
 
         let imgFiles = await os.listdir(oldpluginAssetsDir);
         if (imgFiles !== null && imgFiles.length > 0) {
-            showMessage(pluginInstance.i18n.cacheDirectoryMove, 7000, "info");
+            showMessage(window.bgCoverPlugin.i18n.cacheDirectoryMove, 7000, "info");
             await os.rmtree(oldpluginAssetsDir);
         }
     }
@@ -68,7 +68,7 @@ export async function checkCacheDirctory(pluginInstance: BgCoverPlugin) {
             continue
         } else {
             // 背景图片
-            debug(`[Func][checkCacheDirectory] Check ${item.name} in cached dir`)
+            debug(`[fileManagerUI][checkCacheDirectory] Check ${item.name} in cached dir`)
             if (item.name.slice(0, 5) === 'hash-') {
                 const [hash_name, suffix] = os.splitext(item.name.split('-')[1])
 
@@ -103,8 +103,25 @@ export async function checkCacheDirctory(pluginInstance: BgCoverPlugin) {
                     }
                 } else {
                     // 在缓存文件夹中，但图片并不在fileidx中（图片多余了）
+                    // 更新版本：把多余的图片添加到缓存中而不是删除
                     extraCacheImgs.push(item.name)
-                    ka.removeFile(`${cst.pluginImgDataDir}/${item.name}`)
+                    //ka.removeFile(`${cst.pluginImgDataDir}/${item.name}`)
+                    // slice(5) to remove '/data' prefix
+                    const imgPath = `${cst.pluginImgDataDir.slice(5)}/${item.name}`
+                    const imageSize = await cv2.getImageSize(imgPath)
+
+                    let bgObj: cst.bgObj = {
+                        name: item.name,
+                        path: imgPath,
+                        hash: item.name.slice(0, 5),
+                        mode: cst.bgMode.image,
+                        offx: 50,
+                        offy: 50,
+                        height: imageSize.height,
+                        width: imageSize.width
+                    }
+
+                    fileidx[hash_name] = bgObj
                 }
             } else {
                 // 非法缓存图片
@@ -126,19 +143,19 @@ export async function checkCacheDirctory(pluginInstance: BgCoverPlugin) {
 
     // raise warning to users
     if (notCorrectCacheImgs.length !== 0) {
-        let msgInfo = `${pluginInstance.i18n.cacheImgWrongName}<br>[${notCorrectCacheImgs}]<br>${pluginInstance.i18n.doNotOperateCacheFolder}`
+        let msgInfo = `${window.bgCoverPlugin.i18n.cacheImgWrongName}<br>[${notCorrectCacheImgs}]<br>${window.bgCoverPlugin.i18n.doNotOperateCacheFolder}`
         showMessage(msgInfo, 7000, "info")
         info(msgInfo)
     }
 
     if (extraCacheImgs.length !== 0) {
-        let msgInfo = `${pluginInstance.i18n.cacheImgExtra}<br>[${extraCacheImgs}]<br>${pluginInstance.i18n.doNotOperateCacheFolder}`
+        let msgInfo = `${window.bgCoverPlugin.i18n.cacheImgExtra}<br>[${extraCacheImgs}]<br>${window.bgCoverPlugin.i18n.doNotOperateCacheFolder}`
         showMessage(msgInfo, 7000, "info")
         info(msgInfo)
     }
 
     if (missingCacheImgs.length !== 0) {
-        let msgInfo = `${pluginInstance.i18n.cacheImgMissing}<br>[${missingCacheImgs}]<br>${pluginInstance.i18n.doNotOperateCacheFolder}`
+        let msgInfo = `${window.bgCoverPlugin.i18n.cacheImgMissing}<br>[${missingCacheImgs}]<br>${window.bgCoverPlugin.i18n.doNotOperateCacheFolder}`
         showMessage(msgInfo, 7000, "info")
         info(msgInfo)
     }
@@ -204,12 +221,12 @@ export function imgExistsInCache(
     if (fileidx !== undefined && md5 in fileidx) {
         if (notice) {
             const dialog = new Dialog({
-                title: `${pluginInstance.i18n.inDevTitle}`,
-                content: `<div class="b3-dialog__content">${pluginInstance.i18n.imageFileExist}</div>`,
+                title: `${window.bgCoverPlugin.i18n.inDevTitle}`,
+                content: `<div class="b3-dialog__content">${window.bgCoverPlugin.i18n.imageFileExist}</div>`,
                 width: pluginInstance.isMobile ? "92vw" : "520px",
             });
         }else{
-            debug(`[Func][imgIsInCache] 当前图片${file.name}已存在`)
+            debug(`[fileManagerUI][imgIsInCache] 当前图片${file.name}已存在`)
         }
         return 'exists'
     } else {
@@ -220,7 +237,7 @@ export function imgExistsInCache(
 export async function uploadOneImage(pluginInstance: BgCoverPlugin, file: File) {
     let fileSizeMB: number = (file.size / 1024 / 1024);
 
-    showMessage(`${file.name}-${fileSizeMB.toFixed(2)}MB<br>${pluginInstance.i18n.addSingleImageUploadNotice}`, 3000, "info");
+    showMessage(`${file.name}-${fileSizeMB.toFixed(2)}MB<br>${window.bgCoverPlugin.i18n.addSingleImageUploadNotice}`, 3000, "info");
 
     let md5 = imgExistsInCache(pluginInstance, file);
 
@@ -258,7 +275,7 @@ export async function uploadOneImage(pluginInstance: BgCoverPlugin, file: File)
             configs.set('bgObj', bgObj);
             configs.set('fileidx', fileidx);
 
-            debug(`[func][addSingleLocalImageFile]: fileidx ${fileidx}`);
+            debug(`[fileManagerUI][addSingleLocalImageFile]: fileidx ${fileidx}`);
 
             return bgObj
         } else {
@@ -276,23 +293,23 @@ export async function batchUploadImages(
 {
     let bgObj:cst.bgObj;
 
-    debug('[Func][batchUploadImages] fileArray', fileArray)
+    debug('[fileManagerUI][batchUploadImages] fileArray', fileArray)
 
     if (fileArray.length === 0) {
-        debug('[Func][batchUploadImages] fileArray为空，不存在需要上传的图片')
+        debug('[fileManagerUI][batchUploadImages] fileArray为空，不存在需要上传的图片')
     }else{
         for (let i in fileArray) {
             let file = fileArray[i];
 
             bgObj = await uploadOneImage(pluginInstance, file);
 
-            debug('[Func][batchUploadImages] 在上传的循环内', bgObj)
+            debug('[fileManagerUI][batchUploadImages] 在上传的循环内', bgObj)
         };
 
         await configs.save();
 
         if (applySetting){
-            debug('[Func][batchUploadImages] 在应用设置的判断内', bgObj)
+            debug('[fileManagerUI][batchUploadImages] 在应用设置的判断内', bgObj)
             bgRender.changeBackgroundContent(bgObj.path, bgObj.mode);
             settingsUI.updateSettingPanelElementStatus();
         }
@@ -305,7 +322,7 @@ export async function batchUploadImages(
 
 export async function selectPictureDialog(pluginInstance: BgCoverPlugin) {
     const cacheManagerDialog = new Dialog({
-        title: pluginInstance.i18n.selectPictureManagerTitle,
+        title: window.bgCoverPlugin.i18n.selectPictureManagerTitle,
         width: pluginInstance.isMobile ? "92vw" : "520px",
         height: "92vh",
         content: `
@@ -315,14 +332,14 @@ export async function selectPictureDialog(pluginInstance: BgCoverPlugin) {
                 <!-- tab 1 title -->
                 <div class="item item--full item--focus" data-type="remove">
                     <span class="fn__flex-1"></span>
-                    <span class="item__text">${pluginInstance.i18n.selectPictureManagerTab1}</span>
+                    <span class="item__text">${window.bgCoverPlugin.i18n.selectPictureManagerTab1}</span>
                     <span class="fn__flex-1"></span>
                 </div>
 
                 <!-- tab 2 title -->
                 <!--div class="item item--full" data-type="missing">
                     <span class="fn__flex-1"></span>
-                    <span class="item__text">${pluginInstance.i18n.selectPictureManagerTab2}</span>
+                    <span class="item__text">${window.bgCoverPlugin.i18n.selectPictureManagerTab2}</span>
                     <span class="fn__flex-1"></span>
                 </div-->
             </div>
@@ -336,7 +353,7 @@ export async function selectPictureDialog(pluginInstance: BgCoverPlugin) {
                     <label class="fn__flex" style="justify-content: flex-end;">
                         <button id="removeAllImgs" class="b3-button b3-button--outline fn__flex-center fn__size200">
                             <svg class="svg"><use xlink:href="#iconTrashcan"></use></svg>
-                            ${pluginInstance.i18n.deleteAll}
+                            ${window.bgCoverPlugin.i18n.deleteAll}
                         </button>
                         <div class="fn__space"></div>
                     </label>
@@ -349,10 +366,10 @@ export async function selectPictureDialog(pluginInstance: BgCoverPlugin) {
                             <span class="b3-list-item__text">
                                 20230609230328-7vp057x.png
                             </span>
-                            <span data-type="open" class="b3-tooltips b3-tooltips__w b3-list-item__action" aria-label="${pluginInstance.i18n.setAsBg}">
+                            <span data-type="open" class="b3-tooltips b3-tooltips__w b3-list-item__action" aria-label="${window.bgCoverPlugin.i18n.setAsBg}">
                                 <svg><use xlink:href="#iconHideDock"></use></svg>
                             </span>
-                            <span data-type="clear" class="b3-tooltips b3-tooltips__w b3-list-item__action" aria-label="${pluginInstance.i18n.delete}">
+                            <span data-type="clear" class="b3-tooltips b3-tooltips__w b3-list-item__action" aria-label="${window.bgCoverPlugin.i18n.delete}">
                                 <svg><use xlink:href="#iconTrashcan"></use></svg>
                             </span>
                         </li>
@@ -390,7 +407,7 @@ export async function selectPictureDialog(pluginInstance: BgCoverPlugin) {
         cacheImgListElement.appendChild(element);
       }
 
-    debug('[Func][selectPictureByHand]', listHtmlArray, cacheImgListElement);
+    debug('[fileManagerUI][selectPictureByHand]', listHtmlArray, cacheImgListElement);
 
     let deleteAllImgBtn = document.getElementById('removeAllImgs');
     deleteAllImgBtn.addEventListener('click', clearCacheFolder.bind(pluginInstance, cst.bgMode.image));
@@ -425,10 +442,10 @@ export function generateCacheImgList(pluginInstance: BgCoverPlugin){
             <span class="b3-list-item__text">
                 ${bgObj.name}
             </span>
-            <span data-type="open" class="b3-tooltips b3-tooltips__w b3-list-item__action" aria-label="${pluginInstance.i18n.setAsBg}">
+            <span data-type="open" class="b3-tooltips b3-tooltips__w b3-list-item__action" aria-label="${window.bgCoverPlugin.i18n.setAsBg}">
                 <svg><use xlink:href="#iconHideDock"></use></svg>
             </span>
-            <span data-type="clear" class="b3-tooltips b3-tooltips__w b3-list-item__action" aria-label="${pluginInstance.i18n.delete}">
+            <span data-type="clear" class="b3-tooltips b3-tooltips__w b3-list-item__action" aria-label="${window.bgCoverPlugin.i18n.delete}">
                 <svg><use xlink:href="#iconTrashcan"></use></svg>
             </span>
         </li>
@@ -472,7 +489,7 @@ export function generateCacheImgList(pluginInstance: BgCoverPlugin){
             configs.set('fileidx', fileidx);
         
             // 调用os来移除本地文件夹中的缓存文件
-            debug(`[Func][_rmBg] 移除下列路径的图片：${cst.pluginImgDataDir}/${bgObj.name}`);
+            debug(`[fileManagerUI][_rmBg] 移除下列路径的图片：${cst.pluginImgDataDir}/${bgObj.name}`);
             ka.removeFile(`data/${bgObj.path}`);
         
             // 检查当前文件数量是否为空，如果为空则设置为默认了了图
diff --git a/src/i18n/en_US.json b/src/i18n/en_US.json
index 32adce7..cc1af30 100644
--- a/src/i18n/en_US.json
+++ b/src/i18n/en_US.json
@@ -44,7 +44,7 @@
   "cacheImgMissing": "Find the following images missing in the cache folder:",
   "cacheImgExtra": "Find the following images not in the cache index:",
   "cacheManager": "Manage",
-  "doNotOperateCacheFolder": "No worries, but please do not operate the cache directory in the file explorer manually",
+  "doNotOperateCacheFolder": "No worries and has been updated, may caused by cross-device sync",
   "confirm": "Still reporting",
   "reset": "Reset",
   "cancel": "Cancel",
diff --git a/src/i18n/zh_CN.json b/src/i18n/zh_CN.json
index cc5f2c4..832bd4b 100644
--- a/src/i18n/zh_CN.json
+++ b/src/i18n/zh_CN.json
@@ -44,7 +44,7 @@
   "cacheImgMissing": "发现下列图片在缓存文件夹中丢失:",
   "cacheImgExtra": "发现下列图片未被缓存记录:",
   "cacheManager": "管理",
-  "doNotOperateCacheFolder": "不要恐慌，但请不要手动去修改缓存文件夹中的内容",
+  "doNotOperateCacheFolder": "不要恐慌，可能由跨设备同步引起，已更新缓存",
   "confirm": "仍然汇报",
   "reset": "重置",
   "cancel": "取消",
diff --git a/src/index.ts b/src/index.ts
index 17b4763..e98ed54 100644
--- a/src/index.ts
+++ b/src/index.ts
@@ -49,6 +49,11 @@ export default class BgCoverPlugin extends Plugin {
         const frontEnd = getFrontend();
         this.isMobile = frontEnd === "mobile" || frontEnd === "browser-mobile";
 
+        window.bgCoverPlugin = {
+            i18n: this.i18n,
+            isMobile: this.isMobile,
+        }
+
         // 图标的制作参见帮助文档
         this.addIcons(cst.diyIcon.iconLogo);
 
@@ -107,7 +112,7 @@ export default class BgCoverPlugin extends Plugin {
         debug(`frontend: ${getFrontend()}; backend: ${getBackend()}`);
 
         // 临时debug用，不用每次都打开
-        themeAdapterUI.adaptConfigEditor(this);
+        // themeAdapterUI.adaptConfigEditor(this);
     }
 
     onunload() {
diff --git a/src/noticeUI.ts b/src/noticeUI.ts
index b6523fa..7449e96 100644
--- a/src/noticeUI.ts
+++ b/src/noticeUI.ts
@@ -14,13 +14,13 @@ import {
 
 
 export function showMobileTodo() {
-    showMessage(`${this.i18n.mobileNotSupported}`, 1000, "info")
+    showMessage(`${window.bgCoverPlugin.i18n.mobileNotSupported}`, 1000, "info")
 }
 
 export function showIndev(msg: string = '') {
     const dialog = new Dialog({
-        title: `${this.i18n.inDevTitle}`,
-        content: `<div class="b3-dialog__content">${this.i18n.inDev}<span>${msg}</span></div>`,
-        width: this.isMobile ? "92vw" : "520px",
+        title: `${window.bgCoverPlugin.i18n.inDevTitle}`,
+        content: `<div class="b3-dialog__content">${window.bgCoverPlugin.i18n.inDev}<span>${msg}</span></div>`,
+        width: window.bgCoverPlugin.i18nisMobile ? "92vw" : "520px",
     });
 }
\ No newline at end of file
diff --git a/src/settingsUI.ts b/src/settingsUI.ts
index 387472a..44372e4 100644
--- a/src/settingsUI.ts
+++ b/src/settingsUI.ts
@@ -9,6 +9,7 @@ import * as fileManagerUI from "./fileManagerUI";
 import * as topbarUI from "./topbarUI";
 import * as bgRender from "./bgRender";
 import * as themeAdapterUI from "./themeAdapterUI";
+import * as noticeUI from "./noticeUI"
 
 import {
     error, warn, info, debug,
@@ -29,7 +30,7 @@ export function openSettingDialog(pluginInstance: BgCoverPlugin) {
     const cacheImgNum = fileManagerUI.getCacheImgNum();
 
     const dialog = new Dialog({
-        title: `${pluginInstance.i18n.addTopBarIcon}(v${packageInfo.version}) ${pluginInstance.i18n.settingLabel}`,
+        title: `${window.bgCoverPlugin.i18n.addTopBarIcon}(v${packageInfo.version}) ${window.bgCoverPlugin.i18n.settingLabel}`,
         width: pluginInstance.isMobile ? "92vw" : "max(520px, 50vw)",
         height: "max(520px, 90vh)",
         content: `
@@ -39,7 +40,7 @@ export function openSettingDialog(pluginInstance: BgCoverPlugin) {
         -->
         <label class="fn__flex b3-label">
             <div class="fn__flex-1">
-                ${pluginInstance.i18n.imgPathLabel}
+                ${window.bgCoverPlugin.i18n.imgPathLabel}
                 <div class="b3-label__text">
                     <code id="crtImgName" class="fn__code">${configs.get('bgObj') === undefined ? cst.demoImgURL : configs.get('bgObj').name}</code>
                 </div>
@@ -58,9 +59,9 @@ export function openSettingDialog(pluginInstance: BgCoverPlugin) {
         <label class="fn__flex b3-label">
             <div class="fn__flex-1">
                 <div class="fn__flex">
-                    ${pluginInstance.i18n.cacheDirectoryLabel}
+                    ${window.bgCoverPlugin.i18n.cacheDirectoryLabel}
                     <span class="fn__space"></span>
-                    <span style="color: var(--b3-theme-on-surface)">${pluginInstance.i18n.cacheDirectoryDes}</span>
+                    <span style="color: var(--b3-theme-on-surface)">${window.bgCoverPlugin.i18n.cacheDirectoryDes}</span>
                     <span id="cacheImgNumElement" class="selected" style="color: rgb(255,0,0)">
                         [ ${cacheImgNum} ]
                     </span>
@@ -72,7 +73,7 @@ export function openSettingDialog(pluginInstance: BgCoverPlugin) {
             <span class="fn__space"></span>
             <button id="cacheManagerBtn" class="b3-button b3-button--outline fn__flex-center fn__size100" id="appearanceRefresh">
                 <svg><use xlink:href="#iconDatabase"></use></svg>
-                ${pluginInstance.i18n.cacheManager}
+                ${window.bgCoverPlugin.i18n.cacheManager}
             </button>
         </label>
 
@@ -82,9 +83,9 @@ export function openSettingDialog(pluginInstance: BgCoverPlugin) {
 
         <label class="fn__flex b3-label">
             <div class="fn__flex-1">
-                ${pluginInstance.i18n.openBackgroundLabel}
+                ${window.bgCoverPlugin.i18n.openBackgroundLabel}
                 <div class="b3-label__text">
-                    ${pluginInstance.i18n.openBackgroundLabelDes}
+                    ${window.bgCoverPlugin.i18n.openBackgroundLabelDes}
                 </div>
             </div>
             <span class="fn__flex-center" />
@@ -97,9 +98,9 @@ export function openSettingDialog(pluginInstance: BgCoverPlugin) {
         </label>
         <label class="fn__flex b3-label">
             <div class="fn__flex-1">
-                ${pluginInstance.i18n.autoRefreshLabel}
+                ${window.bgCoverPlugin.i18n.autoRefreshLabel}
                 <div class="b3-label__text">
-                    ${pluginInstance.i18n.autoRefreshDes}
+                    ${window.bgCoverPlugin.i18n.autoRefreshDes}
                 </div>
             </div>
             <span class="fn__flex-center" />
@@ -117,9 +118,9 @@ export function openSettingDialog(pluginInstance: BgCoverPlugin) {
 
         <label class="fn__flex b3-label config__item">
             <div class="fn__flex-1">
-                ${pluginInstance.i18n.opacityLabel}
+                ${window.bgCoverPlugin.i18n.opacityLabel}
                 <div class="b3-label__text">
-                    ${pluginInstance.i18n.opacityDes}
+                    ${window.bgCoverPlugin.i18n.opacityDes}
                 </div>
             </div>
             <div class="b3-tooltips b3-tooltips__n fn__flex-center" aria-label="${configs.get('opacity')}">   
@@ -128,9 +129,9 @@ export function openSettingDialog(pluginInstance: BgCoverPlugin) {
         </label>
         <label class="fn__flex b3-label config__item">
             <div class="fn__flex-1">
-                ${pluginInstance.i18n.blurLabel}
+                ${window.bgCoverPlugin.i18n.blurLabel}
                 <div class="b3-label__text">
-                    ${pluginInstance.i18n.blurDes}
+                    ${window.bgCoverPlugin.i18n.blurDes}
                 </div>
             </div>
             <div class="b3-tooltips b3-tooltips__n fn__flex-center" aria-label="${configs.get('blur')}">   
@@ -144,26 +145,26 @@ export function openSettingDialog(pluginInstance: BgCoverPlugin) {
 
         <label class="fn__flex b3-label config__item">
             <div class="fn__flex-1">
-                ${pluginInstance.i18n.transparentMode}
-                <div class="b3-label__text">${pluginInstance.i18n.transparentModeDes}</div>
+                ${window.bgCoverPlugin.i18n.transparentMode}
+                <div class="b3-label__text">${window.bgCoverPlugin.i18n.transparentModeDes}</div>
             </div>
             <span class="fn__space"></span>
             <select id="transModeSelect" class="b3-select fn__flex-center fn__size200">
-                <option value="0" selected="">${pluginInstance.i18n.transparentModeOpacity}</option>
-                <option value="1">${pluginInstance.i18n.transparentModeCss}</option>
+                <option value="0" selected="">${window.bgCoverPlugin.i18n.transparentModeOpacity}</option>
+                <option value="1">${window.bgCoverPlugin.i18n.transparentModeCss}</option>
             </select>
         </label>
 
         <label class="fn__flex b3-label config__item">
             <div class="fn__flex-1">
                 <div class="fn__flex">
-                    ${pluginInstance.i18n.themeAdaptLabel}
+                    ${window.bgCoverPlugin.i18n.themeAdaptLabel}
                     <span class="fn__space"></span>
-                    <a id="adaptConfigEditorURL">${pluginInstance.i18n.themeAdaptContentDes}</a>
+                    <a id="adaptConfigEditorURL">${window.bgCoverPlugin.i18n.themeAdaptContentDes}</a>
                 </div>
                 
                 <div id="themeAdaptDes" class="b3-label__text">
-                    ${pluginInstance.i18n.themeAdaptDes}
+                    ${window.bgCoverPlugin.i18n.themeAdaptDes}
                 </div>
             </div>
 
@@ -182,16 +183,16 @@ export function openSettingDialog(pluginInstance: BgCoverPlugin) {
 
         <label class="b3-label config__item fn__flex">
             <div class="fn__flex-1">
-            ${pluginInstance.i18n.resetConfigLabel}
+            ${window.bgCoverPlugin.i18n.resetConfigLabel}
                 <div class="b3-label__text">
-                    ${pluginInstance.i18n.resetConfigDes}<span class="selected" style="color:rgb(255,0,0)">${pluginInstance.i18n.resetConfigDes2}
+                    ${window.bgCoverPlugin.i18n.resetConfigDes}<span class="selected" style="color:rgb(255,0,0)">${window.bgCoverPlugin.i18n.resetConfigDes2}
                     </span>
                 </div>
             </div>
             <span class="fn__space"></span>
             <button id="resetBtn" class="b3-button b3-button--outline fn__flex-center fn__size100" id="appearanceRefresh">
                 <svg><use xlink:href="#iconRefresh"></use></svg>
-                ${pluginInstance.i18n.reset}
+                ${window.bgCoverPlugin.i18n.reset}
             </button>
         </label>
 
@@ -201,9 +202,9 @@ export function openSettingDialog(pluginInstance: BgCoverPlugin) {
 
         <label class="fn__flex b3-label config__item">
             <div class="fn__flex-1">
-                ${pluginInstance.i18n.inDevModeLabel}
+                ${window.bgCoverPlugin.i18n.inDevModeLabel}
                 <div class="b3-label__text">
-                    ${pluginInstance.i18n.inDevModeDes}
+                    ${window.bgCoverPlugin.i18n.inDevModeDes}
                 </div>
             </div>
             <span class="fn__flex-center" />
@@ -289,7 +290,12 @@ export function openSettingDialog(pluginInstance: BgCoverPlugin) {
     opacityElement.addEventListener("change", () => {
         configs.set('opacity', parseFloat(opacityElement.value));
         if (configs.get('activate')) {
-            bgRender.changeOpacity(pluginInstance, configs.get('opacity'), configs.get('transMode'), configs.get('adaptMode'));
+            bgRender.changeOpacity(
+                pluginInstance, 
+                configs.get('opacity'), 
+                configs.get('transMode'), 
+                configs.get('adaptMode')
+            );
         }
         configs.save();
     })
@@ -319,13 +325,19 @@ export function openSettingDialog(pluginInstance: BgCoverPlugin) {
 
     transModeElement.addEventListener('change', () => {
         configs.set('transMode', transModeElement.value);
-        bgRender.changeOpacity(pluginInstance, configs.get('opacity'), configs.get('transMode'), configs.get('adaptMode'));
+        bgRender.changeOpacity(
+            pluginInstance, 
+            configs.get('opacity'), 
+            configs.get('transMode'), 
+            configs.get('adaptMode')
+        );
         configs.save();
     });
 
     const configEditorURL = document.getElementById('adaptConfigEditorURL') as HTMLLinkElement
     configEditorURL.addEventListener('click', () => {
-        themeAdapterUI.adaptConfigEditor(pluginInstance);
+        // themeAdapterUI.adaptConfigEditor(pluginInstance);
+        noticeUI.showIndev();
     });
 
     // the theme adapt switches
@@ -335,7 +347,11 @@ export function openSettingDialog(pluginInstance: BgCoverPlugin) {
     themeAdaptElement.addEventListener("click", () => {
         configs.set('adaptMode', !configs.get('adaptMode'));
         themeAdaptElement.value = `${configs.get('adaptMode')}`;
-        bgRender.changeOpacity(pluginInstance, configs.get('opacity'),  configs.get('transMode'), configs.get('adaptMode'));
+        bgRender.changeOpacity(
+            pluginInstance, 
+            parseFloat(configs.get('opacity')), 
+            parseInt(configs.get('transMode')), 
+            configs.get('adaptMode'));
         configs.save();
     });
 
diff --git a/src/themeAdapterUI.ts b/src/themeAdapterUI.ts
index 66aeb12..a21e91b 100644
--- a/src/themeAdapterUI.ts
+++ b/src/themeAdapterUI.ts
@@ -142,7 +142,7 @@ export async function adaptConfigEditor(pluginInstance: BgCoverPlugin) {
     const [themeMode, themeName] = getThemeInfo();
 
     const configEditor = new Dialog({
-        title: pluginInstance.i18n.themeAdaptContentDes,
+        title: window.bgCoverPlugin.i18n.themeAdaptContentDes,
         width: pluginInstance.isMobile ? "92vw" : "520px",
         height: "75vh",
         content: `
@@ -150,13 +150,13 @@ export async function adaptConfigEditor(pluginInstance: BgCoverPlugin) {
 
             <div class="b3-label file-tree config-keymap" id="keymapList" style="height:100%;">
                 <div class="fn__flex config__item">
-                    <a href="https://github.com/HowcanoeWang/siyuan-plugin-background-cover/discussion">${pluginInstance.i18n.themeAdaptEditorShare}</a>
+                    <a href="https://github.com/HowcanoeWang/siyuan-plugin-background-cover/discussion">${window.bgCoverPlugin.i18n.themeAdaptEditorShare}</a>
                 </div>
 
                 <div class="fn__hr"></div>
 
                 <div class="fn__flex config__item">
-                    <span>${pluginInstance.i18n.themeAdaptEditorDes1}</span>
+                    <span>${window.bgCoverPlugin.i18n.themeAdaptEditorDes1}</span>
 
                     <span class="fn__space"></span>
                     
@@ -164,17 +164,17 @@ export async function adaptConfigEditor(pluginInstance: BgCoverPlugin) {
 
                     <span class="fn__space"></span>
 
-                    <span>${pluginInstance.i18n.themeAdaptEditorDes2}</span>
+                    <span>${window.bgCoverPlugin.i18n.themeAdaptEditorDes2}</span>
                     
                     <span class="fn__space"></span>
                     
-                    <code style="color:red;">${themeMode === 0 ? pluginInstance.i18n.themeAdaptEditorMode0 : pluginInstance.i18n.themeAdaptEditorMode1}</code>
+                    <code style="color:red;">${themeMode === 0 ? window.bgCoverPlugin.i18n.themeAdaptEditorMode0 : window.bgCoverPlugin.i18n.themeAdaptEditorMode1}</code>
                 </div>
                 
                 <div class="fn__hr"></div>
 
                 <div class="fn__flex config__item">
-                    <span>${pluginInstance.i18n.themeAdaptEditorDes3}</span>
+                    <span>${window.bgCoverPlugin.i18n.themeAdaptEditorDes3}</span>
                 </div>
 
                 <div class="fn__hr"></div>
@@ -187,8 +187,8 @@ export async function adaptConfigEditor(pluginInstance: BgCoverPlugin) {
                         <span class="b3-list-item__toggle b3-list-item__toggle--hl">
                             <svg class="b3-list-item__arrow b3-list-item__arrow--open"><use xlink:href="#iconRight"></use></svg>
                         </span>
-                        <span class="b3-list-item__text ft__on-surface">${pluginInstance.i18n.transparentModeOpacity}</span>
-                        <span data-type="clear" class="b3-list-item__action b3-tooltips b3-tooltips__w" aria-label="${pluginInstance.i18n.addElement}">
+                        <span class="b3-list-item__text ft__on-surface">${window.bgCoverPlugin.i18n.transparentModeOpacity}</span>
+                        <span data-type="clear" class="b3-list-item__action b3-tooltips b3-tooltips__w" aria-label="${window.bgCoverPlugin.i18n.addElement}">
                             <svg>
                                 <use xlink:href="#iconAdd"></use>
                             </svg>
@@ -203,12 +203,12 @@ export async function adaptConfigEditor(pluginInstance: BgCoverPlugin) {
                                 <svg class="b3-list-item__arrow b3-list-item__arrow--open"><use xlink:href="#iconRight"></use></svg>
                             </span>
                             <span class="b3-list-item__text ft__on-surface">$toolbar</span>
-                            <span data-type="clear" class="b3-list-item__action b3-tooltips b3-tooltips__w" aria-label="${pluginInstance.i18n.addStyle}">
+                            <span data-type="clear" class="b3-list-item__action b3-tooltips b3-tooltips__w" aria-label="${window.bgCoverPlugin.i18n.addStyle}">
                                 <svg>
                                     <use xlink:href="#iconAdd"></use>
                                 </svg>
                             </span>
-                            <span data-type="clear" class="b3-list-item__action b3-tooltips b3-tooltips__w" aria-label="${pluginInstance.i18n.delete}">
+                            <span data-type="clear" class="b3-list-item__action b3-tooltips b3-tooltips__w" aria-label="${window.bgCoverPlugin.i18n.delete}">
                                 <svg>
                                     <use xlink:href="#iconTrashcan"></use>
                                 </svg>
@@ -220,7 +220,7 @@ export async function adaptConfigEditor(pluginInstance: BgCoverPlugin) {
                             <!-- 第三级菜单 start -->
                             <label class="b3-list-item b3-list-item--narrow b3-list-item--hide-action">
                                 <span class="b3-list-item__text"><code>background-color</code></span>
-                                <span data-type="clear" class="b3-list-item__action b3-tooltips b3-tooltips__w" aria-label="${pluginInstance.i18n.delete}">
+                                <span data-type="clear" class="b3-list-item__action b3-tooltips b3-tooltips__w" aria-label="${window.bgCoverPlugin.i18n.delete}">
                                     <svg>
                                         <use xlink:href="#iconTrashcan"></use>
                                     </svg>
@@ -246,8 +246,8 @@ export async function adaptConfigEditor(pluginInstance: BgCoverPlugin) {
                         <span class="b3-list-item__toggle b3-list-item__toggle--hl">
                             <svg class="b3-list-item__arrow"><use xlink:href="#iconRight"></use></svg>
                         </span>
-                        <span class="b3-list-item__text ft__on-surface">${pluginInstance.i18n.transparentModeCss}</span>
-                        <span data-type="clear" class="b3-list-item__action b3-tooltips b3-tooltips__w" aria-label="${pluginInstance.i18n.addElement}">
+                        <span class="b3-list-item__text ft__on-surface">${window.bgCoverPlugin.i18n.transparentModeCss}</span>
+                        <span data-type="clear" class="b3-list-item__action b3-tooltips b3-tooltips__w" aria-label="${window.bgCoverPlugin.i18n.addElement}">
                         <svg>
                             <use xlink:href="#iconAdd"></use>
                         </svg>
@@ -261,18 +261,18 @@ export async function adaptConfigEditor(pluginInstance: BgCoverPlugin) {
 
             <!--label class="b3-label fn__flex">
                 <div class="fn__flex-1">
-                    <a href="https://github.com/HowcanoeWang/siyuan-plugin-background-cover/discussion">${pluginInstance.i18n.themeAdaptEditorShare}</a>
+                    <a href="https://github.com/HowcanoeWang/siyuan-plugin-background-cover/discussion">${window.bgCoverPlugin.i18n.themeAdaptEditorShare}</a>
                 </div>
             </label-->
 
             <div class="b3-dialog__action">
-                <button class="b3-button b3-button--cancel">${pluginInstance.i18n.cancel}</button>
+                <button class="b3-button b3-button--cancel">${window.bgCoverPlugin.i18n.cancel}</button>
                 <div class="fn__space"></div>
-                <button class="b3-button b3-button--text">${pluginInstance.i18n.import}</button>
+                <button class="b3-button b3-button--text">${window.bgCoverPlugin.i18n.import}</button>
                 <div class="fn__space"></div>
-                <button class="b3-button b3-button--text">${pluginInstance.i18n.save}</button>
+                <button class="b3-button b3-button--text">${window.bgCoverPlugin.i18n.save}</button>
                 <div class="fn__space"></div>
-                <button class="b3-button b3-button--text">${pluginInstance.i18n.export}</button>
+                <button class="b3-button b3-button--text">${window.bgCoverPlugin.i18n.export}</button>
             </div>
         </div>`
     });
diff --git a/src/topbarUI.ts b/src/topbarUI.ts
index dd4328e..22a5b21 100644
--- a/src/topbarUI.ts
+++ b/src/topbarUI.ts
@@ -38,10 +38,10 @@ export async function initTopbar(pluginInstance: BgCoverPlugin) {
 
     const topBarElement = pluginInstance.addTopBar({
         icon: "iconLogo",
-        title: pluginInstance.i18n.addTopBarIcon,
+        title: window.bgCoverPlugin.i18n.addTopBarIcon,
         position: "right",
         callback: () => {
-            debug(`[topbarUI.ts][initTopbar] click and open toolbar`);
+            debug(`[topbarUI][initTopbar] click and open toolbar`);
         }
     });
 
@@ -62,12 +62,12 @@ export async function initTopbar(pluginInstance: BgCoverPlugin) {
             const menu = new Menu("topBarSample", () => { });
             menu.addItem({
                 icon: "iconIndent",
-                label: `${pluginInstance.i18n.selectPictureLabel}`,
+                label: `${window.bgCoverPlugin.i18n.selectPictureLabel}`,
                 type: "submenu",
                 submenu: [
                     {
                         icon: "iconHand",
-                        label: `${pluginInstance.i18n.selectPictureManualLabel}`,
+                        label: `${window.bgCoverPlugin.i18n.selectPictureManualLabel}`,
                         accelerator: pluginInstance.commands[0].customHotkey,
                         click: () => {
                             selectPictureByHand(pluginInstance);
@@ -75,7 +75,7 @@ export async function initTopbar(pluginInstance: BgCoverPlugin) {
                     }, 
                     {
                         icon: "iconMark",
-                        label: `${pluginInstance.i18n.selectPictureRandomLabel}`,
+                        label: `${window.bgCoverPlugin.i18n.selectPictureRandomLabel}`,
                         accelerator: pluginInstance.commands[1].customHotkey,
                         click: () => {
                             selectPictureRandom(pluginInstance, true);
@@ -85,19 +85,19 @@ export async function initTopbar(pluginInstance: BgCoverPlugin) {
             });
             menu.addItem({
                 icon: "iconAdd",
-                label: `${pluginInstance.i18n.addImageLabel}`,
+                label: `${window.bgCoverPlugin.i18n.addImageLabel}`,
                 type: "submenu",
                 submenu: [
                     {
                         icon: "iconImage",
-                        label: `${pluginInstance.i18n.addSingleImageLabel}`,
+                        label: `${window.bgCoverPlugin.i18n.addSingleImageLabel}`,
                         click: () => {
                             addSingleLocalImageFile(pluginInstance);
                         }
                     },
                     {
                         icon: "iconFolder",
-                        label: `${pluginInstance.i18n.addDirectoryLabel}`,
+                        label: `${window.bgCoverPlugin.i18n.addDirectoryLabel}`,
                         click: () => {
                             addDirectory(pluginInstance);
                         }
@@ -107,7 +107,7 @@ export async function initTopbar(pluginInstance: BgCoverPlugin) {
             menu.addItem({
                 id: 'pluginOnOffMenu',
                 icon: `${configs.get('activate') ? 'iconClose' : 'iconSelect'}`,
-                label: `${configs.get('activate') ? pluginInstance.i18n.closeBackgroundLabel : pluginInstance.i18n.openBackgroundLabel}`,
+                label: `${configs.get('activate') ? window.bgCoverPlugin.i18n.closeBackgroundLabel : window.bgCoverPlugin.i18n.openBackgroundLabel}`,
                 accelerator: pluginInstance.commands[2].customHotkey,
                 click: () => {
                     topbarUI.pluginOnOff(pluginInstance);
@@ -118,14 +118,14 @@ export async function initTopbar(pluginInstance: BgCoverPlugin) {
     
             menu.addItem({
                 icon: "iconGithub",
-                label: `${pluginInstance.i18n.bugReportLabel}`,
+                label: `${window.bgCoverPlugin.i18n.bugReportLabel}`,
                 click: () => {
                     bugreportUI.bugReportDialog(pluginInstance);
                 }
             });
             menu.addItem({
                 icon: "iconSettings",
-                label: `${pluginInstance.i18n.settingLabel}`,
+                label: `${window.bgCoverPlugin.i18n.settingLabel}`,
                 click: () => {
                     settingsUI.openSettingDialog(pluginInstance);
                 }
@@ -159,11 +159,11 @@ export async function selectPictureRandom(pluginInstance: BgCoverPlugin, manualP
     if (cacheImgNum === 0) {
         // 没有缓存任何图片，使用默认的了了妹图片ULR来当作背景图
         bgRender.useDefaultLiaoLiaoBg();
-        showMessage(`${pluginInstance.i18n.noCachedImg4random}`, 3000, "info")
+        showMessage(`${window.bgCoverPlugin.i18n.noCachedImg4random}`, 3000, "info")
     } else if (cacheImgNum === 1) {
         // 只有一张图，无法进行随机抽选(无变化)
         if (manualPress) {
-            showMessage(`${pluginInstance.i18n.selectPictureRandomNotice}`, 3000, "info")
+            showMessage(`${window.bgCoverPlugin.i18n.selectPictureRandomNotice}`, 3000, "info")
         }
         let belayerElement = document.getElementById('bglayer')
         if (belayerElement.style.getPropertyValue('background-image') === '') {
@@ -179,14 +179,14 @@ export async function selectPictureRandom(pluginInstance: BgCoverPlugin, manualP
         while (true) {
             let r = Math.floor(Math.random() * cacheImgNum)
             r_hash = Object.keys(fileidx)[r]
-            debug(`[Func][selectPictureRandom] 随机抽一张，之前：${crt_hash}，随机到：${r_hash}`)
+            debug(`[topbarUI][selectPictureRandom] 随机抽一张，之前：${crt_hash}，随机到：${r_hash}`)
             if (r_hash !== crt_hash) {
                 // 确保随机到另一张图而不是当前的图片
-                debug(`[Func][selectPictureRandom] 已抽到不同的背景图${r_hash}，进行替换`)
+                debug(`[topbarUI][selectPictureRandom] 已抽到不同的背景图${r_hash}，进行替换`)
                 break
             }
         }
-        debug('[Func][selectPictureRandom] 跳出抽卡死循环,前景图为：', fileidx[r_hash])
+        debug('[topbarUI][selectPictureRandom] 跳出抽卡死循环,前景图为：', fileidx[r_hash])
         bgRender.changeBackgroundContent(fileidx[r_hash].path, fileidx[r_hash].mode)
         configs.set('bgObj', fileidx[r_hash])
     }
@@ -199,7 +199,7 @@ export async function addSingleLocalImageFile(pluginInstance: BgCoverPlugin) {
     const cacheImgNum = fileManagerUI.getCacheImgNum();
 
     if (cacheImgNum >= cst.cacheMaxNum) {
-        showMessage(pluginInstance.i18n.addSingleImageExceed1 + cst.cacheMaxNum + pluginInstance.i18n.addSingleImageExceed2, 7000, 'error');
+        showMessage(window.bgCoverPlugin.i18n.addSingleImageExceed1 + cst.cacheMaxNum + window.bgCoverPlugin.i18n.addSingleImageExceed2, 7000, 'error');
     }else{
         const pickerOpts = {
             types: [
@@ -247,7 +247,7 @@ export async function addDirectory(pluginInstance: BgCoverPlugin) {
 
             const [prefix, suffix] = os.splitext(fileName)
             // suffix = 'jpg'
-            debug(`[Func][addDirectory] 当前图片${fileName}后缀为${suffix}, 存在于允许的图片后缀(${cst.supportedImageSuffix})中：${cst.supportedImageSuffix.includes(`.${suffix}`)}`)
+            debug(`[topbarUI][addDirectory] 当前图片${fileName}后缀为${suffix}, 存在于允许的图片后缀(${cst.supportedImageSuffix})中：${cst.supportedImageSuffix.includes(`.${suffix}`)}`)
             if (cst.supportedImageSuffix.includes(`.${suffix}`)) {
 
                 let md5 = fileManagerUI.imgExistsInCache(pluginInstance, file, false);
@@ -255,23 +255,23 @@ export async function addDirectory(pluginInstance: BgCoverPlugin) {
                 if (md5 !== 'exists') {
                     fileContainer.push(file)
                 }else{
-                    debug(`[Func][addDirectory] 当前图片${fileName}md5为${md5}, 存在于缓存中`)
+                    debug(`[topbarUI][addDirectory] 当前图片${fileName}md5为${md5}, 存在于缓存中`)
                 }
             }
 
-            debug(`[Func][addDirectory] fileContainer`, fileContainer)
+            debug(`[topbarUI][addDirectory] fileContainer`, fileContainer)
         }
 
         if (fileContainer.length >= cst.cacheMaxNum - cacheImgNum) {
-            showMessage(pluginInstance.i18n.addDirectoryLabelError1 + cst.cacheMaxNum + pluginInstance.i18n.addDirectoryLabelError2, 7000, 'error')
+            showMessage(window.bgCoverPlugin.i18n.addDirectoryLabelError1 + cst.cacheMaxNum + window.bgCoverPlugin.i18n.addDirectoryLabelError2, 7000, 'error')
             break
         }
     }
 
     if (fileContainer.length >= 30) {
         confirm(
-            pluginInstance.i18n.addDirectoryLabelConfirmTitle,
-            `${pluginInstance.i18n.addDirectoryLabelConfirm1} ${fileContainer.length} ${pluginInstance.i18n.addDirectoryLabelConfirm2}`,
+            window.bgCoverPlugin.i18n.addDirectoryLabelConfirmTitle,
+            `${window.bgCoverPlugin.i18n.addDirectoryLabelConfirm1} ${fileContainer.length} ${window.bgCoverPlugin.i18n.addDirectoryLabelConfirm2}`,
             async () => {
                 // 同意上传，则开始批量上传
                 await fileManagerUI.batchUploadImages(pluginInstance, fileContainer, true);
diff --git a/src/utils.ts b/src/utils.ts
index e5a8ef1..85251c3 100644
--- a/src/utils.ts
+++ b/src/utils.ts
@@ -120,7 +120,7 @@ export class CloseCV {
         }else if (colorString.slice(0,4) === 'var(') {  // e.g.  var(--b3-theme-background)
             let cssvar_name = colorString.slice(4,-1);
             let originalColor = cssVarColors.getPropertyValue(cssvar_name);
-            debug(`[Func][CV2.changeColorOpacity] input colorStr = ${colorString}, extract css variable ${cssvar_name} and obtained value as ${originalColor}`)
+            debug(`[utils][CV2.changeColorOpacity] input colorStr = ${colorString}, extract css variable ${cssvar_name} and obtained value as ${originalColor}`)
             changedColor = this.changeColorOpacity(originalColor, alpha)
         // --> 如果当前元素为正常的rgb开头
         }else if (colorString.slice(0,4) === 'rgb(') {