{"id":69961,"date":"2024-07-19T16:05:46","date_gmt":"2024-07-19T12:35:46","guid":{"rendered":"https:\/\/nabfollower.com\/blog\/how-to-build-and-publish-a-chrome-extension-step-by-step-guide-to-creating-a-custom-session-saver-1j80\/"},"modified":"2024-07-19T16:05:46","modified_gmt":"2024-07-19T12:35:46","slug":"how-to-build-and-publish-a-chrome-extension-step-by-step-guide-to-creating-a-custom-session-saver-1j80","status":"publish","type":"post","link":"https:\/\/nabfollower.com\/blog\/how-to-build-and-publish-a-chrome-extension-step-by-step-guide-to-creating-a-custom-session-saver-1j80\/","title":{"rendered":"\u0646\u062d\u0648\u0647 \u0633\u0627\u062e\u062a \u0648 \u0627\u0646\u062a\u0634\u0627\u0631 \u06cc\u06a9 \u0628\u0631\u0646\u0627\u0645\u0647 \u0627\u0641\u0632\u0648\u062f\u0646\u06cc \u06a9\u0631\u0648\u0645: \u0631\u0627\u0647\u0646\u0645\u0627\u06cc \u06af\u0627\u0645 \u0628\u0647 \u06af\u0627\u0645 \u0628\u0631\u0627\u06cc \u0627\u06cc\u062c\u0627\u062f \u06cc\u06a9 \u0645\u062d\u0627\u0641\u0638 \u062c\u0644\u0633\u0647 \u0633\u0641\u0627\u0631\u0634\u06cc"},"content":{"rendered":"<p>Summarize this content to 400 words in Persian Lang <\/p>\n<p>  \u0645\u0639\u0631\u0641\u06cc<\/p>\n<p>\u0627\u06cc\u062c\u0627\u062f \u06cc\u06a9 \u0627\u0641\u0632\u0648\u0646\u0647 \u06a9\u0631\u0648\u0645 \u062f\u0631 \u0627\u0628\u062a\u062f\u0627 \u0645\u06cc \u062a\u0648\u0627\u0646\u062f \u062f\u0644\u0647\u0631\u0647 \u0622\u0648\u0631 \u0628\u0647 \u0646\u0638\u0631 \u0628\u0631\u0633\u062f.  \u0627\u0645\u0627 \u0628\u0627 \u0631\u0627\u0647\u0646\u0645\u0627\u06cc\u06cc \u0635\u062d\u06cc\u062d\u060c \u0642\u0627\u0628\u0644 \u0645\u062f\u06cc\u0631\u06cc\u062a \u0627\u0633\u062a.  \u0627\u06cc\u0646 \u0631\u0627\u0647\u0646\u0645\u0627 \u0634\u0645\u0627 \u0631\u0627 \u062f\u0631 \u0633\u0627\u062e\u062a \u0648 \u0627\u0646\u062a\u0634\u0627\u0631 \u0627\u0641\u0632\u0648\u0646\u0647 \u06a9\u0631\u0648\u0645 \u0631\u0627\u0647\u0646\u0645\u0627\u06cc\u06cc \u0645\u06cc \u06a9\u0646\u062f.  &#8220;Custom Session Saver&#8221; \u0646\u0627\u0645\u06cc\u062f\u0647 \u0645\u06cc \u0634\u0648\u062f.  \u0627\u06cc\u0646 \u0627\u0641\u0632\u0648\u0646\u0647 \u0628\u0647 \u06a9\u0627\u0631\u0628\u0631\u0627\u0646 \u0627\u0645\u06a9\u0627\u0646 \u0630\u062e\u06cc\u0631\u0647 \u0648 \u0628\u0627\u0632\u06cc\u0627\u0628\u06cc \u062c\u0644\u0633\u0627\u062a \u0633\u0641\u0627\u0631\u0634\u06cc \u0631\u0627 \u0645\u06cc \u062f\u0647\u062f.  \u0628\u0647 \u0639\u0646\u0648\u0627\u0646 \u0645\u062b\u0627\u0644\u060c &#8220;\u06a9\u0627\u0631&#8221;\u060c &#8220;\u0634\u062e\u0635\u06cc&#8221;\u060c &#8220;\u062a\u0648\u0633\u0639\u0647&#8221;\u060c \u0648 \u063a\u06cc\u0631\u0647.<\/p>\n<p>\u062f\u0631 \u067e\u0627\u06cc\u0627\u0646 \u0627\u06cc\u0646 \u0631\u0627\u0647\u0646\u0645\u0627\u060c \u06cc\u06a9 \u0627\u0641\u0632\u0648\u0646\u0647 \u06a9\u0627\u0631\u0628\u0631\u062f\u06cc \u06a9\u0631\u0648\u0645\u060c \u0622\u0645\u0627\u062f\u0647 \u0628\u0631\u0627\u06cc \u0627\u0646\u062a\u0634\u0627\u0631 \u062e\u0648\u0627\u0647\u06cc\u062f \u062f\u0627\u0634\u062a.<\/p>\n<p>  \u0631\u0627\u0647 \u0627\u0646\u062f\u0627\u0632\u06cc \u067e\u0631\u0648\u0698\u0647<\/p>\n<p>\u0628\u0627 \u0627\u06cc\u062c\u0627\u062f \u062f\u0627\u06cc\u0631\u06a9\u062a\u0648\u0631\u06cc \u0628\u0631\u0627\u06cc \u067e\u0631\u0648\u0698\u0647 \u062e\u0648\u062f \u0628\u0627 \u0646\u0627\u0645 &#8220;custom_session_storage&#8221; \u0634\u0631\u0648\u0639 \u06a9\u0646\u06cc\u062f.  \u062f\u0631 \u062f\u0627\u062e\u0644 \u0627\u06cc\u0646 \u062f\u0627\u06cc\u0631\u06a9\u062a\u0648\u0631\u06cc\u060c \u0633\u0627\u062e\u062a\u0627\u0631 \u067e\u0648\u0634\u0647 \u0632\u06cc\u0631 \u0631\u0627 \u0627\u06cc\u062c\u0627\u062f \u06a9\u0646\u06cc\u062f:<\/p>\n<p>project\\_root\/<\/p>\n<p>\u2502<\/p>\n<p>\u251c\u2500\u2500 background.js          # Background script specified in manifest<\/p>\n<p>\u251c\u2500\u2500 images\/                # Directory for icons<\/p>\n<p>\u2502   \u251c\u2500\u2500 icon16.png         # 16&#215;16 icon<\/p>\n<p>\u2502   \u251c\u2500\u2500 icon48.png         # 48&#215;48 icon<\/p>\n<p>\u2502   \u2514\u2500\u2500 icon128.png        # 128&#215;128 icon<\/p>\n<p>\u251c\u2500\u2500 manifest.json          # Chrome extension manifest file<\/p>\n<p>\u251c\u2500\u2500 popup.js          # popup script file<\/p>\n<p>\u251c\u2500\u2500 popup.css          # popup style file<\/p>\n<p>\u2514\u2500\u2500 popup.html             # Default popup HTML file<\/p>\n<p>    \u0648\u0627\u0631\u062f \u062d\u0627\u0644\u062a \u062a\u0645\u0627\u0645 \u0635\u0641\u062d\u0647 \u0634\u0648\u06cc\u062f<\/p>\n<p>    \u0627\u0632 \u062d\u0627\u0644\u062a \u062a\u0645\u0627\u0645 \u0635\u0641\u062d\u0647 \u062e\u0627\u0631\u062c \u0634\u0648\u06cc\u062f<\/p>\n<p>  \u0641\u0627\u06cc\u0644 \u0645\u0627\u0646\u06cc\u0641\u0633\u062a<\/p>\n<p>\u0628\u0627\u0632 \u06a9\u0646 manifest.json \u0648 \u06a9\u062f \u0632\u06cc\u0631 \u0631\u0627 \u0642\u0631\u0627\u0631 \u062f\u0647\u06cc\u062f:<\/p>\n<p>{<br \/>\n    &#8220;manifest_version&#8221;: 3,<br \/>\n    &#8220;name&#8221;: &#8220;Custom Session Saver&#8221;,<br \/>\n    &#8220;version&#8221;: &#8220;1.0&#8221;,<br \/>\n    &#8220;description&#8221;: &#8220;Save and restore custom sessions, for example: &#8216;Work&#8217;, &#8216;Personal&#8217;, &#8216;Development&#8217;, etc.&#8221;,<br \/>\n    &#8220;permissions&#8221;: [<br \/>\n        &#8220;storage&#8221;,<br \/>\n        &#8220;tabs&#8221;<br \/>\n    ],<br \/>\n    &#8220;background&#8221;: {<br \/>\n        &#8220;service_worker&#8221;: &#8220;background.js&#8221;<br \/>\n    },<br \/>\n    &#8220;action&#8221;: {<br \/>\n        &#8220;default_popup&#8221;: &#8220;popup.html&#8221;<br \/>\n    },<br \/>\n    &#8220;icons&#8221;: {<br \/>\n        &#8220;16&#8221;: &#8220;images\/icon16.png&#8221;,<br \/>\n        &#8220;48&#8221;: &#8220;images\/icon48.png&#8221;,<br \/>\n        &#8220;128&#8221;: &#8220;images\/icon128.png&#8221;<br \/>\n    }<br \/>\n}<\/p>\n<p>    \u0648\u0627\u0631\u062f \u062d\u0627\u0644\u062a \u062a\u0645\u0627\u0645 \u0635\u0641\u062d\u0647 \u0634\u0648\u06cc\u062f<\/p>\n<p>    \u0627\u0632 \u062d\u0627\u0644\u062a \u062a\u0645\u0627\u0645 \u0635\u0641\u062d\u0647 \u062e\u0627\u0631\u062c \u0634\u0648\u06cc\u062f<\/p>\n<p>\u062f\u0631 \u0627\u06cc\u0646 \u0641\u0627\u06cc\u0644 \u0628\u0647 \u0635\u0648\u0631\u062a \u0632\u06cc\u0631 \u0639\u0645\u0644 \u0645\u06cc \u06a9\u0646\u06cc\u0645:<\/p>\n<p>\u062a\u0639\u0631\u06cc\u0641 \u0646\u0633\u062e\u0647 \u0645\u0627\u0646\u06cc\u0641\u0633\u062a \u0645\u0648\u0631\u062f \u0627\u0633\u062a\u0641\u0627\u062f\u0647 \u0645\u0627.<br \/>\n\u0646\u0627\u0645\u060c \u0646\u0633\u062e\u0647 \u0648 \u062a\u0648\u0636\u06cc\u062d\u0627\u062a \u0633\u0641\u0627\u0631\u0634\u06cc \u062e\u0648\u062f \u0631\u0627 \u0628\u0647 \u0622\u0646 \u0645\u06cc \u062f\u0647\u06cc\u0645.<br \/>\n\u0627\u0636\u0627\u0641\u0647 \u06a9\u0631\u062f\u0646 \u0645\u062c\u0648\u0632 \u0628\u0631\u0627\u06cc &#8220;\u0630\u062e\u06cc\u0631\u0647 \u0633\u0627\u0632\u06cc&#8221; \u0628\u0631\u0627\u06cc \u0630\u062e\u06cc\u0631\u0647 \u062f\u0627\u062f\u0647 \u0647\u0627\u06cc \u0645\u062d\u0644\u06cc \u0648 &#8220;\u0628\u0631\u06af\u0647 \u0647\u0627&#8221; \u0628\u0631\u0627\u06cc \u062f\u0633\u062a\u06a9\u0627\u0631\u06cc \u0628\u0631\u06af\u0647 \u0647\u0627.<br \/>\n\u062a\u0646\u0638\u06cc\u0645 \u0627\u0633\u06a9\u0631\u06cc\u067e\u062a \u067e\u0633 \u0632\u0645\u06cc\u0646\u0647  \u0627\u06cc\u0646 \u0647\u0645\u0647 \u0639\u0645\u0644\u06a9\u0631\u062f\u0647\u0627 \u0628\u0631\u0627\u06cc \u0630\u062e\u06cc\u0631\u0647 \u0633\u0627\u0632\u06cc \u0628\u0631\u06af\u0647 \u0647\u0627 \u0648 \u062c\u0644\u0633\u0627\u062a \u0631\u0627 \u06a9\u0646\u062a\u0631\u0644 \u0645\u06cc \u06a9\u0646\u062f.<br \/>\n\u062a\u0639\u0631\u06cc\u0641 \u0631\u0627\u0628\u0637 \u06a9\u0627\u0631\u0628\u0631\u06cc \u0628\u0631\u0627\u06cc \u067e\u0646\u062c\u0631\u0647 \u0628\u0627\u0632\u0634\u0648<br \/>\n\u062a\u0646\u0638\u06cc\u0645 \u0646\u0645\u0627\u062f \u067e\u06cc\u0634 \u0641\u0631\u0636 \u0628\u0631\u0627\u06cc \u0627\u0646\u062f\u0627\u0632\u0647 \u0647\u0627\u06cc \u0632\u06cc\u0631: 16&#215;16\u060c 48&#215;48\u060c \u0648 128&#215;128.<\/p>\n<p>  \u0627\u0633\u06a9\u0631\u06cc\u067e\u062a \u067e\u0633 \u0632\u0645\u06cc\u0646\u0647<\/p>\n<p>\u0627\u064a\u062c\u0627\u062f \u0643\u0631\u062f\u0646 background.js \u0628\u0631\u0627\u06cc \u0631\u0633\u06cc\u062f\u06af\u06cc \u0628\u0647 \u0641\u0631\u0622\u06cc\u0646\u062f\u0647\u0627\u06cc \u067e\u0633 \u0632\u0645\u06cc\u0646\u0647 \u0628\u0631\u0646\u0627\u0645\u0647 \u0627\u0641\u0632\u0648\u062f\u0646\u06cc.  \u0622\u0646 \u0631\u0627 \u0628\u0627\u0632 \u06a9\u0646\u06cc\u062f \u0648 \u06a9\u062f \u0632\u06cc\u0631 \u0631\u0627 \u0642\u0631\u0627\u0631 \u062f\u0647\u06cc\u062f:<\/p>\n<p>console.log(&#8220;Background script loaded&#8221;);<\/p>\n<p>chrome.runtime.onInstalled.addListener(() =&gt; {<br \/>\n  console.log(&#8220;Extension installed&#8221;);<br \/>\n});<\/p>\n<p>chrome.runtime.onMessage.addListener((message, sender, sendResponse) =&gt; {<br \/>\n  if (message.action === &#8220;saveSession&#8221;) {<br \/>\n    chrome.storage.local.set({ [message.sessionName]: message.session }, () =&gt; {<br \/>\n      console.log(`Session ${message.sessionName} saved.`);<br \/>\n      chrome.runtime.sendMessage({ action: &#8220;refreshSessions&#8221; });<br \/>\n      if (sendResponse) sendResponse();<br \/>\n    });<br \/>\n  } else if (message.action === &#8220;openSession&#8221;) {<br \/>\n    chrome.storage.local.get([message.sessionName], (result) =&gt; {<br \/>\n      let session = result[message.sessionName];<br \/>\n      if (session) {<br \/>\n        session.forEach((tab) =&gt; {<br \/>\n          chrome.tabs.create({ url: tab.url });<br \/>\n        });<br \/>\n      }<br \/>\n    });<br \/>\n  } else if (message.action === &#8220;deleteSession&#8221;) {<br \/>\n    chrome.storage.local.remove(message.sessionName, () =&gt; {<br \/>\n      console.log(`Session ${message.sessionName} deleted.`);<br \/>\n      chrome.runtime.sendMessage({ action: &#8220;refreshSessions&#8221; });<br \/>\n      if (sendResponse) sendResponse();<br \/>\n    });<br \/>\n  }<br \/>\n});<\/p>\n<p>    \u0648\u0627\u0631\u062f \u062d\u0627\u0644\u062a \u062a\u0645\u0627\u0645 \u0635\u0641\u062d\u0647 \u0634\u0648\u06cc\u062f<\/p>\n<p>    \u0627\u0632 \u062d\u0627\u0644\u062a \u062a\u0645\u0627\u0645 \u0635\u0641\u062d\u0647 \u062e\u0627\u0631\u062c \u0634\u0648\u06cc\u062f<\/p>\n<p>\u062f\u0631 \u0627\u06cc\u0646\u062c\u0627 \u0645\u0627 \u06cc\u06a9 \u067e\u06cc\u0627\u0645 \u06af\u0632\u0627\u0631\u0634 \u06a9\u0646\u0633\u0648\u0644 \u0648 \u062a\u0639\u062f\u0627\u062f\u06cc \u0634\u0646\u0648\u0646\u062f\u0647 \u0631\u0648\u06cc\u062f\u0627\u062f \u0627\u0636\u0627\u0641\u0647 \u06a9\u0631\u062f\u06cc\u0645:<\/p>\n<p>&#8211; onInstalled: \u067e\u0633 \u0627\u0632 \u0646\u0635\u0628\u060c \u0627\u06cc\u0646 \u0631\u0648\u06cc\u062f\u0627\u062f \u0641\u0639\u0627\u0644 \u0645\u06cc \u0634\u0648\u062f.  \u0627\u06cc\u0646 \u06af\u0632\u0627\u0631\u0634 \u0645\u06cc \u062f\u0647\u062f \u06a9\u0647 \u0646\u0635\u0628 \u0628\u0627 \u0645\u0648\u0641\u0642\u06cc\u062a \u0627\u0646\u062c\u0627\u0645 \u0634\u062f\u0647 \u0627\u0633\u062a.<\/p>\n<p>&#8211; onMessage: \u0627\u06cc\u0646 \u0631\u0648\u06cc\u062f\u0627\u062f\u0647\u0627 \u0627\u0632 popup.js.  \u0627\u06af\u0631 \u067e\u06cc\u0627\u0645 &#8220;saveSession&#8221; \u0628\u0627\u0634\u062f\u060c \u062c\u0644\u0633\u0647 \u0631\u0627 \u062f\u0631 \u062d\u0627\u0641\u0638\u0647 \u0645\u062d\u0644\u06cc \u0630\u062e\u06cc\u0631\u0647 \u0645\u06cc \u06a9\u0646\u062f.  \u0627\u06af\u0631 \u067e\u06cc\u0627\u0645 \u00abopenSession\u00bb \u0628\u0627\u0634\u062f\u060c \u062f\u0631 \u0641\u0636\u0627\u06cc \u0630\u062e\u06cc\u0631\u0647\u200c\u0633\u0627\u0632\u06cc \u0645\u062d\u0644\u06cc \u0622\u0646 \u062c\u0644\u0633\u0647 \u062c\u0633\u062a\u062c\u0648 \u0645\u06cc\u200c\u0634\u0648\u062f \u0648 \u0628\u0631\u06af\u0647\u200c\u0647\u0627\u06cc \u062c\u062f\u06cc\u062f\u06cc \u0631\u0627 \u0628\u0631 \u0627\u0633\u0627\u0633 \u062f\u0627\u062f\u0647\u200c\u0647\u0627\u06cc \u0630\u062e\u06cc\u0631\u0647 \u0634\u062f\u0647 \u0628\u0627\u0632 \u0645\u06cc\u200c\u06a9\u0646\u062f.  \u062f\u0631 \u0646\u0647\u0627\u06cc\u062a\u060c \u0627\u06af\u0631 \u067e\u06cc\u0627\u0645 \u00abdeleteSession\u00bb \u0628\u0627\u0634\u062f\u060c \u0646\u0627\u0645 \u062c\u0644\u0633\u0647 \u0631\u0627 \u0627\u0632 \u0641\u0636\u0627\u06cc \u0630\u062e\u06cc\u0631\u0647\u200c\u0633\u0627\u0632\u06cc \u062d\u0630\u0641 \u0645\u06cc\u200c\u06a9\u0646\u062f.<\/p>\n<p>&#8211; \u0627\u0631\u0633\u0627\u0644 \u067e\u06cc\u0627\u0645: \u0628\u0631\u0627\u06cc \u062c\u062f\u0627 \u06a9\u0631\u062f\u0646 \u0646\u06af\u0631\u0627\u0646\u06cc \u0647\u0627\u060c popup.js \u0645\u0646\u0637\u0642 \u062c\u0644\u0633\u0647 \u0631\u0641\u0631\u0634 \u0631\u0627 \u06a9\u0646\u062a\u0631\u0644 \u0645\u06cc \u06a9\u0646\u062f.  \u0647\u0646\u06af\u0627\u0645 \u0630\u062e\u06cc\u0631\u0647 \u06cc\u0627 \u062d\u0630\u0641\u060c \u0631\u0648\u06cc\u062f\u0627\u062f\u06cc \u0631\u0627 \u0627\u0631\u0633\u0627\u0644 \u0645\u06cc \u06a9\u0646\u06cc\u0645 \u06a9\u0647 popup.js \u0628\u0647 \u0646\u0648\u0633\u0627\u0632\u06cc \u06af\u0648\u0634 \u0645\u06cc \u062f\u0647\u062f \u0648 \u0622\u0646 \u0631\u0627 \u0641\u0639\u0627\u0644 \u0645\u06cc \u06a9\u0646\u062f.<\/p>\n<p>  \u0631\u0627\u0628\u0637 \u06a9\u0627\u0631\u0628\u0631\u06cc<\/p>\n<p>\u0631\u0627\u0628\u0637 \u06a9\u0627\u0631\u0628\u0631\u06cc \u0631\u0627 \u062f\u0631 \u0622\u0646 \u062a\u0646\u0638\u06cc\u0645 \u06a9\u0646\u06cc\u062f popup.html.  \u0641\u0627\u06cc\u0644 \u0631\u0627 \u0628\u0627\u0632 \u06a9\u0646\u06cc\u062f \u0648 \u06a9\u062f \u0632\u06cc\u0631 \u0631\u0627 \u0642\u0631\u0627\u0631 \u062f\u0647\u06cc\u062f:<\/p>\n<p>\u062f\u0631 \u0627\u06cc\u0646 \u0641\u0627\u06cc\u0644\u060c \u0645\u0633\u06cc\u0631 \u0627\u0633\u062a\u0627\u06cc\u0644 \u0648 \u0639\u0646\u0648\u0627\u0646 \u0627\u0641\u0632\u0648\u0646\u0647 \u062e\u0648\u062f \u0631\u0627 \u0627\u0636\u0627\u0641\u0647 \u06a9\u0631\u062f\u06cc\u0645.  \u062f\u0631 \u062f\u0627\u062e\u0644 \u062a\u06af \u0628\u062f\u0646\u0647\u060c \u0645\u0648\u0627\u0631\u062f \u0632\u06cc\u0631 \u0631\u0627 \u0642\u0631\u0627\u0631 \u062f\u0627\u062f\u06cc\u0645:<\/p>\n<p>\u0647\u062f\u0631 \u0628\u0627 \u0646\u0645\u0627\u062f \u0648 \u0639\u0646\u0648\u0627\u0646 \u06a9\u0648\u0686\u06a9.<br \/>\n\u06cc\u06a9 \u0638\u0631\u0641 div \u0628\u0627 \u06cc\u06a9 \u0648\u0631\u0648\u062f\u06cc \u0648 \u06cc\u06a9 \u062f\u06a9\u0645\u0647 \u0628\u0631\u0627\u06cc \u0630\u062e\u06cc\u0631\u0647 \u062c\u0644\u0633\u0647.<br \/>\ndiv \u062f\u06cc\u06af\u0631\u06cc \u06a9\u0647 \u062c\u0644\u0633\u0627\u062a \u0630\u062e\u06cc\u0631\u0647 \u0634\u062f\u0647 \u0645\u0627 \u0631\u0627 \u0628\u0631\u06af\u0632\u0627\u0631 \u0645\u06cc \u06a9\u0646\u062f.<br \/>\n\u06cc\u06a9 \u062a\u06af \u0627\u0633\u06a9\u0631\u06cc\u067e\u062a \u0628\u0631\u0627\u06cc \u0648\u0627\u0631\u062f \u06a9\u0631\u062f\u0646 \u0641\u0627\u06cc\u0644 \u062c\u0627\u0648\u0627 \u0627\u0633\u06a9\u0631\u06cc\u067e\u062a \u0645\u0627 ** popup.js**.<\/p>\n<p>  \u0627\u0633\u06a9\u0631\u06cc\u067e\u062a<\/p>\n<p>\u06a9\u0647 \u062f\u0631 popup.js\u060c \u0645\u0627 \u062a\u0639\u0627\u0645\u0644\u0627\u062a \u0631\u0627\u0628\u0637 \u06a9\u0627\u0631\u0628\u0631\u06cc \u0631\u0627 \u0645\u062f\u06cc\u0631\u06cc\u062a \u062e\u0648\u0627\u0647\u06cc\u0645 \u06a9\u0631\u062f.  \u0641\u0627\u06cc\u0644 \u0631\u0627 \u0628\u0627\u0632 \u06a9\u0646\u06cc\u062f \u0648 \u06a9\u062f \u0632\u06cc\u0631 \u0631\u0627 \u0642\u0631\u0627\u0631 \u062f\u0647\u06cc\u062f:<\/p>\n<p>document.addEventListener(&#8220;DOMContentLoaded&#8221;, () =&gt; {<br \/>\n  const saveSessionButton = document.getElementById(&#8220;saveSession&#8221;);<br \/>\n  const sessionNameInput = document.getElementById(&#8220;sessionName&#8221;);<br \/>\n  const sessionsUL = document.getElementById(&#8220;sessionsUL&#8221;);<\/p>\n<p>  const loadSessions = () =&gt; {<br \/>\n    while (sessionsUL.firstChild) {<br \/>\n      sessionsUL.removeChild(sessionsUL.firstChild);<br \/>\n    }<br \/>\n    chrome.storage.local.get(null, (sessions) =&gt; {<br \/>\n      for (let sessionName in sessions) {<br \/>\n        let sessionLI = document.createElement(&#8220;li&#8221;);<br \/>\n        sessionLI.className = &#8220;session&#8221;;<br \/>\n        let sessionTitle = document.createElement(&#8220;span&#8221;);<br \/>\n        sessionTitle.textContent = sessionName;<\/p>\n<p>        let openButton = document.createElement(&#8220;button&#8221;);<br \/>\n        openButton.textContent = &#8220;OPEN&#8221;;<br \/>\n        openButton.addEventListener(&#8220;click&#8221;, () =&gt; {<br \/>\n          chrome.runtime.sendMessage({ action: &#8220;openSession&#8221;, sessionName });<br \/>\n        });<\/p>\n<p>        let deleteButton = document.createElement(&#8220;button&#8221;);<br \/>\n        deleteButton.textContent = &#8220;DELETE&#8221;;<br \/>\n        deleteButton.addEventListener(&#8220;click&#8221;, () =&gt; {<br \/>\n          chrome.runtime.sendMessage({ action: &#8220;deleteSession&#8221;, sessionName });<br \/>\n        });<\/p>\n<p>        sessionLI.appendChild(sessionTitle);<br \/>\n        sessionLI.appendChild(openButton);<br \/>\n        sessionLI.appendChild(deleteButton);<br \/>\n        sessionLI.appendChild(document.createElement(&#8220;br&#8221;));<br \/>\n        sessionsUL.appendChild(sessionLI);<br \/>\n      }<br \/>\n    });<br \/>\n  };<\/p>\n<p>  saveSessionButton.addEventListener(&#8220;click&#8221;, () =&gt; {<br \/>\n    let sessionName = sessionNameInput.value;<br \/>\n    if (sessionName) {<br \/>\n      chrome.tabs.query({ currentWindow: true }, (tabs) =&gt; {<br \/>\n        let session = tabs.map((tab) =&gt; ({ url: tab.url, title: tab.title }));<br \/>\n        chrome.runtime.sendMessage(<br \/>\n          { action: &#8220;saveSession&#8221;, sessionName, session },<br \/>\n          loadSessions<br \/>\n        );<br \/>\n      });<br \/>\n    }<br \/>\n  });<\/p>\n<p>  chrome.runtime.onMessage.addListener((message) =&gt; {<br \/>\n    if (message.action === &#8220;refreshSessions&#8221;) {<br \/>\n      loadSessions();<br \/>\n    }<br \/>\n  });<\/p>\n<p>  loadSessions();<br \/>\n});<\/p>\n<p>    \u0648\u0627\u0631\u062f \u062d\u0627\u0644\u062a \u062a\u0645\u0627\u0645 \u0635\u0641\u062d\u0647 \u0634\u0648\u06cc\u062f<\/p>\n<p>    \u0627\u0632 \u062d\u0627\u0644\u062a \u062a\u0645\u0627\u0645 \u0635\u0641\u062d\u0647 \u062e\u0627\u0631\u062c \u0634\u0648\u06cc\u062f<\/p>\n<p>\u062f\u0627\u062e\u0644 \u0627\u06cc\u0646 \u0627\u0633\u06a9\u0631\u06cc\u067e\u062a:<\/p>\n<p>\u0645\u0627 \u06cc\u06a9 \u0634\u0646\u0648\u0646\u062f\u0647 \u0631\u0648\u06cc \u0633\u0646\u062f \u0627\u06cc\u062c\u0627\u062f \u0645\u06cc \u06a9\u0646\u06cc\u0645 \u062a\u0627 \u0648\u0642\u062a\u06cc \u0647\u0645\u0647 \u0645\u062d\u062a\u0648\u0627 \u0628\u0627\u0631\u06af\u06cc\u0631\u06cc \u0634\u062f\u060c \u0641\u0639\u0627\u0644 \u0634\u0648\u062f.<br \/>\n\u0645\u0627 \u0686\u0646\u062f \u0639\u0646\u0635\u0631 \u0631\u0627 \u0627\u0632 UI \u062f\u0631\u06cc\u0627\u0641\u062a \u0645\u06cc \u06a9\u0646\u06cc\u0645: \u062f\u06a9\u0645\u0647 \u0630\u062e\u06cc\u0631\u0647 \u062c\u0644\u0633\u0647\u060c \u0639\u0646\u0635\u0631 \u0648\u0631\u0648\u062f\u06cc \u0648 \u0639\u0646\u0635\u0631 \u0644\u06cc\u0633\u062a \u062c\u0644\u0633\u0627\u062a.<br \/>\n\u0627\u0644\u0641 \u0631\u0627 \u062a\u0639\u0631\u06cc\u0641 \u0645\u06cc \u06a9\u0646\u06cc\u0645 loadSession \u0631\u0648\u0634.  \u062f\u0631 \u062f\u0627\u062e\u0644\u060c \u0627\u0632 \u06cc\u06a9 \u062d\u0644\u0642\u0647 while \u0628\u0631\u0627\u06cc \u067e\u0627\u06a9 \u06a9\u0631\u062f\u0646 \u0639\u0646\u0635\u0631 \u0644\u06cc\u0633\u062a \u0627\u0633\u062a\u0641\u0627\u062f\u0647 \u0645\u06cc\u200c\u06a9\u0646\u06cc\u0645 \u0648 \u0647\u0631 \u062a\u063a\u06cc\u06cc\u0631 \u0631\u0627 \u062f\u0648\u0628\u0627\u0631\u0647 \u0628\u0627\u0631\u06af\u0630\u0627\u0631\u06cc \u0645\u06cc\u200c\u06a9\u0646\u06cc\u0645.  \u0645\u0627 \u0648\u06cc\u0698\u06af\u06cc session \u0631\u0627 \u0628\u0627 \u0627\u0633\u062a\u0641\u0627\u062f\u0647 \u0627\u0632 \u0631\u0648\u0634 \u0647\u0627\u06cc \u062f\u0627\u062e\u0644\u06cc \u06a9\u0631\u0648\u0645 \u0627\u0632 \u062d\u0627\u0641\u0638\u0647 \u0645\u062d\u0644\u06cc \u0628\u0627\u0632\u06cc\u0627\u0628\u06cc \u0645\u06cc \u06a9\u0646\u06cc\u0645.<br \/>\n\u0645\u0627 \u062f\u0631 \u062a\u0645\u0627\u0645 \u062c\u0644\u0633\u0627\u062a \u062e\u0648\u062f \u0628\u0627 \u0627\u0633\u062a\u0641\u0627\u062f\u0647 \u0627\u0632 a \u062d\u0644\u0642\u0647 \u0645\u06cc \u06a9\u0646\u06cc\u0645 for-in \u062d\u0644\u0642\u0647\u060c \u0627\u06cc\u062c\u0627\u062f \u06cc\u06a9 li \u0639\u0646\u0635\u0631 \u0648 \u062f\u0627\u062f\u0646 \u0646\u0627\u0645 \u06a9\u0644\u0627\u0633 \u062c\u0644\u0633\u0647 \u0628\u0647 \u0622\u0646.  \u06cc\u06a9 \u0641\u0627\u0635\u0644\u0647 \u0628\u0631\u0627\u06cc \u062d\u0641\u0638 \u0639\u0646\u0648\u0627\u0646 \u0645\u0627 \u0627\u06cc\u062c\u0627\u062f \u06a9\u0646\u06cc\u062f.  \u06cc\u06a9 \u062f\u06a9\u0645\u0647 \u0628\u0631\u0627\u06cc \u0628\u0627\u0632 \u06a9\u0631\u062f\u0646 \u062c\u0644\u0633\u0647 \u0647\u0646\u06af\u0627\u0645 \u06a9\u0644\u06cc\u06a9 \u06a9\u0631\u062f\u0646\u060c \u0648 \u06cc\u06a9 \u062f\u06a9\u0645\u0647 \u062d\u0630\u0641 \u0628\u0631\u0627\u06cc \u062d\u0630\u0641 \u062c\u0644\u0633\u0647 \u0647\u0646\u06af\u0627\u0645 \u06a9\u0644\u06cc\u06a9 \u06a9\u0631\u062f\u0646.<br \/>\n\u0639\u0646\u0648\u0627\u0646 \u0648 \u062f\u06a9\u0645\u0647 \u0647\u0627 \u0631\u0627 \u0628\u0647 \u062c\u0644\u0633\u0647 \u062e\u0648\u062f \u0627\u0636\u0627\u0641\u0647 \u0645\u06cc \u06a9\u0646\u06cc\u0645 li \u0639\u0646\u0635\u0631 \u0648 \u0627\u06cc\u0646 \u0639\u0646\u0635\u0631 \u0628\u0647 \u062c\u0644\u0633\u0647 \u0645\u0627 ul \u0627\u0632 \u062c\u0627\u0646\u0628 popup.html.<br \/>\n\u0645\u0627 \u06cc\u06a9 \u0634\u0646\u0648\u0646\u062f\u0647 \u0631\u0648\u06cc\u062f\u0627\u062f \u0631\u0627 \u0628\u0647 \u062f\u06a9\u0645\u0647 \u0630\u062e\u06cc\u0631\u0647 \u062c\u0644\u0633\u0647 \u0627\u0636\u0627\u0641\u0647 \u0645\u06cc \u06a9\u0646\u06cc\u0645.  \u0628\u0627 \u06a9\u0644\u06cc\u06a9\u060c \u0645\u0642\u062f\u0627\u0631 \u0648\u0631\u0648\u062f\u06cc \u0631\u0627 \u0645\u06cc \u06af\u06cc\u0631\u062f \u0648 \u0628\u0647 \u0639\u0646\u0648\u0627\u0646 \u0646\u0627\u0645 \u062c\u0644\u0633\u0647 \u0630\u062e\u06cc\u0631\u0647 \u0645\u06cc \u06a9\u0646\u062f.  \u0628\u0627 \u0627\u0633\u062a\u0641\u0627\u062f\u0647 \u0627\u0632 \u0631\u0648\u0634\u200c\u0647\u0627\u06cc \u06a9\u0631\u0648\u0645\u060c \u0627\u0632 \u0637\u0631\u06cc\u0642 \u0628\u0631\u06af\u0647\u200c\u0647\u0627\u06cc \u0628\u0627\u0632 \u067e\u0646\u062c\u0631\u0647 \u0641\u0639\u0644\u06cc \u062d\u0644\u0642\u0647 \u0645\u06cc\u200c\u0632\u0646\u06cc\u0645.  \u0633\u067e\u0633 \u06cc\u06a9 \u0646\u0642\u0634\u0647 \u0627\u06cc\u062c\u0627\u062f \u06a9\u0646\u06cc\u062f \u0648 \u06cc\u06a9 \u067e\u06cc\u0627\u0645 \u0627\u0631\u0633\u0627\u0644 \u06a9\u0646\u06cc\u062f background.js \u0628\u0631\u0627\u06cc \u0630\u062e\u06cc\u0631\u0647 \u062c\u0644\u0633\u0627\u062a \u062f\u0631 \u062d\u0627\u0641\u0638\u0647 \u0645\u062d\u0644\u06cc.  \u0645\u0627 \u0631\u0627 \u062a\u062d\u0631\u06cc\u06a9 \u0645\u06cc \u06a9\u0646\u06cc\u0645 loadSession \u0628\u0631\u0627\u06cc \u0628\u0627\u0631\u06af\u06cc\u0631\u06cc \u0645\u062c\u062f\u062f \u0644\u06cc\u0633\u062a \u0648 \u0645\u0646\u0639\u06a9\u0633 \u06a9\u0631\u062f\u0646 \u0645\u0648\u0631\u062f \u062c\u062f\u06cc\u062f.<br \/>\n\u06cc\u06a9 \u0634\u0646\u0648\u0646\u062f\u0647 \u0628\u0631\u0627\u06cc \u0631\u0633\u06cc\u062f\u06af\u06cc \u0627\u0636\u0627\u0641\u0647 \u0645\u06cc \u06a9\u0646\u06cc\u0645 refreshSessions \u067e\u06cc\u0627\u0645 \u0647\u0627 \u0627\u0632 background.js.<br \/>\n\u062f\u0631 \u0646\u0647\u0627\u06cc\u062a\u060c \u0645\u0627 \u0627\u06cc\u0646 \u0631\u0648\u0634 \u0631\u0627 \u062f\u0631 \u0627\u0648\u0644\u06cc\u0646 \u0628\u0627\u0631 \u0628\u0631\u0627\u06cc \u0646\u0645\u0627\u06cc\u0634 \u062c\u0644\u0633\u0627\u062a \u0645\u0648\u062c\u0648\u062f \u0641\u0639\u0627\u0644 \u0645\u06cc \u06a9\u0646\u06cc\u0645.<\/p>\n<p>  \u0646\u0645\u0627\u062f\u0647\u0627<\/p>\n<p>\u0633\u0647 \u0627\u0646\u062f\u0627\u0632\u0647 \u0646\u0645\u0627\u062f \u0631\u0627 \u0622\u0645\u0627\u062f\u0647 \u06a9\u0646\u06cc\u062f: 16&#215;16\u060c 48&#215;48\u060c \u0648 128&#215;128 \u067e\u06cc\u06a9\u0633\u0644.  \u0627\u06cc\u0646\u0647\u0627 \u0628\u0631\u0627\u06cc \u0646\u0648\u0627\u0631 \u0627\u0628\u0632\u0627\u0631 \u06a9\u0631\u0648\u0645 \u0648 \u0641\u0631\u0648\u0634\u06af\u0627\u0647 \u0648\u0628 \u06a9\u0631\u0648\u0645 \u0647\u0633\u062a\u0646\u062f.<\/p>\n<p>\u0627\u0628\u0632\u0627\u0631\u0647\u0627\u06cc \u0631\u0627\u06cc\u06af\u0627\u0646\u06cc \u0645\u0627\u0646\u0646\u062f resizeimage.net\u060c \u0645\u0648\u0644\u062f \u0622\u06cc\u06a9\u0648\u0646 \u0647\u0648\u0634 \u0645\u0635\u0646\u0648\u0639\u06cc \u0648 FreeConvert \u0631\u0627 \u062c\u0633\u062a\u062c\u0648 \u06a9\u0646\u06cc\u062f.  \u0628\u0631\u0627\u06cc \u0627\u06cc\u062c\u0627\u062f \u0648 \u062a\u063a\u06cc\u06cc\u0631 \u0627\u0646\u062f\u0627\u0632\u0647 \u0622\u06cc\u06a9\u0648\u0646 \u0647\u0627\u06cc \u062e\u0648\u062f.<\/p>\n<p>  \u0633\u0628\u06a9 \u0647\u0627<\/p>\n<p>\u0627\u0633\u062a\u0627\u06cc\u0644 \u067e\u0646\u062c\u0631\u0647 \u0631\u0627 \u0628\u0627 popup.css \u06a9\u0627\u0631\u0628\u0631 \u067e\u0633\u0646\u062f \u0648 \u0635\u0627\u0641 \u0628\u0647 \u0646\u0638\u0631 \u0628\u0631\u0633\u062f.  \u0641\u0627\u06cc\u0644 \u0631\u0627 \u0628\u0627\u0632 \u06a9\u0646\u06cc\u062f \u0648 \u06a9\u062f \u0632\u06cc\u0631 \u0631\u0627 \u0642\u0631\u0627\u0631 \u062f\u0647\u06cc\u062f:<\/p>\n<p>body {<br \/>\n    width: 300px;<br \/>\n    font-family: Arial, sans-serif;<br \/>\n}<\/p>\n<p>.title-container {<br \/>\n    border-bottom: 1px solid rgba(0, 0, 0, .06);<br \/>\n    display: flex;<br \/>\n    justify-content: flex-start;<br \/>\n    text-align: center;<br \/>\n    align-items: center;<br \/>\n}<\/p>\n<p>.title {<br \/>\n    margin-left: 4px;<br \/>\n}<\/p>\n<p>.input-container {<br \/>\n    margin-top: 4px;<br \/>\n    padding-bottom: 10px;<br \/>\n}<\/p>\n<p>.input {<br \/>\n    border: 1px solid lightgray;<br \/>\n    box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.1);<br \/>\n    margin-right: 5px;<br \/>\n    border-radius: 4px;<br \/>\n    font-size: larger;<br \/>\n    padding-top: 4px;<br \/>\n    padding-bottom: 4px;<br \/>\n    padding-left: 4px;<br \/>\n}<\/p>\n<p>input:focus-visible,<br \/>\nbutton:focus-visible {<br \/>\n    outline: 1px solid #007bff;<br \/>\n    outline-offset: 0px;<br \/>\n}<\/p>\n<p>button {<br \/>\n    box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.1);<br \/>\n    border: none;<br \/>\n    padding: 5px 10px;<br \/>\n    cursor: pointer;<br \/>\n    border-radius: 4px;<br \/>\n}<\/p>\n<p>.save-session-btn {<br \/>\n    background-color: #007bff;<br \/>\n    color: #ffffff;<br \/>\n}<\/p>\n<p>.save-session-btn:hover,<br \/>\n.save-session-btn:active,<br \/>\n.save-session-btn:focus,<br \/>\n.save-session-btn:focus-visible {<br \/>\n    background-color: #0056b3;<br \/>\n}<\/p>\n<p>.sessions-list {<br \/>\n    padding-inline-start: 20px;<br \/>\n}<\/p>\n<p>.session {<br \/>\n    display: flex;<br \/>\n    align-items: center;<br \/>\n    margin-bottom: 15px;<br \/>\n    padding-left: 5px;<br \/>\n}<\/p>\n<p>.session::before {<br \/>\n    content: &#8220;\\2022&#8221;;<br \/>\n    display: inline-block;<br \/>\n    width: 20px;<br \/>\n    margin-left: -25px;<br \/>\n    text-align: center;<br \/>\n}<\/p>\n<p>.session span {<br \/>\n    flex-grow: 1;<br \/>\n    font-weight: bold;<br \/>\n    font-size: larger;<br \/>\n}<\/p>\n<p>.session button {<br \/>\n    margin-left: 10px;<br \/>\n    background-color: #ffffff;<br \/>\n    color: #007bff;<br \/>\n    border: 1px solid #007bff;<br \/>\n}<\/p>\n<p>.session button:hover,<br \/>\n.session button:active,<br \/>\n.session button:focus,<br \/>\n.session button:focus-visible {<br \/>\n    background-color: #dbe5f2;<br \/>\n}<\/p>\n<p>    \u0648\u0627\u0631\u062f \u062d\u0627\u0644\u062a \u062a\u0645\u0627\u0645 \u0635\u0641\u062d\u0647 \u0634\u0648\u06cc\u062f<\/p>\n<p>    \u0627\u0632 \u062d\u0627\u0644\u062a \u062a\u0645\u0627\u0645 \u0635\u0641\u062d\u0647 \u062e\u0627\u0631\u062c \u0634\u0648\u06cc\u062f<\/p>\n<p>\u0628\u0631\u0627\u06cc \u0627\u06cc\u0646 \u0633\u0628\u06a9\u060c \u0645\u0627 \u0638\u0627\u0647\u0631\u06cc \u0645\u062f\u0631\u0646 \u0631\u0627 \u062f\u0631 \u0646\u0638\u0631 \u06af\u0631\u0641\u062a\u06cc\u0645:<\/p>\n<p>\u0639\u0631\u0636 \u0648 \u0641\u0648\u0646\u062a \u0633\u0641\u0627\u0631\u0634\u06cc \u0628\u0631\u0627\u06cc \u06a9\u0644 \u0628\u062f\u0646.<br \/>\n\u0645\u062d\u0641\u0638\u0647 \u0639\u0646\u0648\u0627\u0646 \u0645\u062a\u0646 \u0645\u062d\u0648\u0631 \u0628\u0627 \u062d\u0627\u0634\u06cc\u0647 \u06a9\u0645\u06cc \u062f\u0631 \u067e\u0627\u06cc\u06cc\u0646.<br \/>\n\u06cc\u06a9 \u062d\u0627\u0634\u06cc\u0647 \u06a9\u0648\u0686\u06a9 \u0628\u0631\u0627\u06cc \u062c\u062f\u0627 \u06a9\u0631\u062f\u0646 \u0639\u0646\u0648\u0627\u0646 \u0627\u0632 \u0646\u0645\u0627\u062f.<br \/>\n\u0633\u0628\u06a9 \u0647\u0627\u06cc \u0633\u0641\u0627\u0631\u0634\u06cc \u0628\u0631\u0627\u06cc \u0648\u0631\u0648\u062f\u06cc \u0648 \u062f\u06a9\u0645\u0647 \u0647\u0627\u060c \u0627\u0632 \u062c\u0645\u0644\u0647 \u06af\u0648\u0634\u0647 \u0647\u0627\u06cc \u06af\u0631\u062f\u060c \u06a9\u0645\u06cc \u0633\u0627\u06cc\u0647 \u0648 \u062e\u0637\u0648\u0637 \u0622\u0628\u06cc.  \u062f\u0648 \u062f\u06a9\u0645\u0647 \u0648\u062c\u0648\u062f \u062f\u0627\u0631\u062f: \u06cc\u06a9\u06cc \u0622\u0628\u06cc \u0631\u0646\u06af \u0648 \u062f\u06cc\u06af\u0631\u06cc \u0628\u0627 \u062e\u0637\u0648\u0637 \u0622\u0628\u06cc.<br \/>\n\u0645\u0648\u0642\u0639\u06cc\u062a \u06cc\u0627\u0628\u06cc \u0627\u0646\u0639\u0637\u0627\u0641 \u067e\u0630\u06cc\u0631\u060c \u0627\u06cc\u062c\u0627\u062f \u0622\u06cc\u062a\u0645 \u0647\u0627\u06cc \u0641\u0647\u0631\u0633\u062a\u060c \u0641\u0636\u0627\u06cc\u06cc \u0645\u0634\u0627\u0628\u0647 \u06cc\u06a9 \u0633\u062a\u0648\u0646 \u0628\u0627 \u0631\u0634\u062f \u0627\u0646\u0639\u0637\u0627\u0641 \u067e\u0630\u06cc\u0631 \u062f\u0627\u0631\u062f.  \u0627\u0632 \u0622\u0646\u062c\u0627\u06cc\u06cc \u06a9\u0647 &#8220;flex&#8221; \u0622\u06cc\u062a\u0645 \u0647\u0627\u06cc \u0644\u06cc\u0633\u062a \u0645\u0627 \u0631\u0627 \u0645\u06cc \u0634\u06a9\u0646\u062f\u060c \u0646\u0645\u0627\u062f \u0622\u06cc\u062a\u0645 \u0644\u06cc\u0633\u062a \u0631\u0627 \u0642\u0628\u0644 \u0627\u0632 \u0647\u0631 \u06a9\u062f\u0627\u0645 \u0627\u0636\u0627\u0641\u0647 \u06a9\u0631\u062f\u06cc\u0645.<\/p>\n<p>  \u0622\u0632\u0645\u0627\u06cc\u0634 \u06a9\u0631\u062f\u0646<\/p>\n<p>\u0628\u0631\u0627\u06cc \u0622\u0632\u0645\u0627\u06cc\u0634 \u0628\u0631\u0646\u0627\u0645\u0647 \u0627\u0641\u0632\u0648\u062f\u0646\u06cc \u062e\u0648\u062f:<\/p>\n<p>1. \u0628\u0647 \u0635\u0641\u062d\u0647 \u0627\u0641\u0632\u0648\u0646\u0647 \u06a9\u0631\u0648\u0645 (chrome:\/\/extensions\/) \u0628\u0631\u0648\u06cc\u062f.<\/p>\n<p>2. \u062d\u0627\u0644\u062a \u062a\u0648\u0633\u0639\u0647 \u062f\u0647\u0646\u062f\u0647 \u0631\u0627 \u0641\u0639\u0627\u0644 \u06a9\u0646\u06cc\u062f.<\/p>\n<p>3. \u0631\u0648\u06cc &#8220;Load unpacked&#8221; \u06a9\u0644\u06cc\u06a9 \u06a9\u0646\u06cc\u062f \u0648 \u062f\u0627\u06cc\u0631\u06a9\u062a\u0648\u0631\u06cc \u067e\u0631\u0648\u0698\u0647 \u062e\u0648\u062f \u0631\u0627 \u0627\u0646\u062a\u062e\u0627\u0628 \u06a9\u0646\u06cc\u062f.  \u0627\u06a9\u0646\u0648\u0646 \u0627\u0641\u0632\u0648\u0646\u0647 \u0634\u0645\u0627 \u0628\u0627\u06cc\u062f \u062f\u0631 \u06a9\u0631\u0648\u0645 \u0642\u0627\u0628\u0644 \u0645\u0634\u0627\u0647\u062f\u0647 \u0628\u0627\u0634\u062f.<\/p>\n<p>  \u062f\u0631 \u062d\u0627\u0644 \u0627\u0633\u062a\u0642\u0631\u0627\u0631 \u062f\u0631 \u0641\u0631\u0648\u0634\u06af\u0627\u0647 \u0648\u0628 Chrome<\/p>\n<p>\u0627\u0633\u062a\u0642\u0631\u0627\u0631 \u062f\u0631 \u0641\u0631\u0648\u0634\u06af\u0627\u0647 \u0648\u0628 Chrome \u0633\u0627\u062f\u0647 \u0627\u0633\u062a.  \u0628\u0647 \u062f\u0644\u06cc\u0644 \u0641\u0631\u0622\u06cc\u0646\u062f \u0628\u0631\u0631\u0633\u06cc \u06af\u0648\u06af\u0644\u060c \u0628\u0647 \u062c\u0632\u0626\u06cc\u0627\u062a \u0646\u06cc\u0627\u0632 \u062f\u0627\u0631\u062f.  \u0627\u06cc\u0646 \u0645\u0631\u0627\u062d\u0644 \u0631\u0627 \u062f\u0646\u0628\u0627\u0644 \u06a9\u0646\u06cc\u062f:<\/p>\n<p>1. Zip Your Application: \u0645\u0637\u0645\u0626\u0646 \u0634\u0648\u06cc\u062f \u06a9\u0647 \u067e\u0631\u0648\u0698\u0647 \u0634\u0645\u0627 \u0627\u0632 \u0633\u0627\u062e\u062a\u0627\u0631 \u062f\u0631\u0633\u062a \u067e\u0648\u0634\u0647 \u067e\u06cc\u0631\u0648\u06cc \u0645\u06cc \u06a9\u0646\u062f. manifest.json \u0628\u0627\u06cc\u062f \u062f\u0631 \u0631\u06cc\u0634\u0647 \u0628\u0627\u0634\u062f<\/p>\n<p>2. \u062a\u0646\u0638\u06cc\u0645 \u06cc\u06a9 \u062d\u0633\u0627\u0628 \u0628\u0631\u0646\u0627\u0645\u0647\u200c\u0646\u0648\u06cc\u0633: \u0628\u0647 \u062f\u0627\u0634\u0628\u0648\u0631\u062f \u0628\u0631\u0646\u0627\u0645\u0647\u200c\u0646\u0648\u06cc\u0633 \u0641\u0631\u0648\u0634\u06af\u0627\u0647 \u0648\u0628 Chrome \u0628\u0631\u0648\u06cc\u062f.  \u0633\u067e\u0633 \u0628\u0631\u0627\u06cc \u0627\u0646\u062a\u0634\u0627\u0631 \u0628\u0631\u0646\u0627\u0645\u0647 \u0647\u0627\u06cc \u0627\u0641\u0632\u0648\u062f\u0646\u06cc \u06cc\u06a9 \u0628\u0627\u0631 \u0647\u0632\u06cc\u0646\u0647 5 \u062f\u0644\u0627\u0631\u06cc \u0628\u067e\u0631\u062f\u0627\u0632\u06cc\u062f.<\/p>\n<p>3. \u0628\u0631\u0646\u0627\u0645\u0647 \u0627\u0641\u0632\u0648\u062f\u0646\u06cc \u062e\u0648\u062f \u0631\u0627 \u0622\u067e\u0644\u0648\u062f \u06a9\u0646\u06cc\u062f: \u0631\u0648\u06cc \u00ab\u0627\u0641\u0632\u0648\u062f\u0646 \u0645\u0648\u0631\u062f \u062c\u062f\u06cc\u062f\u00bb \u06a9\u0644\u06cc\u06a9 \u06a9\u0646\u06cc\u062f\u060c \u0641\u0627\u06cc\u0644 \u0641\u0634\u0631\u062f\u0647 \u062e\u0648\u062f \u0631\u0627 \u0622\u067e\u0644\u0648\u062f \u06a9\u0646\u06cc\u062f.  \u062c\u0632\u0626\u06cc\u0627\u062a \u0645\u0648\u0631\u062f \u0646\u06cc\u0627\u0632 \u0645\u0627\u0646\u0646\u062f \u0639\u0646\u0648\u0627\u0646\u060c \u062a\u0648\u0636\u06cc\u062d\u0627\u062a \u0648 \u0633\u06cc\u0627\u0633\u062a \u062d\u0641\u0638 \u062d\u0631\u06cc\u0645 \u062e\u0635\u0648\u0635\u06cc \u0631\u0627 \u067e\u0631 \u06a9\u0646\u06cc\u062f.<\/p>\n<p>4. \u0627\u0631\u0633\u0627\u0644 \u0628\u0631\u0627\u06cc \u0628\u0631\u0631\u0633\u06cc: \u067e\u0633 \u0627\u0632 \u062a\u06a9\u0645\u06cc\u0644 \u0641\u0631\u0645\u060c \u067e\u0633\u0648\u0646\u062f \u062e\u0648\u062f \u0631\u0627 \u0628\u0631\u0627\u06cc \u0628\u0631\u0631\u0633\u06cc \u0627\u0631\u0633\u0627\u0644 \u06a9\u0646\u06cc\u062f.  \u0627\u06cc\u0646 \u0641\u0631\u0622\u06cc\u0646\u062f \u0645\u06cc \u062a\u0648\u0627\u0646\u062f \u0627\u0632 \u0686\u0646\u062f \u0633\u0627\u0639\u062a \u062a\u0627 \u0686\u0646\u062f \u0631\u0648\u0632 \u0637\u0648\u0644 \u0628\u06a9\u0634\u062f.  \u067e\u0633 \u0627\u0632 \u0628\u0631\u0631\u0633\u06cc\u060c \u06cc\u06a9 \u0627\u06cc\u0645\u06cc\u0644 \u0628\u0631\u0627\u06cc \u0634\u0645\u0627 \u0627\u0631\u0633\u0627\u0644 \u062e\u0648\u0627\u0647\u062f \u0634\u062f.<\/p>\n<p>  \u0628\u0647\u0628\u0648\u062f\u0647\u0627<\/p>\n<p>\u0628\u0631\u0627\u06cc \u0628\u0647\u0628\u0648\u062f \u0628\u0631\u0646\u0627\u0645\u0647 \u0627\u0641\u0632\u0648\u062f\u0646\u06cc \u062e\u0648\u062f\u060c \u0627\u06cc\u0646 \u0648\u06cc\u0698\u06af\u06cc\u200c\u0647\u0627 \u0631\u0627 \u0627\u0636\u0627\u0641\u0647 \u06a9\u0646\u06cc\u062f:<\/p>\n<p>\u062a\u063a\u06cc\u06cc\u0631 \u0646\u0627\u0645 \u062c\u0644\u0633\u0627\u062a \u06cc\u0627 \u0633\u0627\u0632\u0645\u0627\u0646\u062f\u0647\u06cc \u062c\u0644\u0633\u0627\u062a \u0628\u0647 \u062f\u0633\u062a\u0647 \u0647\u0627.<br \/>\n\u067e\u06cc\u0627\u062f\u0647 \u0633\u0627\u0632\u06cc \u0645\u0648\u0627\u0631\u062f \u062a\u0633\u062a \u0628\u0631\u0627\u06cc \u0641\u0627\u06cc\u0644 \u0627\u0633\u06a9\u0631\u06cc\u067e\u062a \u0634\u0645\u0627.<br \/>\n\u062a\u0639\u0627\u0645\u0644 \u0628\u0627 \u06a9\u0627\u0631\u0628\u0631\u0627\u0646 \u0628\u0631\u0627\u06cc \u062c\u0645\u0639 \u0622\u0648\u0631\u06cc \u0628\u0627\u0632\u062e\u0648\u0631\u062f \u0648 \u0628\u0647\u0628\u0648\u062f \u0628\u0631\u0646\u0627\u0645\u0647 \u0627\u0641\u0632\u0648\u062f\u0646\u06cc.<br \/>\n\u0628\u0627 \u0627\u0631\u0627\u0626\u0647 \u0646\u0633\u062e\u0647 \u0645\u0645\u062a\u0627\u0632 \u0628\u0627 \u0648\u06cc\u0698\u06af\u06cc\u200c\u0647\u0627\u06cc \u0627\u0636\u0627\u0641\u06cc\u060c \u0627\u0632 \u0628\u0631\u0646\u0627\u0645\u0647 \u0627\u0641\u0632\u0648\u062f\u0646\u06cc \u062e\u0648\u062f \u062f\u0631\u0622\u0645\u062f \u06a9\u0633\u0628 \u06a9\u0646\u06cc\u062f.<\/p>\n<p>  \u0646\u062a\u06cc\u062c\u0647<\/p>\n<p>\u062a\u0628\u0631\u06cc\u06a9 \u0645\u06cc\u200c\u06af\u0648\u06cc\u06cc\u0645\u060c \u0634\u0645\u0627 \u0645\u0648\u0641\u0642 \u0628\u0647 \u0627\u06cc\u062c\u0627\u062f \u06cc\u06a9 \u0627\u0641\u0632\u0648\u0646\u0647 Chrome \u0634\u062f\u06cc\u062f!  \u0639\u0645\u0644\u06a9\u0631\u062f \u0648 \u0627\u0633\u062a\u0627\u06cc\u0644 \u06a9\u0627\u0645\u0644 \u0631\u0627 \u0627\u0636\u0627\u0641\u0647 \u06a9\u0631\u062f \u0648 \u062f\u0631 \u0641\u0631\u0648\u0634\u06af\u0627\u0647 \u0648\u0628 Chrome \u0645\u0646\u062a\u0634\u0631 \u06a9\u0631\u062f.  \u0628\u0627 \u062f\u0646\u0628\u0627\u0644 \u06a9\u0631\u062f\u0646 \u0627\u06cc\u0646 \u0631\u0627\u0647\u0646\u0645\u0627\u060c \u0645\u0631\u0627\u062d\u0644 \u062a\u0648\u0633\u0639\u0647 \u0648 \u0627\u0633\u062a\u0642\u0631\u0627\u0631 \u0628\u0631\u0646\u0627\u0645\u0647 \u0647\u0627\u06cc \u0627\u0641\u0632\u0648\u062f\u0646\u06cc \u0631\u0627 \u06cc\u0627\u062f \u06af\u0631\u0641\u062a\u0647 \u0627\u06cc\u062f.  \u0628\u0647 \u0622\u0632\u0645\u0627\u06cc\u0634 \u0648 \u062a\u0642\u0648\u06cc\u062a \u0628\u0631\u0646\u0627\u0645\u0647 \u0627\u0641\u0632\u0648\u062f\u0646\u06cc \u062e\u0648\u062f \u0627\u062f\u0627\u0645\u0647 \u062f\u0647\u06cc\u062f \u062a\u0627 \u0622\u0646 \u0631\u0627 \u062d\u062a\u06cc \u0645\u0641\u06cc\u062f\u062a\u0631 \u06a9\u0646\u06cc\u062f.<\/p>\n<p>\u0644\u06cc\u0646\u06a9 \u0627\u0641\u0632\u0648\u0646\u0647 \u0639\u0645\u0648\u0645\u06cc<\/p>\n<p>\u0645\u062e\u0632\u0646 \u06a9\u062f<\/p>\n<div data-article-id=\"1928947\" id=\"article-body\">\n<div id=\"ez-toc-container\" class=\"ez-toc-v2_0_85 counter-hierarchy ez-toc-counter-rtl ez-toc-grey ez-toc-container-direction\">\n<div class=\"ez-toc-title-container\">\n<p class=\"ez-toc-title\" style=\"cursor:inherit\">\u0641\u0647\u0631\u0633\u062a \u0645\u0637\u0627\u0644\u0628<\/p>\n<span class=\"ez-toc-title-toggle\"><a href=\"#\" class=\"ez-toc-pull-right ez-toc-btn ez-toc-btn-xs ez-toc-btn-default ez-toc-toggle\" aria-label=\"Toggle Table of Content\"><span class=\"ez-toc-js-icon-con\"><span class=\"\"><span class=\"eztoc-hide\" style=\"display:none;\">Toggle<\/span><span class=\"ez-toc-icon-toggle-span\"><svg style=\"fill: #999;color:#999\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" class=\"list-377408\" width=\"20px\" height=\"20px\" viewBox=\"0 0 24 24\" fill=\"none\"><path d=\"M6 6H4v2h2V6zm14 0H8v2h12V6zM4 11h2v2H4v-2zm16 0H8v2h12v-2zM4 16h2v2H4v-2zm16 0H8v2h12v-2z\" fill=\"currentColor\"><\/path><\/svg><svg style=\"fill: #999;color:#999\" class=\"arrow-unsorted-368013\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"10px\" height=\"10px\" viewBox=\"0 0 24 24\" version=\"1.2\" baseProfile=\"tiny\"><path d=\"M18.2 9.3l-6.2-6.3-6.2 6.3c-.2.2-.3.4-.3.7s.1.5.3.7c.2.2.4.3.7.3h11c.3 0 .5-.1.7-.3.2-.2.3-.5.3-.7s-.1-.5-.3-.7zM5.8 14.7l6.2 6.3 6.2-6.3c.2-.2.3-.5.3-.7s-.1-.5-.3-.7c-.2-.2-.4-.3-.7-.3h-11c-.3 0-.5.1-.7.3-.2.2-.3.5-.3.7s.1.5.3.7z\"\/><\/svg><\/span><\/span><\/span><\/a><\/span><\/div>\n<nav><ul class='ez-toc-list ez-toc-list-level-1 ' ><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-1\" href=\"https:\/\/nabfollower.com\/blog\/how-to-build-and-publish-a-chrome-extension-step-by-step-guide-to-creating-a-custom-session-saver-1j80\/#%D9%85%D8%B9%D8%B1%D9%81%DB%8C\" >\u0645\u0639\u0631\u0641\u06cc<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-2\" href=\"https:\/\/nabfollower.com\/blog\/how-to-build-and-publish-a-chrome-extension-step-by-step-guide-to-creating-a-custom-session-saver-1j80\/#%D8%B1%D8%A7%D9%87_%D8%A7%D9%86%D8%AF%D8%A7%D8%B2%DB%8C_%D9%BE%D8%B1%D9%88%DA%98%D9%87\" >\u0631\u0627\u0647 \u0627\u0646\u062f\u0627\u0632\u06cc \u067e\u0631\u0648\u0698\u0647<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-3\" href=\"https:\/\/nabfollower.com\/blog\/how-to-build-and-publish-a-chrome-extension-step-by-step-guide-to-creating-a-custom-session-saver-1j80\/#%D9%81%D8%A7%DB%8C%D9%84_%D9%85%D8%A7%D9%86%DB%8C%D9%81%D8%B3%D8%AA\" >\u0641\u0627\u06cc\u0644 \u0645\u0627\u0646\u06cc\u0641\u0633\u062a<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-4\" href=\"https:\/\/nabfollower.com\/blog\/how-to-build-and-publish-a-chrome-extension-step-by-step-guide-to-creating-a-custom-session-saver-1j80\/#%D8%A7%D8%B3%DA%A9%D8%B1%DB%8C%D9%BE%D8%AA_%D9%BE%D8%B3_%D8%B2%D9%85%DB%8C%D9%86%D9%87\" >\u0627\u0633\u06a9\u0631\u06cc\u067e\u062a \u067e\u0633 \u0632\u0645\u06cc\u0646\u0647<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-5\" href=\"https:\/\/nabfollower.com\/blog\/how-to-build-and-publish-a-chrome-extension-step-by-step-guide-to-creating-a-custom-session-saver-1j80\/#%D8%B1%D8%A7%D8%A8%D8%B7_%DA%A9%D8%A7%D8%B1%D8%A8%D8%B1%DB%8C\" >\u0631\u0627\u0628\u0637 \u06a9\u0627\u0631\u0628\u0631\u06cc<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-6\" href=\"https:\/\/nabfollower.com\/blog\/how-to-build-and-publish-a-chrome-extension-step-by-step-guide-to-creating-a-custom-session-saver-1j80\/#%D8%A7%D8%B3%DA%A9%D8%B1%DB%8C%D9%BE%D8%AA\" >\u0627\u0633\u06a9\u0631\u06cc\u067e\u062a<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-7\" href=\"https:\/\/nabfollower.com\/blog\/how-to-build-and-publish-a-chrome-extension-step-by-step-guide-to-creating-a-custom-session-saver-1j80\/#%D9%86%D9%85%D8%A7%D8%AF%D9%87%D8%A7\" >\u0646\u0645\u0627\u062f\u0647\u0627<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-8\" href=\"https:\/\/nabfollower.com\/blog\/how-to-build-and-publish-a-chrome-extension-step-by-step-guide-to-creating-a-custom-session-saver-1j80\/#%D8%B3%D8%A8%DA%A9_%D9%87%D8%A7\" >\u0633\u0628\u06a9 \u0647\u0627<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-9\" href=\"https:\/\/nabfollower.com\/blog\/how-to-build-and-publish-a-chrome-extension-step-by-step-guide-to-creating-a-custom-session-saver-1j80\/#%D8%A2%D8%B2%D9%85%D8%A7%DB%8C%D8%B4_%DA%A9%D8%B1%D8%AF%D9%86\" >\u0622\u0632\u0645\u0627\u06cc\u0634 \u06a9\u0631\u062f\u0646<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-10\" href=\"https:\/\/nabfollower.com\/blog\/how-to-build-and-publish-a-chrome-extension-step-by-step-guide-to-creating-a-custom-session-saver-1j80\/#%D8%AF%D8%B1_%D8%AD%D8%A7%D9%84_%D8%A7%D8%B3%D8%AA%D9%82%D8%B1%D8%A7%D8%B1_%D8%AF%D8%B1_%D9%81%D8%B1%D9%88%D8%B4%DA%AF%D8%A7%D9%87_%D9%88%D8%A8_Chrome\" >\u062f\u0631 \u062d\u0627\u0644 \u0627\u0633\u062a\u0642\u0631\u0627\u0631 \u062f\u0631 \u0641\u0631\u0648\u0634\u06af\u0627\u0647 \u0648\u0628 Chrome<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-11\" href=\"https:\/\/nabfollower.com\/blog\/how-to-build-and-publish-a-chrome-extension-step-by-step-guide-to-creating-a-custom-session-saver-1j80\/#%D8%A8%D9%87%D8%A8%D9%88%D8%AF%D9%87%D8%A7\" >\u0628\u0647\u0628\u0648\u062f\u0647\u0627<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-12\" href=\"https:\/\/nabfollower.com\/blog\/how-to-build-and-publish-a-chrome-extension-step-by-step-guide-to-creating-a-custom-session-saver-1j80\/#%D9%86%D8%AA%DB%8C%D8%AC%D9%87\" >\u0646\u062a\u06cc\u062c\u0647<\/a><\/li><\/ul><\/nav><\/div>\n<h3><span class=\"ez-toc-section\" id=\"%D9%85%D8%B9%D8%B1%D9%81%DB%8C\"><\/span>\n<p>  \u0645\u0639\u0631\u0641\u06cc<br \/>\n<span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p>\u0627\u06cc\u062c\u0627\u062f \u06cc\u06a9 \u0627\u0641\u0632\u0648\u0646\u0647 \u06a9\u0631\u0648\u0645 \u062f\u0631 \u0627\u0628\u062a\u062f\u0627 \u0645\u06cc \u062a\u0648\u0627\u0646\u062f \u062f\u0644\u0647\u0631\u0647 \u0622\u0648\u0631 \u0628\u0647 \u0646\u0638\u0631 \u0628\u0631\u0633\u062f.  \u0627\u0645\u0627 \u0628\u0627 \u0631\u0627\u0647\u0646\u0645\u0627\u06cc\u06cc \u0635\u062d\u06cc\u062d\u060c \u0642\u0627\u0628\u0644 \u0645\u062f\u06cc\u0631\u06cc\u062a \u0627\u0633\u062a.  \u0627\u06cc\u0646 \u0631\u0627\u0647\u0646\u0645\u0627 \u0634\u0645\u0627 \u0631\u0627 \u062f\u0631 \u0633\u0627\u062e\u062a \u0648 \u0627\u0646\u062a\u0634\u0627\u0631 \u0627\u0641\u0632\u0648\u0646\u0647 \u06a9\u0631\u0648\u0645 \u0631\u0627\u0647\u0646\u0645\u0627\u06cc\u06cc \u0645\u06cc \u06a9\u0646\u062f.  &#8220;Custom Session Saver&#8221; \u0646\u0627\u0645\u06cc\u062f\u0647 \u0645\u06cc \u0634\u0648\u062f.  \u0627\u06cc\u0646 \u0627\u0641\u0632\u0648\u0646\u0647 \u0628\u0647 \u06a9\u0627\u0631\u0628\u0631\u0627\u0646 \u0627\u0645\u06a9\u0627\u0646 \u0630\u062e\u06cc\u0631\u0647 \u0648 \u0628\u0627\u0632\u06cc\u0627\u0628\u06cc \u062c\u0644\u0633\u0627\u062a \u0633\u0641\u0627\u0631\u0634\u06cc \u0631\u0627 \u0645\u06cc \u062f\u0647\u062f.  \u0628\u0647 \u0639\u0646\u0648\u0627\u0646 \u0645\u062b\u0627\u0644\u060c &#8220;\u06a9\u0627\u0631&#8221;\u060c &#8220;\u0634\u062e\u0635\u06cc&#8221;\u060c &#8220;\u062a\u0648\u0633\u0639\u0647&#8221;\u060c \u0648 \u063a\u06cc\u0631\u0647.<\/p>\n<p><strong>\u062f\u0631 \u067e\u0627\u06cc\u0627\u0646 \u0627\u06cc\u0646 \u0631\u0627\u0647\u0646\u0645\u0627\u060c \u06cc\u06a9 \u0627\u0641\u0632\u0648\u0646\u0647 \u06a9\u0627\u0631\u0628\u0631\u062f\u06cc \u06a9\u0631\u0648\u0645\u060c \u0622\u0645\u0627\u062f\u0647 \u0628\u0631\u0627\u06cc \u0627\u0646\u062a\u0634\u0627\u0631 \u062e\u0648\u0627\u0647\u06cc\u062f \u062f\u0627\u0634\u062a.<\/strong><\/p>\n<p><\/p>\n<h3><span class=\"ez-toc-section\" id=\"%D8%B1%D8%A7%D9%87_%D8%A7%D9%86%D8%AF%D8%A7%D8%B2%DB%8C_%D9%BE%D8%B1%D9%88%DA%98%D9%87\"><\/span>\n<p>  \u0631\u0627\u0647 \u0627\u0646\u062f\u0627\u0632\u06cc \u067e\u0631\u0648\u0698\u0647<br \/>\n<span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p>\u0628\u0627 \u0627\u06cc\u062c\u0627\u062f \u062f\u0627\u06cc\u0631\u06a9\u062a\u0648\u0631\u06cc \u0628\u0631\u0627\u06cc \u067e\u0631\u0648\u0698\u0647 \u062e\u0648\u062f \u0628\u0627 \u0646\u0627\u0645 &#8220;custom_session_storage&#8221; \u0634\u0631\u0648\u0639 \u06a9\u0646\u06cc\u062f.  \u062f\u0631 \u062f\u0627\u062e\u0644 \u0627\u06cc\u0646 \u062f\u0627\u06cc\u0631\u06a9\u062a\u0648\u0631\u06cc\u060c \u0633\u0627\u062e\u062a\u0627\u0631 \u067e\u0648\u0634\u0647 \u0632\u06cc\u0631 \u0631\u0627 \u0627\u06cc\u062c\u0627\u062f \u06a9\u0646\u06cc\u062f:<\/p>\n<div class=\"highlight js-code-highlight\">\n<pre class=\"highlight plaintext\"><code>\nproject\\_root\/\n\n\u2502\n\n\u251c\u2500\u2500 background.js          # Background script specified in manifest\n\n\u251c\u2500\u2500 images\/                # Directory for icons\n\n\u2502   \u251c\u2500\u2500 icon16.png         # 16x16 icon\n\n\u2502   \u251c\u2500\u2500 icon48.png         # 48x48 icon\n\n\u2502   \u2514\u2500\u2500 icon128.png        # 128x128 icon\n\n\u251c\u2500\u2500 manifest.json          # Chrome extension manifest file\n\n\u251c\u2500\u2500 popup.js          # popup script file\n\n\u251c\u2500\u2500 popup.css          # popup style file\n\n\u2514\u2500\u2500 popup.html             # Default popup HTML file\n\n<\/code><\/pre>\n<div class=\"highlight__panel js-actions-panel\">\n<div class=\"highlight__panel-action js-fullscreen-code-action\">\n    <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"20px\" height=\"20px\" viewbox=\"0 0 24 24\" class=\"highlight-action crayons-icon highlight-action--fullscreen-on\"><title>\u0648\u0627\u0631\u062f \u062d\u0627\u0644\u062a \u062a\u0645\u0627\u0645 \u0635\u0641\u062d\u0647 \u0634\u0648\u06cc\u062f<\/title>\n    <path d=\"M16 3h6v6h-2V5h-4V3zM2 3h6v2H4v4H2V3zm18 16v-4h2v6h-6v-2h4zM4 19h4v2H2v-6h2v4z\"\/>\n<\/svg><\/p>\n<p>    <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"20px\" height=\"20px\" viewbox=\"0 0 24 24\" class=\"highlight-action crayons-icon highlight-action--fullscreen-off\"><title>\u0627\u0632 \u062d\u0627\u0644\u062a \u062a\u0645\u0627\u0645 \u0635\u0641\u062d\u0647 \u062e\u0627\u0631\u062c \u0634\u0648\u06cc\u062f<\/title>\n    <path d=\"M18 7h4v2h-6V3h2v4zM8 9H2V7h4V3h2v6zm10 8v4h-2v-6h6v2h-4zM8 15v6H6v-4H2v-2h6z\"\/>\n<\/svg><\/p>\n<\/div>\n<\/div>\n<\/div>\n<h3><span class=\"ez-toc-section\" id=\"%D9%81%D8%A7%DB%8C%D9%84_%D9%85%D8%A7%D9%86%DB%8C%D9%81%D8%B3%D8%AA\"><\/span>\n<p>  \u0641\u0627\u06cc\u0644 \u0645\u0627\u0646\u06cc\u0641\u0633\u062a<br \/>\n<span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p>\u0628\u0627\u0632 \u06a9\u0646 <code>manifest.json<\/code> \u0648 \u06a9\u062f \u0632\u06cc\u0631 \u0631\u0627 \u0642\u0631\u0627\u0631 \u062f\u0647\u06cc\u062f:<\/p>\n<div class=\"highlight js-code-highlight\">\n<pre class=\"highlight plaintext\"><code>{\n    \"manifest_version\": 3,\n    \"name\": \"Custom Session Saver\",\n    \"version\": \"1.0\",\n    \"description\": \"Save and restore custom sessions, for example: 'Work', 'Personal', 'Development', etc.\",\n    \"permissions\": [\n        \"storage\",\n        \"tabs\"\n    ],\n    \"background\": {\n        \"service_worker\": \"background.js\"\n    },\n    \"action\": {\n        \"default_popup\": \"popup.html\"\n    },\n    \"icons\": {\n        \"16\": \"images\/icon16.png\",\n        \"48\": \"images\/icon48.png\",\n        \"128\": \"images\/icon128.png\"\n    }\n}\n\n<\/code><\/pre>\n<div class=\"highlight__panel js-actions-panel\">\n<div class=\"highlight__panel-action js-fullscreen-code-action\">\n    <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"20px\" height=\"20px\" viewbox=\"0 0 24 24\" class=\"highlight-action crayons-icon highlight-action--fullscreen-on\"><title>\u0648\u0627\u0631\u062f \u062d\u0627\u0644\u062a \u062a\u0645\u0627\u0645 \u0635\u0641\u062d\u0647 \u0634\u0648\u06cc\u062f<\/title>\n    <path d=\"M16 3h6v6h-2V5h-4V3zM2 3h6v2H4v4H2V3zm18 16v-4h2v6h-6v-2h4zM4 19h4v2H2v-6h2v4z\"\/>\n<\/svg><\/p>\n<p>    <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"20px\" height=\"20px\" viewbox=\"0 0 24 24\" class=\"highlight-action crayons-icon highlight-action--fullscreen-off\"><title>\u0627\u0632 \u062d\u0627\u0644\u062a \u062a\u0645\u0627\u0645 \u0635\u0641\u062d\u0647 \u062e\u0627\u0631\u062c \u0634\u0648\u06cc\u062f<\/title>\n    <path d=\"M18 7h4v2h-6V3h2v4zM8 9H2V7h4V3h2v6zm10 8v4h-2v-6h6v2h-4zM8 15v6H6v-4H2v-2h6z\"\/>\n<\/svg><\/p>\n<\/div>\n<\/div>\n<\/div>\n<p>\u062f\u0631 \u0627\u06cc\u0646 \u0641\u0627\u06cc\u0644 \u0628\u0647 \u0635\u0648\u0631\u062a \u0632\u06cc\u0631 \u0639\u0645\u0644 \u0645\u06cc \u06a9\u0646\u06cc\u0645:<\/p>\n<ul>\n<li>\n<p>\u062a\u0639\u0631\u06cc\u0641 \u0646\u0633\u062e\u0647 \u0645\u0627\u0646\u06cc\u0641\u0633\u062a \u0645\u0648\u0631\u062f \u0627\u0633\u062a\u0641\u0627\u062f\u0647 \u0645\u0627.<\/p>\n<\/li>\n<li>\n<p>\u0646\u0627\u0645\u060c \u0646\u0633\u062e\u0647 \u0648 \u062a\u0648\u0636\u06cc\u062d\u0627\u062a \u0633\u0641\u0627\u0631\u0634\u06cc \u062e\u0648\u062f \u0631\u0627 \u0628\u0647 \u0622\u0646 \u0645\u06cc \u062f\u0647\u06cc\u0645.<\/p>\n<\/li>\n<li>\n<p>\u0627\u0636\u0627\u0641\u0647 \u06a9\u0631\u062f\u0646 \u0645\u062c\u0648\u0632 \u0628\u0631\u0627\u06cc &#8220;\u0630\u062e\u06cc\u0631\u0647 \u0633\u0627\u0632\u06cc&#8221; \u0628\u0631\u0627\u06cc \u0630\u062e\u06cc\u0631\u0647 \u062f\u0627\u062f\u0647 \u0647\u0627\u06cc \u0645\u062d\u0644\u06cc \u0648 &#8220;\u0628\u0631\u06af\u0647 \u0647\u0627&#8221; \u0628\u0631\u0627\u06cc \u062f\u0633\u062a\u06a9\u0627\u0631\u06cc \u0628\u0631\u06af\u0647 \u0647\u0627.<\/p>\n<\/li>\n<li>\n<p>\u062a\u0646\u0638\u06cc\u0645 \u0627\u0633\u06a9\u0631\u06cc\u067e\u062a \u067e\u0633 \u0632\u0645\u06cc\u0646\u0647  \u0627\u06cc\u0646 \u0647\u0645\u0647 \u0639\u0645\u0644\u06a9\u0631\u062f\u0647\u0627 \u0628\u0631\u0627\u06cc \u0630\u062e\u06cc\u0631\u0647 \u0633\u0627\u0632\u06cc \u0628\u0631\u06af\u0647 \u0647\u0627 \u0648 \u062c\u0644\u0633\u0627\u062a \u0631\u0627 \u06a9\u0646\u062a\u0631\u0644 \u0645\u06cc \u06a9\u0646\u062f.<\/p>\n<\/li>\n<li>\n<p>\u062a\u0639\u0631\u06cc\u0641 \u0631\u0627\u0628\u0637 \u06a9\u0627\u0631\u0628\u0631\u06cc \u0628\u0631\u0627\u06cc \u067e\u0646\u062c\u0631\u0647 \u0628\u0627\u0632\u0634\u0648<\/p>\n<\/li>\n<li>\n<p>\u062a\u0646\u0638\u06cc\u0645 \u0646\u0645\u0627\u062f \u067e\u06cc\u0634 \u0641\u0631\u0636 \u0628\u0631\u0627\u06cc \u0627\u0646\u062f\u0627\u0632\u0647 \u0647\u0627\u06cc \u0632\u06cc\u0631: 16&#215;16\u060c 48&#215;48\u060c \u0648 128&#215;128.<\/p>\n<\/li>\n<\/ul>\n<h3><span class=\"ez-toc-section\" id=\"%D8%A7%D8%B3%DA%A9%D8%B1%DB%8C%D9%BE%D8%AA_%D9%BE%D8%B3_%D8%B2%D9%85%DB%8C%D9%86%D9%87\"><\/span>\n<p>  \u0627\u0633\u06a9\u0631\u06cc\u067e\u062a \u067e\u0633 \u0632\u0645\u06cc\u0646\u0647<br \/>\n<span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p>\u0627\u064a\u062c\u0627\u062f \u0643\u0631\u062f\u0646 <code>background.js<\/code> \u0628\u0631\u0627\u06cc \u0631\u0633\u06cc\u062f\u06af\u06cc \u0628\u0647 \u0641\u0631\u0622\u06cc\u0646\u062f\u0647\u0627\u06cc \u067e\u0633 \u0632\u0645\u06cc\u0646\u0647 \u0628\u0631\u0646\u0627\u0645\u0647 \u0627\u0641\u0632\u0648\u062f\u0646\u06cc.  \u0622\u0646 \u0631\u0627 \u0628\u0627\u0632 \u06a9\u0646\u06cc\u062f \u0648 \u06a9\u062f \u0632\u06cc\u0631 \u0631\u0627 \u0642\u0631\u0627\u0631 \u062f\u0647\u06cc\u062f:<\/p>\n<div class=\"highlight js-code-highlight\">\n<pre class=\"highlight plaintext\"><code>\nconsole.log(\"Background script loaded\");\n\nchrome.runtime.onInstalled.addListener(() =&gt; {\n  console.log(\"Extension installed\");\n});\n\nchrome.runtime.onMessage.addListener((message, sender, sendResponse) =&gt; {\n  if (message.action === \"saveSession\") {\n    chrome.storage.local.set({ [message.sessionName]: message.session }, () =&gt; {\n      console.log(`Session ${message.sessionName} saved.`);\n      chrome.runtime.sendMessage({ action: \"refreshSessions\" });\n      if (sendResponse) sendResponse();\n    });\n  } else if (message.action === \"openSession\") {\n    chrome.storage.local.get([message.sessionName], (result) =&gt; {\n      let session = result[message.sessionName];\n      if (session) {\n        session.forEach((tab) =&gt; {\n          chrome.tabs.create({ url: tab.url });\n        });\n      }\n    });\n  } else if (message.action === \"deleteSession\") {\n    chrome.storage.local.remove(message.sessionName, () =&gt; {\n      console.log(`Session ${message.sessionName} deleted.`);\n      chrome.runtime.sendMessage({ action: \"refreshSessions\" });\n      if (sendResponse) sendResponse();\n    });\n  }\n});\n<\/code><\/pre>\n<div class=\"highlight__panel js-actions-panel\">\n<div class=\"highlight__panel-action js-fullscreen-code-action\">\n    <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"20px\" height=\"20px\" viewbox=\"0 0 24 24\" class=\"highlight-action crayons-icon highlight-action--fullscreen-on\"><title>\u0648\u0627\u0631\u062f \u062d\u0627\u0644\u062a \u062a\u0645\u0627\u0645 \u0635\u0641\u062d\u0647 \u0634\u0648\u06cc\u062f<\/title>\n    <path d=\"M16 3h6v6h-2V5h-4V3zM2 3h6v2H4v4H2V3zm18 16v-4h2v6h-6v-2h4zM4 19h4v2H2v-6h2v4z\"\/>\n<\/svg><\/p>\n<p>    <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"20px\" height=\"20px\" viewbox=\"0 0 24 24\" class=\"highlight-action crayons-icon highlight-action--fullscreen-off\"><title>\u0627\u0632 \u062d\u0627\u0644\u062a \u062a\u0645\u0627\u0645 \u0635\u0641\u062d\u0647 \u062e\u0627\u0631\u062c \u0634\u0648\u06cc\u062f<\/title>\n    <path d=\"M18 7h4v2h-6V3h2v4zM8 9H2V7h4V3h2v6zm10 8v4h-2v-6h6v2h-4zM8 15v6H6v-4H2v-2h6z\"\/>\n<\/svg><\/p>\n<\/div>\n<\/div>\n<\/div>\n<p>\u062f\u0631 \u0627\u06cc\u0646\u062c\u0627 \u0645\u0627 \u06cc\u06a9 \u067e\u06cc\u0627\u0645 \u06af\u0632\u0627\u0631\u0634 \u06a9\u0646\u0633\u0648\u0644 \u0648 \u062a\u0639\u062f\u0627\u062f\u06cc \u0634\u0646\u0648\u0646\u062f\u0647 \u0631\u0648\u06cc\u062f\u0627\u062f \u0627\u0636\u0627\u0641\u0647 \u06a9\u0631\u062f\u06cc\u0645:<\/p>\n<p><strong>&#8211; onInstalled:<\/strong> \u067e\u0633 \u0627\u0632 \u0646\u0635\u0628\u060c \u0627\u06cc\u0646 \u0631\u0648\u06cc\u062f\u0627\u062f \u0641\u0639\u0627\u0644 \u0645\u06cc \u0634\u0648\u062f.  \u0627\u06cc\u0646 \u06af\u0632\u0627\u0631\u0634 \u0645\u06cc \u062f\u0647\u062f \u06a9\u0647 \u0646\u0635\u0628 \u0628\u0627 \u0645\u0648\u0641\u0642\u06cc\u062a \u0627\u0646\u062c\u0627\u0645 \u0634\u062f\u0647 \u0627\u0633\u062a.<\/p>\n<p><strong>&#8211; onMessage:<\/strong> \u0627\u06cc\u0646 \u0631\u0648\u06cc\u062f\u0627\u062f\u0647\u0627 \u0627\u0632 <code>popup.js<\/code>.  \u0627\u06af\u0631 \u067e\u06cc\u0627\u0645 &#8220;saveSession&#8221; \u0628\u0627\u0634\u062f\u060c \u062c\u0644\u0633\u0647 \u0631\u0627 \u062f\u0631 \u062d\u0627\u0641\u0638\u0647 \u0645\u062d\u0644\u06cc \u0630\u062e\u06cc\u0631\u0647 \u0645\u06cc \u06a9\u0646\u062f.  \u0627\u06af\u0631 \u067e\u06cc\u0627\u0645 \u00abopenSession\u00bb \u0628\u0627\u0634\u062f\u060c \u062f\u0631 \u0641\u0636\u0627\u06cc \u0630\u062e\u06cc\u0631\u0647\u200c\u0633\u0627\u0632\u06cc \u0645\u062d\u0644\u06cc \u0622\u0646 \u062c\u0644\u0633\u0647 \u062c\u0633\u062a\u062c\u0648 \u0645\u06cc\u200c\u0634\u0648\u062f \u0648 \u0628\u0631\u06af\u0647\u200c\u0647\u0627\u06cc \u062c\u062f\u06cc\u062f\u06cc \u0631\u0627 \u0628\u0631 \u0627\u0633\u0627\u0633 \u062f\u0627\u062f\u0647\u200c\u0647\u0627\u06cc \u0630\u062e\u06cc\u0631\u0647 \u0634\u062f\u0647 \u0628\u0627\u0632 \u0645\u06cc\u200c\u06a9\u0646\u062f.  \u062f\u0631 \u0646\u0647\u0627\u06cc\u062a\u060c \u0627\u06af\u0631 \u067e\u06cc\u0627\u0645 \u00abdeleteSession\u00bb \u0628\u0627\u0634\u062f\u060c \u0646\u0627\u0645 \u062c\u0644\u0633\u0647 \u0631\u0627 \u0627\u0632 \u0641\u0636\u0627\u06cc \u0630\u062e\u06cc\u0631\u0647\u200c\u0633\u0627\u0632\u06cc \u062d\u0630\u0641 \u0645\u06cc\u200c\u06a9\u0646\u062f.<\/p>\n<p><strong>&#8211; \u0627\u0631\u0633\u0627\u0644 \u067e\u06cc\u0627\u0645:<\/strong> \u0628\u0631\u0627\u06cc \u062c\u062f\u0627 \u06a9\u0631\u062f\u0646 \u0646\u06af\u0631\u0627\u0646\u06cc \u0647\u0627\u060c <code>popup.js<\/code> \u0645\u0646\u0637\u0642 \u062c\u0644\u0633\u0647 \u0631\u0641\u0631\u0634 \u0631\u0627 \u06a9\u0646\u062a\u0631\u0644 \u0645\u06cc \u06a9\u0646\u062f.  \u0647\u0646\u06af\u0627\u0645 \u0630\u062e\u06cc\u0631\u0647 \u06cc\u0627 \u062d\u0630\u0641\u060c \u0631\u0648\u06cc\u062f\u0627\u062f\u06cc \u0631\u0627 \u0627\u0631\u0633\u0627\u0644 \u0645\u06cc \u06a9\u0646\u06cc\u0645 \u06a9\u0647 <code>popup.js<\/code> \u0628\u0647 \u0646\u0648\u0633\u0627\u0632\u06cc \u06af\u0648\u0634 \u0645\u06cc \u062f\u0647\u062f \u0648 \u0622\u0646 \u0631\u0627 \u0641\u0639\u0627\u0644 \u0645\u06cc \u06a9\u0646\u062f.<\/p>\n<h3><span class=\"ez-toc-section\" id=\"%D8%B1%D8%A7%D8%A8%D8%B7_%DA%A9%D8%A7%D8%B1%D8%A8%D8%B1%DB%8C\"><\/span>\n<p>  \u0631\u0627\u0628\u0637 \u06a9\u0627\u0631\u0628\u0631\u06cc<br \/>\n<span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p>\u0631\u0627\u0628\u0637 \u06a9\u0627\u0631\u0628\u0631\u06cc \u0631\u0627 \u062f\u0631 \u0622\u0646 \u062a\u0646\u0638\u06cc\u0645 \u06a9\u0646\u06cc\u062f <code>popup.html<\/code>.  \u0641\u0627\u06cc\u0644 \u0631\u0627 \u0628\u0627\u0632 \u06a9\u0646\u06cc\u062f \u0648 \u06a9\u062f \u0632\u06cc\u0631 \u0631\u0627 \u0642\u0631\u0627\u0631 \u062f\u0647\u06cc\u062f:<\/p>\n<p>\u062f\u0631 \u0627\u06cc\u0646 \u0641\u0627\u06cc\u0644\u060c \u0645\u0633\u06cc\u0631 \u0627\u0633\u062a\u0627\u06cc\u0644 \u0648 \u0639\u0646\u0648\u0627\u0646 \u0627\u0641\u0632\u0648\u0646\u0647 \u062e\u0648\u062f \u0631\u0627 \u0627\u0636\u0627\u0641\u0647 \u06a9\u0631\u062f\u06cc\u0645.  \u062f\u0631 \u062f\u0627\u062e\u0644 \u062a\u06af \u0628\u062f\u0646\u0647\u060c \u0645\u0648\u0627\u0631\u062f \u0632\u06cc\u0631 \u0631\u0627 \u0642\u0631\u0627\u0631 \u062f\u0627\u062f\u06cc\u0645:<\/p>\n<ul>\n<li>\n<p>\u0647\u062f\u0631 \u0628\u0627 \u0646\u0645\u0627\u062f \u0648 \u0639\u0646\u0648\u0627\u0646 \u06a9\u0648\u0686\u06a9.<\/p>\n<\/li>\n<li>\n<p>\u06cc\u06a9 \u0638\u0631\u0641 div \u0628\u0627 \u06cc\u06a9 \u0648\u0631\u0648\u062f\u06cc \u0648 \u06cc\u06a9 \u062f\u06a9\u0645\u0647 \u0628\u0631\u0627\u06cc \u0630\u062e\u06cc\u0631\u0647 \u062c\u0644\u0633\u0647.<\/p>\n<\/li>\n<li>\n<p>div \u062f\u06cc\u06af\u0631\u06cc \u06a9\u0647 \u062c\u0644\u0633\u0627\u062a \u0630\u062e\u06cc\u0631\u0647 \u0634\u062f\u0647 \u0645\u0627 \u0631\u0627 \u0628\u0631\u06af\u0632\u0627\u0631 \u0645\u06cc \u06a9\u0646\u062f.<\/p>\n<\/li>\n<li>\n<p>\u06cc\u06a9 \u062a\u06af \u0627\u0633\u06a9\u0631\u06cc\u067e\u062a \u0628\u0631\u0627\u06cc \u0648\u0627\u0631\u062f \u06a9\u0631\u062f\u0646 \u0641\u0627\u06cc\u0644 \u062c\u0627\u0648\u0627 \u0627\u0633\u06a9\u0631\u06cc\u067e\u062a \u0645\u0627 ** <code>popup.js<\/code>**.<\/p>\n<\/li>\n<\/ul>\n<h3><span class=\"ez-toc-section\" id=\"%D8%A7%D8%B3%DA%A9%D8%B1%DB%8C%D9%BE%D8%AA\"><\/span>\n<p>  \u0627\u0633\u06a9\u0631\u06cc\u067e\u062a<br \/>\n<span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p>\u06a9\u0647 \u062f\u0631 <code>popup.js<\/code>\u060c \u0645\u0627 \u062a\u0639\u0627\u0645\u0644\u0627\u062a \u0631\u0627\u0628\u0637 \u06a9\u0627\u0631\u0628\u0631\u06cc \u0631\u0627 \u0645\u062f\u06cc\u0631\u06cc\u062a \u062e\u0648\u0627\u0647\u06cc\u0645 \u06a9\u0631\u062f.  \u0641\u0627\u06cc\u0644 \u0631\u0627 \u0628\u0627\u0632 \u06a9\u0646\u06cc\u062f \u0648 \u06a9\u062f \u0632\u06cc\u0631 \u0631\u0627 \u0642\u0631\u0627\u0631 \u062f\u0647\u06cc\u062f:<\/p>\n<div class=\"highlight js-code-highlight\">\n<pre class=\"highlight plaintext\"><code>document.addEventListener(\"DOMContentLoaded\", () =&gt; {\n  const saveSessionButton = document.getElementById(\"saveSession\");\n  const sessionNameInput = document.getElementById(\"sessionName\");\n  const sessionsUL = document.getElementById(\"sessionsUL\");\n\n  const loadSessions = () =&gt; {\n    while (sessionsUL.firstChild) {\n      sessionsUL.removeChild(sessionsUL.firstChild);\n    }\n    chrome.storage.local.get(null, (sessions) =&gt; {\n      for (let sessionName in sessions) {\n        let sessionLI = document.createElement(\"li\");\n        sessionLI.className = \"session\";\n        let sessionTitle = document.createElement(\"span\");\n        sessionTitle.textContent = sessionName;\n\n        let openButton = document.createElement(\"button\");\n        openButton.textContent = \"OPEN\";\n        openButton.addEventListener(\"click\", () =&gt; {\n          chrome.runtime.sendMessage({ action: \"openSession\", sessionName });\n        });\n\n        let deleteButton = document.createElement(\"button\");\n        deleteButton.textContent = \"DELETE\";\n        deleteButton.addEventListener(\"click\", () =&gt; {\n          chrome.runtime.sendMessage({ action: \"deleteSession\", sessionName });\n        });\n\n        sessionLI.appendChild(sessionTitle);\n        sessionLI.appendChild(openButton);\n        sessionLI.appendChild(deleteButton);\n        sessionLI.appendChild(document.createElement(\"br\"));\n        sessionsUL.appendChild(sessionLI);\n      }\n    });\n  };\n\n  saveSessionButton.addEventListener(\"click\", () =&gt; {\n    let sessionName = sessionNameInput.value;\n    if (sessionName) {\n      chrome.tabs.query({ currentWindow: true }, (tabs) =&gt; {\n        let session = tabs.map((tab) =&gt; ({ url: tab.url, title: tab.title }));\n        chrome.runtime.sendMessage(\n          { action: \"saveSession\", sessionName, session },\n          loadSessions\n        );\n      });\n    }\n  });\n\n  chrome.runtime.onMessage.addListener((message) =&gt; {\n    if (message.action === \"refreshSessions\") {\n      loadSessions();\n    }\n  });\n\n  loadSessions();\n});\n\n<\/code><\/pre>\n<div class=\"highlight__panel js-actions-panel\">\n<div class=\"highlight__panel-action js-fullscreen-code-action\">\n    <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"20px\" height=\"20px\" viewbox=\"0 0 24 24\" class=\"highlight-action crayons-icon highlight-action--fullscreen-on\"><title>\u0648\u0627\u0631\u062f \u062d\u0627\u0644\u062a \u062a\u0645\u0627\u0645 \u0635\u0641\u062d\u0647 \u0634\u0648\u06cc\u062f<\/title>\n    <path d=\"M16 3h6v6h-2V5h-4V3zM2 3h6v2H4v4H2V3zm18 16v-4h2v6h-6v-2h4zM4 19h4v2H2v-6h2v4z\"\/>\n<\/svg><\/p>\n<p>    <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"20px\" height=\"20px\" viewbox=\"0 0 24 24\" class=\"highlight-action crayons-icon highlight-action--fullscreen-off\"><title>\u0627\u0632 \u062d\u0627\u0644\u062a \u062a\u0645\u0627\u0645 \u0635\u0641\u062d\u0647 \u062e\u0627\u0631\u062c \u0634\u0648\u06cc\u062f<\/title>\n    <path d=\"M18 7h4v2h-6V3h2v4zM8 9H2V7h4V3h2v6zm10 8v4h-2v-6h6v2h-4zM8 15v6H6v-4H2v-2h6z\"\/>\n<\/svg><\/p>\n<\/div>\n<\/div>\n<\/div>\n<p>\u062f\u0627\u062e\u0644 \u0627\u06cc\u0646 \u0627\u0633\u06a9\u0631\u06cc\u067e\u062a:<\/p>\n<ul>\n<li>\n<p>\u0645\u0627 \u06cc\u06a9 \u0634\u0646\u0648\u0646\u062f\u0647 \u0631\u0648\u06cc \u0633\u0646\u062f \u0627\u06cc\u062c\u0627\u062f \u0645\u06cc \u06a9\u0646\u06cc\u0645 \u062a\u0627 \u0648\u0642\u062a\u06cc \u0647\u0645\u0647 \u0645\u062d\u062a\u0648\u0627 \u0628\u0627\u0631\u06af\u06cc\u0631\u06cc \u0634\u062f\u060c \u0641\u0639\u0627\u0644 \u0634\u0648\u062f.<\/p>\n<\/li>\n<li>\n<p>\u0645\u0627 \u0686\u0646\u062f \u0639\u0646\u0635\u0631 \u0631\u0627 \u0627\u0632 UI \u062f\u0631\u06cc\u0627\u0641\u062a \u0645\u06cc \u06a9\u0646\u06cc\u0645: \u062f\u06a9\u0645\u0647 \u0630\u062e\u06cc\u0631\u0647 \u062c\u0644\u0633\u0647\u060c \u0639\u0646\u0635\u0631 \u0648\u0631\u0648\u062f\u06cc \u0648 \u0639\u0646\u0635\u0631 \u0644\u06cc\u0633\u062a \u062c\u0644\u0633\u0627\u062a.<\/p>\n<\/li>\n<li>\n<p>\u0627\u0644\u0641 \u0631\u0627 \u062a\u0639\u0631\u06cc\u0641 \u0645\u06cc \u06a9\u0646\u06cc\u0645 <code>loadSession<\/code> \u0631\u0648\u0634.  \u062f\u0631 \u062f\u0627\u062e\u0644\u060c \u0627\u0632 \u06cc\u06a9 \u062d\u0644\u0642\u0647 while \u0628\u0631\u0627\u06cc \u067e\u0627\u06a9 \u06a9\u0631\u062f\u0646 \u0639\u0646\u0635\u0631 \u0644\u06cc\u0633\u062a \u0627\u0633\u062a\u0641\u0627\u062f\u0647 \u0645\u06cc\u200c\u06a9\u0646\u06cc\u0645 \u0648 \u0647\u0631 \u062a\u063a\u06cc\u06cc\u0631 \u0631\u0627 \u062f\u0648\u0628\u0627\u0631\u0647 \u0628\u0627\u0631\u06af\u0630\u0627\u0631\u06cc \u0645\u06cc\u200c\u06a9\u0646\u06cc\u0645.  \u0645\u0627 \u0648\u06cc\u0698\u06af\u06cc session \u0631\u0627 \u0628\u0627 \u0627\u0633\u062a\u0641\u0627\u062f\u0647 \u0627\u0632 \u0631\u0648\u0634 \u0647\u0627\u06cc \u062f\u0627\u062e\u0644\u06cc \u06a9\u0631\u0648\u0645 \u0627\u0632 \u062d\u0627\u0641\u0638\u0647 \u0645\u062d\u0644\u06cc \u0628\u0627\u0632\u06cc\u0627\u0628\u06cc \u0645\u06cc \u06a9\u0646\u06cc\u0645.<\/p>\n<\/li>\n<li>\n<p>\u0645\u0627 \u062f\u0631 \u062a\u0645\u0627\u0645 \u062c\u0644\u0633\u0627\u062a \u062e\u0648\u062f \u0628\u0627 \u0627\u0633\u062a\u0641\u0627\u062f\u0647 \u0627\u0632 a \u062d\u0644\u0642\u0647 \u0645\u06cc \u06a9\u0646\u06cc\u0645 <code>for-in<\/code> \u062d\u0644\u0642\u0647\u060c \u0627\u06cc\u062c\u0627\u062f \u06cc\u06a9 <code>li<\/code> \u0639\u0646\u0635\u0631 \u0648 \u062f\u0627\u062f\u0646 \u0646\u0627\u0645 \u06a9\u0644\u0627\u0633 \u062c\u0644\u0633\u0647 \u0628\u0647 \u0622\u0646.  \u06cc\u06a9 \u0641\u0627\u0635\u0644\u0647 \u0628\u0631\u0627\u06cc \u062d\u0641\u0638 \u0639\u0646\u0648\u0627\u0646 \u0645\u0627 \u0627\u06cc\u062c\u0627\u062f \u06a9\u0646\u06cc\u062f.  \u06cc\u06a9 \u062f\u06a9\u0645\u0647 \u0628\u0631\u0627\u06cc \u0628\u0627\u0632 \u06a9\u0631\u062f\u0646 \u062c\u0644\u0633\u0647 \u0647\u0646\u06af\u0627\u0645 \u06a9\u0644\u06cc\u06a9 \u06a9\u0631\u062f\u0646\u060c \u0648 \u06cc\u06a9 \u062f\u06a9\u0645\u0647 \u062d\u0630\u0641 \u0628\u0631\u0627\u06cc \u062d\u0630\u0641 \u062c\u0644\u0633\u0647 \u0647\u0646\u06af\u0627\u0645 \u06a9\u0644\u06cc\u06a9 \u06a9\u0631\u062f\u0646.<\/p>\n<\/li>\n<li>\n<p>\u0639\u0646\u0648\u0627\u0646 \u0648 \u062f\u06a9\u0645\u0647 \u0647\u0627 \u0631\u0627 \u0628\u0647 \u062c\u0644\u0633\u0647 \u062e\u0648\u062f \u0627\u0636\u0627\u0641\u0647 \u0645\u06cc \u06a9\u0646\u06cc\u0645 <code>li<\/code> \u0639\u0646\u0635\u0631 \u0648 \u0627\u06cc\u0646 \u0639\u0646\u0635\u0631 \u0628\u0647 \u062c\u0644\u0633\u0647 \u0645\u0627 <code>ul<\/code> \u0627\u0632 \u062c\u0627\u0646\u0628 <code>popup.html<\/code>.<\/p>\n<\/li>\n<li>\n<p>\u0645\u0627 \u06cc\u06a9 \u0634\u0646\u0648\u0646\u062f\u0647 \u0631\u0648\u06cc\u062f\u0627\u062f \u0631\u0627 \u0628\u0647 \u062f\u06a9\u0645\u0647 \u0630\u062e\u06cc\u0631\u0647 \u062c\u0644\u0633\u0647 \u0627\u0636\u0627\u0641\u0647 \u0645\u06cc \u06a9\u0646\u06cc\u0645.  \u0628\u0627 \u06a9\u0644\u06cc\u06a9\u060c \u0645\u0642\u062f\u0627\u0631 \u0648\u0631\u0648\u062f\u06cc \u0631\u0627 \u0645\u06cc \u06af\u06cc\u0631\u062f \u0648 \u0628\u0647 \u0639\u0646\u0648\u0627\u0646 \u0646\u0627\u0645 \u062c\u0644\u0633\u0647 \u0630\u062e\u06cc\u0631\u0647 \u0645\u06cc \u06a9\u0646\u062f.  \u0628\u0627 \u0627\u0633\u062a\u0641\u0627\u062f\u0647 \u0627\u0632 \u0631\u0648\u0634\u200c\u0647\u0627\u06cc \u06a9\u0631\u0648\u0645\u060c \u0627\u0632 \u0637\u0631\u06cc\u0642 \u0628\u0631\u06af\u0647\u200c\u0647\u0627\u06cc \u0628\u0627\u0632 \u067e\u0646\u062c\u0631\u0647 \u0641\u0639\u0644\u06cc \u062d\u0644\u0642\u0647 \u0645\u06cc\u200c\u0632\u0646\u06cc\u0645.  \u0633\u067e\u0633 \u06cc\u06a9 \u0646\u0642\u0634\u0647 \u0627\u06cc\u062c\u0627\u062f \u06a9\u0646\u06cc\u062f \u0648 \u06cc\u06a9 \u067e\u06cc\u0627\u0645 \u0627\u0631\u0633\u0627\u0644 \u06a9\u0646\u06cc\u062f <code>background.js<\/code> \u0628\u0631\u0627\u06cc \u0630\u062e\u06cc\u0631\u0647 \u062c\u0644\u0633\u0627\u062a \u062f\u0631 \u062d\u0627\u0641\u0638\u0647 \u0645\u062d\u0644\u06cc.  \u0645\u0627 \u0631\u0627 \u062a\u062d\u0631\u06cc\u06a9 \u0645\u06cc \u06a9\u0646\u06cc\u0645 <code>loadSession<\/code> \u0628\u0631\u0627\u06cc \u0628\u0627\u0631\u06af\u06cc\u0631\u06cc \u0645\u062c\u062f\u062f \u0644\u06cc\u0633\u062a \u0648 \u0645\u0646\u0639\u06a9\u0633 \u06a9\u0631\u062f\u0646 \u0645\u0648\u0631\u062f \u062c\u062f\u06cc\u062f.<\/p>\n<\/li>\n<li>\n<p>\u06cc\u06a9 \u0634\u0646\u0648\u0646\u062f\u0647 \u0628\u0631\u0627\u06cc \u0631\u0633\u06cc\u062f\u06af\u06cc \u0627\u0636\u0627\u0641\u0647 \u0645\u06cc \u06a9\u0646\u06cc\u0645 <code>refreshSessions<\/code> \u067e\u06cc\u0627\u0645 \u0647\u0627 \u0627\u0632 <code>background.js<\/code>.<\/p>\n<\/li>\n<li>\n<p>\u062f\u0631 \u0646\u0647\u0627\u06cc\u062a\u060c \u0645\u0627 \u0627\u06cc\u0646 \u0631\u0648\u0634 \u0631\u0627 \u062f\u0631 \u0627\u0648\u0644\u06cc\u0646 \u0628\u0627\u0631 \u0628\u0631\u0627\u06cc \u0646\u0645\u0627\u06cc\u0634 \u062c\u0644\u0633\u0627\u062a \u0645\u0648\u062c\u0648\u062f \u0641\u0639\u0627\u0644 \u0645\u06cc \u06a9\u0646\u06cc\u0645.<\/p>\n<\/li>\n<\/ul>\n<h3><span class=\"ez-toc-section\" id=\"%D9%86%D9%85%D8%A7%D8%AF%D9%87%D8%A7\"><\/span>\n<p>  \u0646\u0645\u0627\u062f\u0647\u0627<br \/>\n<span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p>\u0633\u0647 \u0627\u0646\u062f\u0627\u0632\u0647 \u0646\u0645\u0627\u062f \u0631\u0627 \u0622\u0645\u0627\u062f\u0647 \u06a9\u0646\u06cc\u062f: 16&#215;16\u060c 48&#215;48\u060c \u0648 128&#215;128 \u067e\u06cc\u06a9\u0633\u0644.  \u0627\u06cc\u0646\u0647\u0627 \u0628\u0631\u0627\u06cc \u0646\u0648\u0627\u0631 \u0627\u0628\u0632\u0627\u0631 \u06a9\u0631\u0648\u0645 \u0648 \u0641\u0631\u0648\u0634\u06af\u0627\u0647 \u0648\u0628 \u06a9\u0631\u0648\u0645 \u0647\u0633\u062a\u0646\u062f.<\/p>\n<p>\u0627\u0628\u0632\u0627\u0631\u0647\u0627\u06cc \u0631\u0627\u06cc\u06af\u0627\u0646\u06cc \u0645\u0627\u0646\u0646\u062f resizeimage.net\u060c \u0645\u0648\u0644\u062f \u0622\u06cc\u06a9\u0648\u0646 \u0647\u0648\u0634 \u0645\u0635\u0646\u0648\u0639\u06cc \u0648 FreeConvert \u0631\u0627 \u062c\u0633\u062a\u062c\u0648 \u06a9\u0646\u06cc\u062f.  \u0628\u0631\u0627\u06cc \u0627\u06cc\u062c\u0627\u062f \u0648 \u062a\u063a\u06cc\u06cc\u0631 \u0627\u0646\u062f\u0627\u0632\u0647 \u0622\u06cc\u06a9\u0648\u0646 \u0647\u0627\u06cc \u062e\u0648\u062f.<\/p>\n<p><img decoding=\"async\" src=\"https:\/\/media.dev.to\/cdn-cgi\/image\/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto\/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Famtct9miemohk9vmohvl.jpg\" alt=\"\u0622\u06cc\u06a9\u0648\u0646\" loading=\"lazy\" width=\"512\" height=\"512\" title=\"\"><\/p>\n<h3><span class=\"ez-toc-section\" id=\"%D8%B3%D8%A8%DA%A9_%D9%87%D8%A7\"><\/span>\n<p>  \u0633\u0628\u06a9 \u0647\u0627<br \/>\n<span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p>\u0627\u0633\u062a\u0627\u06cc\u0644 \u067e\u0646\u062c\u0631\u0647 \u0631\u0627 \u0628\u0627 <code>popup.css<\/code> \u06a9\u0627\u0631\u0628\u0631 \u067e\u0633\u0646\u062f \u0648 \u0635\u0627\u0641 \u0628\u0647 \u0646\u0638\u0631 \u0628\u0631\u0633\u062f.  \u0641\u0627\u06cc\u0644 \u0631\u0627 \u0628\u0627\u0632 \u06a9\u0646\u06cc\u062f \u0648 \u06a9\u062f \u0632\u06cc\u0631 \u0631\u0627 \u0642\u0631\u0627\u0631 \u062f\u0647\u06cc\u062f:<\/p>\n<div class=\"highlight js-code-highlight\">\n<pre class=\"highlight plaintext\"><code>body {\n    width: 300px;\n    font-family: Arial, sans-serif;\n}\n\n.title-container {\n    border-bottom: 1px solid rgba(0, 0, 0, .06);\n    display: flex;\n    justify-content: flex-start;\n    text-align: center;\n    align-items: center;\n}\n\n.title {\n    margin-left: 4px;\n}\n\n.input-container {\n    margin-top: 4px;\n    padding-bottom: 10px;\n}\n\n.input {\n    border: 1px solid lightgray;\n    box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.1);\n    margin-right: 5px;\n    border-radius: 4px;\n    font-size: larger;\n    padding-top: 4px;\n    padding-bottom: 4px;\n    padding-left: 4px;\n}\n\ninput:focus-visible,\nbutton:focus-visible {\n    outline: 1px solid #007bff;\n    outline-offset: 0px;\n}\n\nbutton {\n    box-shadow: 2px 2px 5px rgba(0, 0, 0, 0.1);\n    border: none;\n    padding: 5px 10px;\n    cursor: pointer;\n    border-radius: 4px;\n}\n\n.save-session-btn {\n    background-color: #007bff;\n    color: #ffffff;\n}\n\n.save-session-btn:hover,\n.save-session-btn:active,\n.save-session-btn:focus,\n.save-session-btn:focus-visible {\n    background-color: #0056b3;\n}\n\n.sessions-list {\n    padding-inline-start: 20px;\n}\n\n.session {\n    display: flex;\n    align-items: center;\n    margin-bottom: 15px;\n    padding-left: 5px;\n}\n\n.session::before {\n    content: \"\\2022\";\n    display: inline-block;\n    width: 20px;\n    margin-left: -25px;\n    text-align: center;\n}\n\n.session span {\n    flex-grow: 1;\n    font-weight: bold;\n    font-size: larger;\n}\n\n.session button {\n    margin-left: 10px;\n    background-color: #ffffff;\n    color: #007bff;\n    border: 1px solid #007bff;\n}\n\n.session button:hover,\n.session button:active,\n.session button:focus,\n.session button:focus-visible {\n    background-color: #dbe5f2;\n}\n<\/code><\/pre>\n<div class=\"highlight__panel js-actions-panel\">\n<div class=\"highlight__panel-action js-fullscreen-code-action\">\n    <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"20px\" height=\"20px\" viewbox=\"0 0 24 24\" class=\"highlight-action crayons-icon highlight-action--fullscreen-on\"><title>\u0648\u0627\u0631\u062f \u062d\u0627\u0644\u062a \u062a\u0645\u0627\u0645 \u0635\u0641\u062d\u0647 \u0634\u0648\u06cc\u062f<\/title>\n    <path d=\"M16 3h6v6h-2V5h-4V3zM2 3h6v2H4v4H2V3zm18 16v-4h2v6h-6v-2h4zM4 19h4v2H2v-6h2v4z\"\/>\n<\/svg><\/p>\n<p>    <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"20px\" height=\"20px\" viewbox=\"0 0 24 24\" class=\"highlight-action crayons-icon highlight-action--fullscreen-off\"><title>\u0627\u0632 \u062d\u0627\u0644\u062a \u062a\u0645\u0627\u0645 \u0635\u0641\u062d\u0647 \u062e\u0627\u0631\u062c \u0634\u0648\u06cc\u062f<\/title>\n    <path d=\"M18 7h4v2h-6V3h2v4zM8 9H2V7h4V3h2v6zm10 8v4h-2v-6h6v2h-4zM8 15v6H6v-4H2v-2h6z\"\/>\n<\/svg><\/p>\n<\/div>\n<\/div>\n<\/div>\n<p>\u0628\u0631\u0627\u06cc \u0627\u06cc\u0646 \u0633\u0628\u06a9\u060c \u0645\u0627 \u0638\u0627\u0647\u0631\u06cc \u0645\u062f\u0631\u0646 \u0631\u0627 \u062f\u0631 \u0646\u0638\u0631 \u06af\u0631\u0641\u062a\u06cc\u0645:<\/p>\n<ul>\n<li>\n<p>\u0639\u0631\u0636 \u0648 \u0641\u0648\u0646\u062a \u0633\u0641\u0627\u0631\u0634\u06cc \u0628\u0631\u0627\u06cc \u06a9\u0644 \u0628\u062f\u0646.<\/p>\n<\/li>\n<li>\n<p>\u0645\u062d\u0641\u0638\u0647 \u0639\u0646\u0648\u0627\u0646 \u0645\u062a\u0646 \u0645\u062d\u0648\u0631 \u0628\u0627 \u062d\u0627\u0634\u06cc\u0647 \u06a9\u0645\u06cc \u062f\u0631 \u067e\u0627\u06cc\u06cc\u0646.<\/p>\n<\/li>\n<li>\n<p>\u06cc\u06a9 \u062d\u0627\u0634\u06cc\u0647 \u06a9\u0648\u0686\u06a9 \u0628\u0631\u0627\u06cc \u062c\u062f\u0627 \u06a9\u0631\u062f\u0646 \u0639\u0646\u0648\u0627\u0646 \u0627\u0632 \u0646\u0645\u0627\u062f.<\/p>\n<\/li>\n<li>\n<p>\u0633\u0628\u06a9 \u0647\u0627\u06cc \u0633\u0641\u0627\u0631\u0634\u06cc \u0628\u0631\u0627\u06cc \u0648\u0631\u0648\u062f\u06cc \u0648 \u062f\u06a9\u0645\u0647 \u0647\u0627\u060c \u0627\u0632 \u062c\u0645\u0644\u0647 \u06af\u0648\u0634\u0647 \u0647\u0627\u06cc \u06af\u0631\u062f\u060c \u06a9\u0645\u06cc \u0633\u0627\u06cc\u0647 \u0648 \u062e\u0637\u0648\u0637 \u0622\u0628\u06cc.  \u062f\u0648 \u062f\u06a9\u0645\u0647 \u0648\u062c\u0648\u062f \u062f\u0627\u0631\u062f: \u06cc\u06a9\u06cc \u0622\u0628\u06cc \u0631\u0646\u06af \u0648 \u062f\u06cc\u06af\u0631\u06cc \u0628\u0627 \u062e\u0637\u0648\u0637 \u0622\u0628\u06cc.<\/p>\n<\/li>\n<li>\n<p>\u0645\u0648\u0642\u0639\u06cc\u062a \u06cc\u0627\u0628\u06cc \u0627\u0646\u0639\u0637\u0627\u0641 \u067e\u0630\u06cc\u0631\u060c \u0627\u06cc\u062c\u0627\u062f \u0622\u06cc\u062a\u0645 \u0647\u0627\u06cc \u0641\u0647\u0631\u0633\u062a\u060c \u0641\u0636\u0627\u06cc\u06cc \u0645\u0634\u0627\u0628\u0647 \u06cc\u06a9 \u0633\u062a\u0648\u0646 \u0628\u0627 \u0631\u0634\u062f \u0627\u0646\u0639\u0637\u0627\u0641 \u067e\u0630\u06cc\u0631 \u062f\u0627\u0631\u062f.  \u0627\u0632 \u0622\u0646\u062c\u0627\u06cc\u06cc \u06a9\u0647 &#8220;flex&#8221; \u0622\u06cc\u062a\u0645 \u0647\u0627\u06cc \u0644\u06cc\u0633\u062a \u0645\u0627 \u0631\u0627 \u0645\u06cc \u0634\u06a9\u0646\u062f\u060c \u0646\u0645\u0627\u062f \u0622\u06cc\u062a\u0645 \u0644\u06cc\u0633\u062a \u0631\u0627 \u0642\u0628\u0644 \u0627\u0632 \u0647\u0631 \u06a9\u062f\u0627\u0645 \u0627\u0636\u0627\u0641\u0647 \u06a9\u0631\u062f\u06cc\u0645.<\/p>\n<\/li>\n<\/ul>\n<h3><span class=\"ez-toc-section\" id=\"%D8%A2%D8%B2%D9%85%D8%A7%DB%8C%D8%B4_%DA%A9%D8%B1%D8%AF%D9%86\"><\/span>\n<p>  \u0622\u0632\u0645\u0627\u06cc\u0634 \u06a9\u0631\u062f\u0646<br \/>\n<span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p>\u0628\u0631\u0627\u06cc \u0622\u0632\u0645\u0627\u06cc\u0634 \u0628\u0631\u0646\u0627\u0645\u0647 \u0627\u0641\u0632\u0648\u062f\u0646\u06cc \u062e\u0648\u062f:<\/p>\n<p>1. \u0628\u0647 \u0635\u0641\u062d\u0647 \u0627\u0641\u0632\u0648\u0646\u0647 \u06a9\u0631\u0648\u0645 (chrome:\/\/extensions\/) \u0628\u0631\u0648\u06cc\u062f.<\/p>\n<p>2. \u062d\u0627\u0644\u062a \u062a\u0648\u0633\u0639\u0647 \u062f\u0647\u0646\u062f\u0647 \u0631\u0627 \u0641\u0639\u0627\u0644 \u06a9\u0646\u06cc\u062f.<\/p>\n<p>3. \u0631\u0648\u06cc &#8220;Load unpacked&#8221; \u06a9\u0644\u06cc\u06a9 \u06a9\u0646\u06cc\u062f \u0648 \u062f\u0627\u06cc\u0631\u06a9\u062a\u0648\u0631\u06cc \u067e\u0631\u0648\u0698\u0647 \u062e\u0648\u062f \u0631\u0627 \u0627\u0646\u062a\u062e\u0627\u0628 \u06a9\u0646\u06cc\u062f.  \u0627\u06a9\u0646\u0648\u0646 \u0627\u0641\u0632\u0648\u0646\u0647 \u0634\u0645\u0627 \u0628\u0627\u06cc\u062f \u062f\u0631 \u06a9\u0631\u0648\u0645 \u0642\u0627\u0628\u0644 \u0645\u0634\u0627\u0647\u062f\u0647 \u0628\u0627\u0634\u062f.<\/p>\n<p><img decoding=\"async\" src=\"https:\/\/media.dev.to\/cdn-cgi\/image\/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto\/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fnizq8jx6ggz3s3ssszut.png\" alt=\"Extension_unpacked_visible\" loading=\"lazy\" width=\"435\" height=\"272\" title=\"\"><\/p>\n<h3><span class=\"ez-toc-section\" id=\"%D8%AF%D8%B1_%D8%AD%D8%A7%D9%84_%D8%A7%D8%B3%D8%AA%D9%82%D8%B1%D8%A7%D8%B1_%D8%AF%D8%B1_%D9%81%D8%B1%D9%88%D8%B4%DA%AF%D8%A7%D9%87_%D9%88%D8%A8_Chrome\"><\/span>\n<p>  \u062f\u0631 \u062d\u0627\u0644 \u0627\u0633\u062a\u0642\u0631\u0627\u0631 \u062f\u0631 \u0641\u0631\u0648\u0634\u06af\u0627\u0647 \u0648\u0628 Chrome<br \/>\n<span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p>\u0627\u0633\u062a\u0642\u0631\u0627\u0631 \u062f\u0631 \u0641\u0631\u0648\u0634\u06af\u0627\u0647 \u0648\u0628 Chrome \u0633\u0627\u062f\u0647 \u0627\u0633\u062a.  \u0628\u0647 \u062f\u0644\u06cc\u0644 \u0641\u0631\u0622\u06cc\u0646\u062f \u0628\u0631\u0631\u0633\u06cc \u06af\u0648\u06af\u0644\u060c \u0628\u0647 \u062c\u0632\u0626\u06cc\u0627\u062a \u0646\u06cc\u0627\u0632 \u062f\u0627\u0631\u062f.  \u0627\u06cc\u0646 \u0645\u0631\u0627\u062d\u0644 \u0631\u0627 \u062f\u0646\u0628\u0627\u0644 \u06a9\u0646\u06cc\u062f:<\/p>\n<p>1. Zip Your Application: \u0645\u0637\u0645\u0626\u0646 \u0634\u0648\u06cc\u062f \u06a9\u0647 \u067e\u0631\u0648\u0698\u0647 \u0634\u0645\u0627 \u0627\u0632 \u0633\u0627\u062e\u062a\u0627\u0631 \u062f\u0631\u0633\u062a \u067e\u0648\u0634\u0647 \u067e\u06cc\u0631\u0648\u06cc \u0645\u06cc \u06a9\u0646\u062f. <code>manifest.json<\/code> \u0628\u0627\u06cc\u062f \u062f\u0631 \u0631\u06cc\u0634\u0647 \u0628\u0627\u0634\u062f<\/p>\n<p>2. \u062a\u0646\u0638\u06cc\u0645 \u06cc\u06a9 \u062d\u0633\u0627\u0628 \u0628\u0631\u0646\u0627\u0645\u0647\u200c\u0646\u0648\u06cc\u0633: \u0628\u0647 \u062f\u0627\u0634\u0628\u0648\u0631\u062f \u0628\u0631\u0646\u0627\u0645\u0647\u200c\u0646\u0648\u06cc\u0633 \u0641\u0631\u0648\u0634\u06af\u0627\u0647 \u0648\u0628 Chrome \u0628\u0631\u0648\u06cc\u062f.  \u0633\u067e\u0633 \u0628\u0631\u0627\u06cc \u0627\u0646\u062a\u0634\u0627\u0631 \u0628\u0631\u0646\u0627\u0645\u0647 \u0647\u0627\u06cc \u0627\u0641\u0632\u0648\u062f\u0646\u06cc \u06cc\u06a9 \u0628\u0627\u0631 \u0647\u0632\u06cc\u0646\u0647 5 \u062f\u0644\u0627\u0631\u06cc \u0628\u067e\u0631\u062f\u0627\u0632\u06cc\u062f.<\/p>\n<p>3. \u0628\u0631\u0646\u0627\u0645\u0647 \u0627\u0641\u0632\u0648\u062f\u0646\u06cc \u062e\u0648\u062f \u0631\u0627 \u0622\u067e\u0644\u0648\u062f \u06a9\u0646\u06cc\u062f: \u0631\u0648\u06cc \u00ab\u0627\u0641\u0632\u0648\u062f\u0646 \u0645\u0648\u0631\u062f \u062c\u062f\u06cc\u062f\u00bb \u06a9\u0644\u06cc\u06a9 \u06a9\u0646\u06cc\u062f\u060c \u0641\u0627\u06cc\u0644 \u0641\u0634\u0631\u062f\u0647 \u062e\u0648\u062f \u0631\u0627 \u0622\u067e\u0644\u0648\u062f \u06a9\u0646\u06cc\u062f.  \u062c\u0632\u0626\u06cc\u0627\u062a \u0645\u0648\u0631\u062f \u0646\u06cc\u0627\u0632 \u0645\u0627\u0646\u0646\u062f \u0639\u0646\u0648\u0627\u0646\u060c \u062a\u0648\u0636\u06cc\u062d\u0627\u062a \u0648 \u0633\u06cc\u0627\u0633\u062a \u062d\u0641\u0638 \u062d\u0631\u06cc\u0645 \u062e\u0635\u0648\u0635\u06cc \u0631\u0627 \u067e\u0631 \u06a9\u0646\u06cc\u062f.<\/p>\n<p>4. \u0627\u0631\u0633\u0627\u0644 \u0628\u0631\u0627\u06cc \u0628\u0631\u0631\u0633\u06cc: \u067e\u0633 \u0627\u0632 \u062a\u06a9\u0645\u06cc\u0644 \u0641\u0631\u0645\u060c \u067e\u0633\u0648\u0646\u062f \u062e\u0648\u062f \u0631\u0627 \u0628\u0631\u0627\u06cc \u0628\u0631\u0631\u0633\u06cc \u0627\u0631\u0633\u0627\u0644 \u06a9\u0646\u06cc\u062f.  \u0627\u06cc\u0646 \u0641\u0631\u0622\u06cc\u0646\u062f \u0645\u06cc \u062a\u0648\u0627\u0646\u062f \u0627\u0632 \u0686\u0646\u062f \u0633\u0627\u0639\u062a \u062a\u0627 \u0686\u0646\u062f \u0631\u0648\u0632 \u0637\u0648\u0644 \u0628\u06a9\u0634\u062f.  \u067e\u0633 \u0627\u0632 \u0628\u0631\u0631\u0633\u06cc\u060c \u06cc\u06a9 \u0627\u06cc\u0645\u06cc\u0644 \u0628\u0631\u0627\u06cc \u0634\u0645\u0627 \u0627\u0631\u0633\u0627\u0644 \u062e\u0648\u0627\u0647\u062f \u0634\u062f.<\/p>\n<p><img decoding=\"async\" src=\"https:\/\/media.dev.to\/cdn-cgi\/image\/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto\/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2F61524kbmm9p5g6ba8k7y.png\" alt=\"submit_for_review_popup\" loading=\"lazy\" width=\"561\" height=\"347\" title=\"\"><\/p>\n<h3><span class=\"ez-toc-section\" id=\"%D8%A8%D9%87%D8%A8%D9%88%D8%AF%D9%87%D8%A7\"><\/span>\n<p>  \u0628\u0647\u0628\u0648\u062f\u0647\u0627<br \/>\n<span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p>\u0628\u0631\u0627\u06cc \u0628\u0647\u0628\u0648\u062f \u0628\u0631\u0646\u0627\u0645\u0647 \u0627\u0641\u0632\u0648\u062f\u0646\u06cc \u062e\u0648\u062f\u060c \u0627\u06cc\u0646 \u0648\u06cc\u0698\u06af\u06cc\u200c\u0647\u0627 \u0631\u0627 \u0627\u0636\u0627\u0641\u0647 \u06a9\u0646\u06cc\u062f:<\/p>\n<ul>\n<li>\n<p>\u062a\u063a\u06cc\u06cc\u0631 \u0646\u0627\u0645 \u062c\u0644\u0633\u0627\u062a \u06cc\u0627 \u0633\u0627\u0632\u0645\u0627\u0646\u062f\u0647\u06cc \u062c\u0644\u0633\u0627\u062a \u0628\u0647 \u062f\u0633\u062a\u0647 \u0647\u0627.<\/p>\n<\/li>\n<li>\n<p>\u067e\u06cc\u0627\u062f\u0647 \u0633\u0627\u0632\u06cc \u0645\u0648\u0627\u0631\u062f \u062a\u0633\u062a \u0628\u0631\u0627\u06cc \u0641\u0627\u06cc\u0644 \u0627\u0633\u06a9\u0631\u06cc\u067e\u062a \u0634\u0645\u0627.<\/p>\n<\/li>\n<li>\n<p>\u062a\u0639\u0627\u0645\u0644 \u0628\u0627 \u06a9\u0627\u0631\u0628\u0631\u0627\u0646 \u0628\u0631\u0627\u06cc \u062c\u0645\u0639 \u0622\u0648\u0631\u06cc \u0628\u0627\u0632\u062e\u0648\u0631\u062f \u0648 \u0628\u0647\u0628\u0648\u062f \u0628\u0631\u0646\u0627\u0645\u0647 \u0627\u0641\u0632\u0648\u062f\u0646\u06cc.<\/p>\n<\/li>\n<li>\n<p>\u0628\u0627 \u0627\u0631\u0627\u0626\u0647 \u0646\u0633\u062e\u0647 \u0645\u0645\u062a\u0627\u0632 \u0628\u0627 \u0648\u06cc\u0698\u06af\u06cc\u200c\u0647\u0627\u06cc \u0627\u0636\u0627\u0641\u06cc\u060c \u0627\u0632 \u0628\u0631\u0646\u0627\u0645\u0647 \u0627\u0641\u0632\u0648\u062f\u0646\u06cc \u062e\u0648\u062f \u062f\u0631\u0622\u0645\u062f \u06a9\u0633\u0628 \u06a9\u0646\u06cc\u062f.<\/p>\n<\/li>\n<\/ul>\n<h3><span class=\"ez-toc-section\" id=\"%D9%86%D8%AA%DB%8C%D8%AC%D9%87\"><\/span>\n<p>  \u0646\u062a\u06cc\u062c\u0647<br \/>\n<span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p>\u062a\u0628\u0631\u06cc\u06a9 \u0645\u06cc\u200c\u06af\u0648\u06cc\u06cc\u0645\u060c \u0634\u0645\u0627 \u0645\u0648\u0641\u0642 \u0628\u0647 \u0627\u06cc\u062c\u0627\u062f \u06cc\u06a9 \u0627\u0641\u0632\u0648\u0646\u0647 Chrome \u0634\u062f\u06cc\u062f!  \u0639\u0645\u0644\u06a9\u0631\u062f \u0648 \u0627\u0633\u062a\u0627\u06cc\u0644 \u06a9\u0627\u0645\u0644 \u0631\u0627 \u0627\u0636\u0627\u0641\u0647 \u06a9\u0631\u062f \u0648 \u062f\u0631 \u0641\u0631\u0648\u0634\u06af\u0627\u0647 \u0648\u0628 Chrome \u0645\u0646\u062a\u0634\u0631 \u06a9\u0631\u062f.  \u0628\u0627 \u062f\u0646\u0628\u0627\u0644 \u06a9\u0631\u062f\u0646 \u0627\u06cc\u0646 \u0631\u0627\u0647\u0646\u0645\u0627\u060c \u0645\u0631\u0627\u062d\u0644 \u062a\u0648\u0633\u0639\u0647 \u0648 \u0627\u0633\u062a\u0642\u0631\u0627\u0631 \u0628\u0631\u0646\u0627\u0645\u0647 \u0647\u0627\u06cc \u0627\u0641\u0632\u0648\u062f\u0646\u06cc \u0631\u0627 \u06cc\u0627\u062f \u06af\u0631\u0641\u062a\u0647 \u0627\u06cc\u062f.  \u0628\u0647 \u0622\u0632\u0645\u0627\u06cc\u0634 \u0648 \u062a\u0642\u0648\u06cc\u062a \u0628\u0631\u0646\u0627\u0645\u0647 \u0627\u0641\u0632\u0648\u062f\u0646\u06cc \u062e\u0648\u062f \u0627\u062f\u0627\u0645\u0647 \u062f\u0647\u06cc\u062f \u062a\u0627 \u0622\u0646 \u0631\u0627 \u062d\u062a\u06cc \u0645\u0641\u06cc\u062f\u062a\u0631 \u06a9\u0646\u06cc\u062f.<\/p>\n<p><img decoding=\"async\" src=\"https:\/\/media.dev.to\/cdn-cgi\/image\/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto\/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fwt3wn7zeqot5q5w1jog6.png\" alt=\"extension_published\" loading=\"lazy\" width=\"800\" height=\"286\" title=\"\"><\/p>\n<p><strong>\u0644\u06cc\u0646\u06a9 \u0627\u0641\u0632\u0648\u0646\u0647 \u0639\u0645\u0648\u0645\u06cc<\/strong><\/p>\n<p><strong>\u0645\u062e\u0632\u0646 \u06a9\u062f<\/strong><\/p>\n<\/p><\/div>\n","protected":false},"excerpt":{"rendered":"<p>Summarize this content to 400 words in Persian Lang \u0645\u0639\u0631\u0641\u06cc \u0627\u06cc\u062c\u0627\u062f \u06cc\u06a9 \u0627\u0641\u0632\u0648\u0646\u0647 \u06a9\u0631\u0648\u0645 \u062f\u0631 \u0627\u0628\u062a\u062f\u0627 \u0645\u06cc \u062a\u0648\u0627\u0646\u062f \u062f\u0644\u0647\u0631\u0647 \u0622\u0648\u0631 \u0628\u0647 \u0646\u0638\u0631 \u0628\u0631\u0633\u062f. \u0627\u0645\u0627 \u0628\u0627 \u0631\u0627\u0647\u0646\u0645\u0627\u06cc\u06cc \u0635\u062d\u06cc\u062d\u060c \u0642\u0627\u0628\u0644 \u0645\u062f\u06cc\u0631\u06cc\u062a \u0627\u0633\u062a. \u0627\u06cc\u0646 \u0631\u0627\u0647\u0646\u0645\u0627 \u0634\u0645\u0627 \u0631\u0627 \u062f\u0631 \u0633\u0627\u062e\u062a \u0648 \u0627\u0646\u062a\u0634\u0627\u0631 \u0627\u0641\u0632\u0648\u0646\u0647 \u06a9\u0631\u0648\u0645 \u0631\u0627\u0647\u0646\u0645\u0627\u06cc\u06cc \u0645\u06cc \u06a9\u0646\u062f. &#8220;Custom Session Saver&#8221; \u0646\u0627\u0645\u06cc\u062f\u0647 \u0645\u06cc \u0634\u0648\u062f. \u0627\u06cc\u0646 \u0627\u0641\u0632\u0648\u0646\u0647 \u0628\u0647 \u06a9\u0627\u0631\u0628\u0631\u0627\u0646 \u0627\u0645\u06a9\u0627\u0646 \u0630\u062e\u06cc\u0631\u0647 &hellip;<\/p>\n","protected":false},"author":2,"featured_media":69962,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"fifu_image_url":"","fifu_image_alt":"","footnotes":""},"categories":[339],"tags":[],"class_list":["post-69961","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-dev"],"_links":{"self":[{"href":"https:\/\/nabfollower.com\/blog\/wp-json\/wp\/v2\/posts\/69961","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/nabfollower.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/nabfollower.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/nabfollower.com\/blog\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/nabfollower.com\/blog\/wp-json\/wp\/v2\/comments?post=69961"}],"version-history":[{"count":0,"href":"https:\/\/nabfollower.com\/blog\/wp-json\/wp\/v2\/posts\/69961\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/nabfollower.com\/blog\/wp-json\/wp\/v2\/media\/69962"}],"wp:attachment":[{"href":"https:\/\/nabfollower.com\/blog\/wp-json\/wp\/v2\/media?parent=69961"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/nabfollower.com\/blog\/wp-json\/wp\/v2\/categories?post=69961"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/nabfollower.com\/blog\/wp-json\/wp\/v2\/tags?post=69961"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}