From 4b1a9203c547c019fc5398082ae19a3f3d4c3efe Mon Sep 17 00:00:00 2001 From: Peter Bengtsson Date: Tue, 8 Dec 2020 14:41:15 -0500 Subject: initial commit --- files/bn/mozilla/add-ons/webextensions/index.html | 91 +++++++++++++ .../what_are_webextensions/index.html | 95 ++++++++++++++ .../your_first_webextension/index.html | 143 +++++++++++++++++++++ 3 files changed, 329 insertions(+) create mode 100644 files/bn/mozilla/add-ons/webextensions/index.html create mode 100644 files/bn/mozilla/add-ons/webextensions/what_are_webextensions/index.html create mode 100644 files/bn/mozilla/add-ons/webextensions/your_first_webextension/index.html (limited to 'files/bn/mozilla/add-ons/webextensions') diff --git a/files/bn/mozilla/add-ons/webextensions/index.html b/files/bn/mozilla/add-ons/webextensions/index.html new file mode 100644 index 0000000000..8a47f12413 --- /dev/null +++ b/files/bn/mozilla/add-ons/webextensions/index.html @@ -0,0 +1,91 @@ +--- +title: WebExtensions +slug: Mozilla/Add-ons/WebExtensions +tags: + - NeedsTranslation + - TopicStub +translation_of: Mozilla/Add-ons/WebExtensions +--- +
{{AddonSidebar}}
+ +
+

WebExtensions are currently in an experimental alpha state. From Firefox 46, you can publish WebExtensions to Firefox users, just like any other add-on. We're aiming for a first stable release in Firefox 48.

+
+ +

WebExtensions are a cross-browser system for developing browser add-ons. To a large extent the system is compatible with the extension API supported by Google Chrome and Opera. Extensions written for these browsers will in most cases run in Firefox or Microsoft Edge with just a few changes. The API is also fully compatible with multiprocess Firefox.

+ +

We're also intending to extend the APIs to support the needs of add-on developers, so if you have ideas, we'd love to hear them. You can reach us on the dev-addons mailing list or #webextensions on IRC.

+ +
+ + +
+

Reference

+ + + +

JavaScript APIs

+ +
{{ ListSubpages ("/en-US/Add-ons/WebExtensions/API") }}
+ +

Manifest keys

+ +
{{ ListSubpages ("/en-US/Add-ons/WebExtensions/manifest.json") }}
+
+
diff --git a/files/bn/mozilla/add-ons/webextensions/what_are_webextensions/index.html b/files/bn/mozilla/add-ons/webextensions/what_are_webextensions/index.html new file mode 100644 index 0000000000..f92dc2ad28 --- /dev/null +++ b/files/bn/mozilla/add-ons/webextensions/what_are_webextensions/index.html @@ -0,0 +1,95 @@ +--- +title: What are WebExtensions? +slug: Mozilla/Add-ons/WebExtensions/What_are_WebExtensions +translation_of: Mozilla/Add-ons/WebExtensions/What_are_WebExtensions +--- +

এই পাতা গেকো ভিত্তিক অ্যাপ্লিকেশনের জন্য উন্নয়নশীল এক্সটেনশন পদ্ধতির যা ব্যবহার ডকুমেন্টেশন লিঙ্ক উপস্থিত রয়েছে
+
+
+  XUL প্রতিস্থাপক ইন্টারফেস করুন </ li> নির্দিষ্ট করার
+  
<লি> যেমন <a href="/en-US/docs/XUL/tabbrowser"> <code> বিশেষ সুবিধাভোগী কোড উপলব্ধ API গুলি, tabbrowser </ code> </a> এবং <একটি href = "/ en-US / ডক্স / মজিলা / JavaScript_code_modules "> জাভাস্ক্রিপ্ট মডিউল </a>, অ্যাপ্লিকেশন এবং কন্টেন্ট সঙ্গে যোগাযোগ করার জন্য. </ li>
+ </ Li>
+
+ <P> ঢাকা ফায়ারফক্স 4, এবং গেকো 2 ইঞ্জিন এটি ক্ষমতা, এই এক্সটেনশন বিকাশ করার একমাত্র উপায় ছিল এর আগে. এই পদ্ধতি মূলত <a href="/en-US/docs/Extensions/Bootstrapped_extensions"> রিস্টার্টবিহীন এক্সটেনশন </a>, এবং <a দ্বারা বাতিল হয়েছে href="/en-US/Add-ons/SDK"> অ্যাড-অন এসডিকে </a>, যা তাদের উপর নির্মিত হয়. সুবিধাভোগী জাভাস্ক্রিপ্ট এপিআই এখানে বর্ণনা এখনও অ্যাড টার্ন এই নতুন ধরনের ব্যবহার করা যেতে পারে. '</ p>
+
+ <H2 & id = "XUL_School"> XUL স্কুল </ h2>
+
+ <পি> <a href="/en-US/Add-ons/Overlay_Extensions/XUL_School"> XUL স্কুল </a> একটি ব্যাপক অ্যাড অন উন্নয়ন টিউটোরিয়াল, কিন্তু বেশিরভাগই অন্যান্য গেকো ভিত্তিক প্রযোজ্য ফায়ারফক্স এক্সটেনশন উন্নয়ন উপর মনোযোগ নিবদ্ধ করে অ্যাপ্লিকেশন. '</ p>
+
+ <H2 & id = "More_resources"> আরো সম্পদ করুন </ h2>
+
+ <Div class = "কলাম-ধারক">
+ <Div class = "কলাম অর্ধ">
+ <DL>
+  
<Dt> <a href="/en-US/Mozilla/Add-ons/Setting_up_extension_development_environment"> আপনার পরিবেশ </a> </ DT> সেট আপ
+  
<DD> এক্সটেনশন উন্নয়নের জন্য আবেদন সেট আপ হচ্ছে. </ DD>
+  
<Dt> <a href="/en-US/docs/XUL"> XUL </a> </ DT>
+  
<DD> টিউটোরিয়াল এবং ইউজার ইন্টারফেস XUL ​​এক্সটেনশন. </ DD> দ্বারা ব্যবহৃত ভাষা জন্য রেফারেন্স
+  
<Dt> <a href="/en-US/Mozilla/Add-ons/Code_snippets"> কোড স্নিপেট </a> </ DT>
+  
<DD> জিনিষ আপনি করতে চাইবেন. </ DD> অনেক জন্য নমুনা কোড
+  
<Dt> <a href="/en-US/Mozilla/Add-ons/Installing_extensions"> এক্সটেনশন </a> </ DT> ইনস্টল
+  
<DD> অ্যাপ্লিকেশনের তালিকা ইনস্টল এক্সটেনশান ফাইল অনুলিপি দ্বারা একটি এক্সটেনশন ইনস্টল করার জন্য কিভাবে. </ DD>
+  
<Dt> <a href="/en-US/Add-ons/Overlay_extensions/Firefox_addons_developer_guide"> ফায়ারফক্স অ্যাড-অন ডেভেলপার নির্দেশিকা </a> </ DT>
+  
<DD> ওভারলে এক্সটেনশন. </ DD> উন্নয়নশীল একটি নির্দেশিকা
+ </ DL>
+ </ Div>
+
+ <Div class = "কলাম অর্ধ">
+ <DL>
+  
<Dt> <a href="/en-US/docs/Mozilla/JavaScript_code_modules"> জাভাস্ক্রিপ্ট কোড মডিউল </a> </ DT>
+  
<DD> জাভাস্ক্রিপ্ট মডিউল এক্সটেনশন ডেভেলপার. </ DD> উপলব্ধ
+  
<Dt> <a href="/en-US/Mozilla/Add-ons/Inline_Options"> এক্সটেনশন পছন্দগুলি </a> </ DT>
+  
<DD> কিভাবে আপনার এক্সটেনশন পছন্দগুলি যে অ্যাড-অন ম্যানেজার প্রদর্শিত হবে তা নির্দিষ্ট করার. </ DD>
+  
<Dt> <a href="/en-US/Mozilla/Add-ons/Extension_Packaging"> এক্সটেনশন প্যাকেজিং </a> </ DT>
+  
<DD> কিভাবে এক্সটেনশন প্যাকেজ এবং ইনস্টল করা হয়. </ DD>
+  
<Dt> <a href="/en-US/Mozilla/Add-ons/Creating_Custom_Firefox_Extensions_with_the_Mozilla_Build_System"> বাইনারি ফায়ারফক্স এক্সটেনশন </a> </ DT>
+  
<DD> ফায়ারফক্সের জন্য বাইনারি এক্সটেনশন তৈরি. </ DD>
+ </ DL>
+ </ Div>
+ </ Div>
+
+ <পি> & nbsp; </ p>

diff --git a/files/bn/mozilla/add-ons/webextensions/your_first_webextension/index.html b/files/bn/mozilla/add-ons/webextensions/your_first_webextension/index.html new file mode 100644 index 0000000000..c705ed4493 --- /dev/null +++ b/files/bn/mozilla/add-ons/webextensions/your_first_webextension/index.html @@ -0,0 +1,143 @@ +--- +title: আপনার প্রথম WebExtension +slug: Mozilla/Add-ons/WebExtensions/Your_first_WebExtension +translation_of: Mozilla/Add-ons/WebExtensions/Your_first_WebExtension +--- +

{{AddonSidebar}}

+ +

এই অনুচ্ছেদে ফায়ারফক্সের WebExtension তৈরীর আদ্যপন্ত জানব। এই অ্যাড-অন "mozilla.org" অথবা এর সাবডোমেন থেকে আসা সমস্ত পেজে লাল বর্ডার যোগ করবে।

+ +

এই উদাহরণের সোর্স কোড GitHub-এ দেওয়া আছেঃ

+ +

https://github.com/mdn/webextensions-examples/tree/master/borderify.

+ +

প্রথমে দরকার হবে ফায়ারফক্স ৪৫ অথবা তার পরবর্তী ভার্সন।

+ +

WebExtension লিখা

+ +

নতুন একটি ডিরেক্টরী তৈরী করে সেখানে প্রবেশ করুনঃ

+ +
mkdir borderify
+cd borderify
+ +

manifest.json

+ +

এখন "borderify" ডিরেক্টরীর ভেতরে "manifest.json" নামে নতুন একটি ফাইল তৈরী করুন। তাতে নিম্নলিখিত কোড লিখুনঃ

+ +
{
+
+  "manifest_version": 2,
+  "name": "Borderify",
+  "version": "1.0",
+
+  "description": "Adds a solid red border to all webpages matching mozilla.org.",
+
+  "icons": {
+    "48": "icons/border-48.png"
+  },
+
+  "content_scripts": [
+    {
+      "matches": ["*://*.mozilla.org/*"],
+      "js": ["borderify.js"]
+    }
+  ]
+
+}
+ + + +

কিছু ফায়ারফক্স ভার্সনে একটি অতিরক্ত applications key manifest.json-এ যোগ করা লাগতে পারে।

+ +
"applications": {
+  "gecko": {
+    "id": "borderify@example.com",
+    "strict_min_version": "42.0",
+    "strict_max_version": "50.*",
+    "update_url": "https://example.com/updates.json"
+  }
+}
+ +

সবচেয়ে মজার key হচ্ছ content_scripts. এটা ফায়ারফক্সকে সেই সব ওয়েব পেজে স্ক্রীপট লোড করতে বলবে যাদের URL-এ একটি নির্দিষ্ট প্যাটার্ন আছে।এক্ষেত্রে আমরা ফায়ারফক্সকে "mozilla.org" বা এর সাবডোমেনের সমস্ত HTTP অথবা HTTPS পেজে "borderify.js" নামে স্ক্রীপট লোড করতে বলছি।

+ + + +

icons/border-48.png

+ +

The add-on should have an icon. This will be shown next to the add-on's listing in the Add-ons Manager. Our manifest.json promised that we would have an icon at "icons/border-48.png".

+ +

Create the "icons" directory directly under the "borderify" directory. Save an icon there named "border-48.png".  You could use the one from our example, which is taken from the Google Material Design iconset, and is used under the terms of the Creative Commons Attribution-ShareAlike license.

+ +

If you choose to supply your own icon, It should be 48x48 pixels. You could also supply a 96x96 pixel icon, for high-resolution displays, and if you do this it will be specified as the 96 property of the icons object in manifest.json:

+ +
"icons": {
+  "48": "icons/border-48.png",
+  "96": "icons/border-96.png"
+}
+ +

Alternatively, you could supply an SVG file here, and it will be scaled correctly.

+ + + +

borderify.js

+ +

Finally, create a file called "borderify.js" directly under the "borderify" directory. Give it this content:

+ +
document.body.style.border = "5px solid red";
+ +

This script will be loaded into the pages that match the pattern given in the content_scripts manifest.json key. The script has direct access to the document, just like scripts loaded by the page itself.

+ + + +

Testing it out

+ +

First, double check that you have the right files in the right places:

+ +
borderify/
+    icons/
+        border-48.png
+    borderify.js
+    manifest.json
+ +

Open "about:debugging" in Firefox, click "Load Temporary Add-on" and select any file in your add-on's directory:

+ +

{{EmbedYouTube("cer9EUKegG4")}}

+ +

The add-on will now be installed, and will stay until you restart Firefox.

+ +

Now try visiting a page under "mozilla.org", and you should see the red border round the page:

+ +

{{EmbedYouTube("rxBQl2Z9IBQ")}}

+ +

Try experimenting a bit. Edit the content script to change the color of the border, or do something else to the page content. Save the content script, then reload the add-on's files by clicking the "Reload" button in about:debugging. You can see the changes right away:

+ +

{{EmbedYouTube("NuajE60jfGY")}}

+ + + +

Packaging and publishing

+ +

For other people to use your add-on, you need to package it and submit it to Mozilla for signing. To learn more about that, see "Publishing your WebExtension".

+ +

What's next?

+ +

Now you've got an idea of the process of developing a WebExtension for Firefox, try:

+ + -- cgit v1.2.3-54-g00ecf