diff options
Diffstat (limited to 'files/fi/mozilla/add-ons')
| -rw-r--r-- | files/fi/mozilla/add-ons/index.html | 83 | ||||
| -rw-r--r-- | files/fi/mozilla/add-ons/webextensions/index.html | 85 | ||||
| -rw-r--r-- | files/fi/mozilla/add-ons/webextensions/what_are_webextensions/index.html | 60 |
3 files changed, 228 insertions, 0 deletions
diff --git a/files/fi/mozilla/add-ons/index.html b/files/fi/mozilla/add-ons/index.html new file mode 100644 index 0000000000..45157d094f --- /dev/null +++ b/files/fi/mozilla/add-ons/index.html @@ -0,0 +1,83 @@ +--- +title: Add-ons +slug: Mozilla/Add-ons +tags: + - Add-ons + - Extension + - Extensions + - Landing + - Mozilla + - NeedsTranslation + - TopicStub +translation_of: Mozilla/Add-ons +--- +<p>{{AddonSidebarMain}}</p> + +<p><span class="seoSummary">Add-ons allow developers to extend and modify the functionality of Firefox.</span> They are written using standard Web technologies - JavaScript, HTML, and CSS - plus some dedicated JavaScript APIs.</p> + +<p>Among other things, an add-on could:</p> + +<ul> + <li>Change the appearance or content of particular websites</li> + <li>Modify the Firefox user interface</li> + <li>Add new features to Firefox</li> +</ul> + +<p>There are several types of add-ons, but the most common type are extensions.</p> + +<h2 id="Developing_extensions">Developing extensions</h2> + +<p>In the past, there were several toolsets for developing Firefox extensions, but as of November 2017, extensions must be built using <a href="/en-US/docs/Mozilla/Add-ons/WebExtensions">WebExtensions APIs</a>. Other toolsets, such as overlay add-ons, bootstrapped add-ons, and the Add-on SDK, are no longer supported.</p> + +<p>Extensions written using WebExtensions APIs for Firefox are designed to be cross-browser compatible. In most cases, it will run in Chrome, Edge, and Opera with few if any changes. They are also fully compatible with multiprocess Firefox. You can see <a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/Browser_support_for_JavaScript_APIs">the APIs currently supported in Firefox and other browsers</a>.</p> + +<h3 id="Extension_Workshop">Extension Workshop</h3> + +<p>The <a href="https://extensionworkshop.com">Firefox Extension Workshop </a>can help you develop extensions for Firefox and give your users simple, yet powerful ways to customize their browsing experience. You’ll find:</p> + +<ul> + <li><a href="https://extensionworkshop.com/#about">Overview of the Firefox extension features</a></li> + <li><a href="https://extensionworkshop.com/documentation/develop/">Tools and processes for developing and testing</a></li> + <li><a href="https://extensionworkshop.com/documentation/publish/">How to publish your extension on addons.mozilla.org or distribute it yourself</a></li> + <li><a href="https://extensionworkshop.com/documentation/manage/">How to manage your published extension</a></li> + <li><a href="https://extensionworkshop.com/documentation/enterprise/">An enterprise guide for developing and using extensions</a></li> + <li><a href="https://extensionworkshop.com/documentation/themes/">How to develop themes for Firefox</a></li> + <li><a href="https://extensionworkshop.com/community/">Firefox developer communities</a></li> +</ul> + +<h3 id="Extensions_for_Firefox_for_Android">Extensions for Firefox for Android</h3> + +<p>In 2020, Mozilla will release a new Firefox for Android experience. This new, high-performance browser for Android has been rebuilt from the ground up using GeckoView, Mozilla’s mobile browser engine. We are currently building support for the WebExtensions API on GeckoView.</p> + +<h3 id="Migrate_an_existing_extension">Migrate an existing extension</h3> + +<p>If you maintain a legacy extension, such as an XUL overlay, bootstrapped, or Add-on SDK-based extension, you can still port it to use WebExtension APIs. There are some <a href="https://extensionworkshop.com/documentation/develop/porting-a-legacy-firefox-extension/">porting resources on Firefox Extension Workshop</a>, our site for Firefox-specific development resources.</p> + +<p>For more information about transition support, please visit our <a href="//wiki.mozilla.org/Add-ons/developer/communication">wiki page.</a></p> + +<h2 id="Publishing_add-ons">Publishing add-ons</h2> + +<p><a href="https://addons.mozilla.org">Addons.mozilla.org</a>, commonly known as "AMO," is Mozilla's official site for developers to list add-ons, and for users to discover them. By uploading your add-on to AMO, you can participate in our community of users and creators and find an audience for your add-on.</p> + +<p>You are not required to list your add-on on AMO, but your add-on must be signed by Mozilla else users will not be able to install it.</p> + +<p>For an overview for the process of publishing your add-on see <a href="https://extensionworkshop.com/documentation/publish/signing-and-distribution-overview/">Signing and distributing your add-on</a>.</p> + +<h2 id="Other_types_of_add-ons">Other types of add-ons</h2> + +<p>In addition to extensions, there are a few other add-on types that allow users to customize Firefox. Those add-ons include:</p> + +<ul> + <li> + <p><a href="/en-US/docs/Mozilla/Creating_a_spell_check_dictionary_add-on">User dictionaries</a> let you spell-check in different languages.</p> + </li> + <li> + <p><a href="https://support.mozilla.org/kb/use-firefox-interface-other-languages-language-pack">Language packs</a> let you have more languages available for the user interface of Firefox. </p> + </li> +</ul> + +<h2 id="Contact_us">Contact us</h2> + +<p>Check out the <a href="/en-US/docs/Mozilla/Add-ons/Contact_us">contact us</a> page for details on how to get help, keep up to date with add-ons news, and give us feedback.</p> + +<div></div> diff --git a/files/fi/mozilla/add-ons/webextensions/index.html b/files/fi/mozilla/add-ons/webextensions/index.html new file mode 100644 index 0000000000..a6444fc083 --- /dev/null +++ b/files/fi/mozilla/add-ons/webextensions/index.html @@ -0,0 +1,85 @@ +--- +title: Browser Extensions +slug: Mozilla/Add-ons/WebExtensions +tags: + - Add-ons + - Landing + - NeedsTranslation + - TopicStub + - WebExtensions +translation_of: Mozilla/Add-ons/WebExtensions +--- +<div>{{AddonSidebar}}</div> + +<p><span class="seoSummary">Extensions, or add-ons, can modify and enhance the capability of a browser. Extensions for Firefox are built using the WebExtensions API cross-browser technology.</span></p> + +<p>The technology for extensions in Firefox is, to a large extent, compatible with the <a href="https://developer.chrome.com/extensions">extension API</a> supported by Chromium-based browsers (such as Google Chrome, Microsoft Edge, Opera, Vivaldi). In most cases, extensions written for Chromium-based browsers run in Firefox with <a href="https://wiki.developer.mozilla.org/en-US/docs/Mozilla/Add-ons/WebExtensions/Porting_from_Google_Chrome">just a few changes</a>.</p> + +<section class="cleared" id="sect1"> +<ul class="card-grid"> + <li><span>Guides</span> + + <p>Whether you’re just beginning or looking for more advanced advice, learn about how extensions work and use the WebExtensions API from our extensive range of <a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/What_are_WebExtensions">tutorials and guides</a>.</p> + </li> + <li><span>References</span> + <p>Get comprehensive details about the methods, properties, types, and events of the <a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/Browser_support_for_JavaScript_APIs">WebExtensions APIs</a> and full details about the <a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/manifest.json">manifest keys</a>.</p> + </li> + <li><span>Firefox workflow</span> + <p>Discover how to build and publish extensions for Firefox: get the lowdown on developer tools, publication and distribution, and porting on <a href="https://extensionworkshop.com/">Extension Workshop</a>.</p> + </li> +</ul> + +<p><strong>If you have ideas or questions or need help,</strong> you can reach us on the <a href="https://mail.mozilla.org/listinfo/dev-addons">dev-addons mailing list</a> or in the <a href="https://matrix.to/#/!CuzZVoCbeoDHsxMCVJ:mozilla.org?via=mozilla.org&via=matrix.org&via=humanoids.be">Add-ons Room</a> on <a href="https://wiki.mozilla.org/Matrix">Matrix</a>.</p> + +<div class="topicpage-table"> +<div class="section"> +<h2 id="Get_started">Get started</h2> + +<p>Discover <a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/What_are_WebExtensions">what extensions can do</a> before building <a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/Your_first_WebExtension">your first extension.</a> Learn about the <a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/Anatomy_of_a_WebExtension">anatomy of an extension</a> and get an overview of the <a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/Firefox_workflow_overview">extension development and publication workflow, Firefox style</a>. Explore a little deeper with a comprehensive selection of <a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/Examples">example extensions</a> that you can run right in Firefox.</p> + +<h2 id="Concepts">Concepts</h2> + +<p>Get detailed information on the concept that underpin extensions <a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/API">from an overview of the JavaScript API</a>, through <a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/Content_scripts">content scripts,</a> <a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/Match_patterns">match patterns</a>, <a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/Working_with_files">working with files</a>, <a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/Internationalization">internationalization</a>, and <a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/Content_Security_Policy">content security policy</a>, to more advanced subjects such as <a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/Native_messaging">native messaging</a>, <a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/Using_the_devtools_APIs">using the devtools APIs</a>, and <a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/Native_manifests">native manifests</a>.</p> + +<h2 id="User_interface">User interface</h2> + +<p>Discover all the <a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/user_interface">user interface</a> components you can use in your extensions, with coding examples and tips.</p> + +<h2 id="How_to">How to</h2> + +<p>From patterns you’ll regularly use such as <a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/Working_with_the_Tabs_API">work with the Tabs API</a> and <a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/Add_a_button_to_the_toolbar">adding a button to the toolbar</a> to more advanced topics such as <a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/Intercept_HTTP_requests">intercepting HTTP requests</a> and <a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/Work_with_contextual_identities">working with contextual identities</a>, you’ll find a range of tutorials to get you started.</p> + +<ul> +</ul> + +<h2 id="Firefox_workflow">Firefox workflow</h2> + +<p>When you are ready to create your extension for Firefox or port your Chrome extension head over to <a href="https://extensionworkshop.com/">Extension Workshop</a>. It has details on:</p> + +<ul> + <li>The Firefox workflow, such as <a href="https://extensionworkshop.com/documentation/develop/temporary-installation-in-firefox/">temporarily installing extensions during development</a>, <a href="https://extensionworkshop.com/documentation/develop/debugging/">debugging</a>, <a href="https://extensionworkshop.com/documentation/develop/request-the-right-permissions/">request the right permissions</a>, and more.</li> + <li>The <a href="https://extensionworkshop.com/documentation/develop/getting-started-with-web-ext/">web-ext</a> developer tool.</li> + <li><a href="https://extensionworkshop.com/documentation/develop/porting-a-google-chrome-extension/">Porting a Google Chrome extension</a>, <a href="https://extensionworkshop.com/documentation/develop/differences-between-desktop-and-android-extensions/">differences between desktop and Android</a>, and more.</li> + <li><a href="https://extensionworkshop.com/documentation/publish/">Publishing and distribution overview</a>, <a href="https://extensionworkshop.com/documentation/publish/promoting-your-extension/">promoting your extension</a>, the <a href="https://extensionworkshop.com/documentation/manage/">extension lifecycle best practices</a>, and more.</li> +</ul> +</div> + +<div class="section"> +<h2 id="Reference">Reference</h2> + +<h3 id="JavaScript_APIs">JavaScript APIs</h3> + +<p>Get comprehensive details about the methods, properties, types, and events for all the <a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/API">JavaScript APIs</a>. There is also detailed information about the compatibility of each API with the major browsers. Most reference pages also include coding examples and links to the extension examples that use the API.</p> + +<h3 id="Manifest_keys">Manifest keys</h3> + +<p>Get full details about the <a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/manifest.json">manifest keys</a>, including all their properties and settings. There’s also detailed information on the <a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/Browser_compatibility_for_manifest.json">compatibility</a> of each key with the major browsers.</p> +</div> +</div> + +<div class="SnapLinksContainer" style="margin-left: 0px; margin-top: 0px; display: none;"> +<div class="SL_SelectionRect"> +<div class="SL_SelectionLabel"></div> +</div> +</div> +</section> diff --git a/files/fi/mozilla/add-ons/webextensions/what_are_webextensions/index.html b/files/fi/mozilla/add-ons/webextensions/what_are_webextensions/index.html new file mode 100644 index 0000000000..8a1eddb4b3 --- /dev/null +++ b/files/fi/mozilla/add-ons/webextensions/what_are_webextensions/index.html @@ -0,0 +1,60 @@ +--- +title: What are extensions? +slug: Mozilla/Add-ons/WebExtensions/What_are_WebExtensions +translation_of: Mozilla/Add-ons/WebExtensions/What_are_WebExtensions +--- +<div>{{AddonSidebar}}</div> + +<div class="blockIndicator note"> +<p>Jos olet jo perehtynyt selainlaajennusten peruskäsitteisiin, ohita tämä osa <a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/Anatomy_of_a_WebExtension">nähdäksesi, kuinka laajennustiedostot kootaan</a> . Käytä sitten <a href="/en-US/docs/Mozilla/Add-ons/WebExtensions#Reference">lähdeteos</a> alkaa rakentaa laajennus. Käy <a href="https://extensionworkshop.com/?utm_source=developer.mozilla.org&utm_medium=documentation&utm_campaign=your-first-extension">Firefox Extension Workshopissa</a> saadaksesi lisätietoja <a href="https://extensionworkshop.com/?utm_source=developer.mozilla.org&utm_medium=documentation&utm_campaign=your-first-extension">Firefoxin</a> testauksen, julkaisemisen ja laajennusten työnkulusta.</p> +</div> + +<p>Laajennus lisää ominaisuuksia ja toimintoja selaimeen. Se on luotu käyttämällä tuttuja verkkopohjaisia tekniikoita - HTML, CSS ja JavaScript. Se voi hyödyntää samoja web-sovellusliittymiä kuin verkkosivun JavaScript, mutta laajennuksella on myös pääsy omiin JavaScript-sovellusliittymiensä sarjoihin. Tämä tarkoittaa, että voit tehdä paljon enemmän laajennuksessa kuin koodilla verkkosivulla. Tässä on vain muutama esimerkki asioista, joita voit tehdä:</p> + +<p><strong>Paranna tai täydennä verkkosivustoa</strong> : Käytä lisäosaa toimittaa lisää selaimen sisäisiä ominaisuuksia tai tietoja verkkosivustoltasi. Anna käyttäjien kerätä tietoja vierailemiltasi sivuilta parantamaan tarjoamaasi palvelua.</p> + +<p><img alt="" src="https://mdn.mozillademos.org/files/15808/Amazon_add_on.png"></p> + +<p>Esimerkkejä: <a href="https://addons.mozilla.org/en-US/firefox/addon/amazon-browser-bar/">Amazon Assistant Firefoxille</a> , <a href="https://addons.mozilla.org/en-US/firefox/addon/onenote-clipper/">OneNote Web Clipper</a> ja <a href="https://addons.mozilla.org/en-US/firefox/addon/grammarly-1/">Grammarly Firefoxille</a></p> + +<p><strong>Anna käyttäjien näyttää persoonallisuutensa</strong> : Selainlaajennukset voivat manipuloida verkkosivujen sisältöä; esimerkiksi antaa käyttäjien lisätä suosikkilogonsa tai -kuvansa taustaksi jokaiselle vierailemalleen sivulle. Laajennusten avulla käyttäjät voivat myös päivittää Firefox-käyttöliittymän ulkoasun samalla tavalla kuin erilliset <a href="https://developer.mozilla.org/en-US/Add-ons/Themes/Theme_concepts">teeman lisäosat</a> .</p> + +<p><img alt="" src="https://mdn.mozillademos.org/files/15809/MyWeb_New_Tab_add_on.png" style="height: 398px; width: 540px;"></p> + +<p>Esimerkkejä: <a href="https://addons.mozilla.org/en-US/firefox/addon/myweb-new-tab/">MyWeb New Tab</a> , <a href="https://addons.mozilla.org/en-US/firefox/addon/tabliss/">Tabliss</a> ja <a href="https://addons.mozilla.org/en-US/firefox/addon/vivaldifox/">VivaldiFox</a></p> + +<p><strong>Lisää tai poista sisältöä verkkosivuilta</strong> : Voit auttaa käyttäjiä estämään häiritseviä mainoksia verkkosivuilta, tarjoamaan pääsyn matkaoppaaseen aina, kun maa tai kaupunki mainitaan verkkosivulla, tai alustamaan sivun sisältö uudelleen yhtenäisen lukukokemuksen tarjoamiseksi. Kyky käyttää ja päivittää sekä sivun HTML: ää että CSS: ää laajennusten avulla käyttäjät voivat nähdä verkon haluamallaan tavalla.</p> + +<p><img alt="" src="https://mdn.mozillademos.org/files/15807/ublock_origin_add_on.png" style="height: 480px; width: 640px;"></p> + +<p>Esimerkkejä: <a href="https://addons.mozilla.org/en-US/firefox/addon/ublock-origin/">uBlock Origin</a> , <a href="https://addons.mozilla.org/en-US/firefox/addon/reader/">Reader</a> ja <a href="https://addons.mozilla.org/en-US/firefox/addon/toolbox-google-play-store/">Toolbox for Google Play Store ™</a></p> + +<p><strong>Lisää työkaluja ja uusia</strong> selausominaisuuksia: Lisää uusia ominaisuuksia tehtäväpalkkiin tai luo QR-koodikuvia URL-osoitteista, hyperlinkeistä tai sivutekstistä. Joustavien käyttöliittymäasetusten ja <a href="/en-US/Add-ons/WebExtensions">WebExtensions-sovellusliittymien tehon avulla</a> voit helposti lisätä uusia ominaisuuksia selaimeen. Ja voit parantaa melkein minkä tahansa verkkosivuston ominaisuuksia tai toimintoja, sen ei tarvitse olla verkkosivustosi.</p> + +<p><img alt="" src="https://mdn.mozillademos.org/files/15806/QR_Code_Image_Generator_add_on.png"></p> + +<p>Esimerkkejä: <a href="https://addons.mozilla.org/en-US/firefox/addon/swimlanes-for-trello/">Trello-</a> ja <a href="https://addons.mozilla.org/en-US/firefox/addon/tomato-clock/">tomaattikellon </a><a href="https://addons.mozilla.org/en-US/firefox/addon/swimlanes-for-trello/">uimarannat</a></p> + +<p><strong>Pelit</strong> : Tarjoa perinteisiä tietokonepelejä offline-pelitoiminnoilla tai tutustu uusiin pelimahdollisuuksiin; esimerkiksi sisällyttämällä pelattavuus jokapäiväiseen selaamiseen.</p> + +<p> <img alt="" src="https://mdn.mozillademos.org/files/15805/Asteroids_in_Popup_add_on%20.png" style="height: 438px; width: 700px;"></p> + +<p>Esimerkkejä: <a href="https://addons.mozilla.org/en-US/firefox/addon/asteroids-in-popup/">Asteroidit ponnahdusikkunassa</a> , <a href="https://addons.mozilla.org/en-US/firefox/addon/solitaire-card-game-new-tab/">pasianssin korttipeli Uusi välilehti</a> ja <a href="https://addons.mozilla.org/en-US/firefox/addon/2048-prime/">2048 Prime</a> .</p> + +<p><strong>Lisää kehitystyökaluja</strong> : Voit tarjota verkkokehitystyökaluja yrityksesiä tai kehittää hyödyllisen tekniikan tai lähestymistavan verkkokehitykseen, jonka haluat jakaa. Joko niin, voit parantaa sisäänrakennettuja Firefox-kehittäjätyökaluja lisäämällä uuden välilehden kehittäjän työkalupalkkiin.</p> + +<p><img alt="" src="https://mdn.mozillademos.org/files/15804/aXe_Developer_Tools_add_on.png" style="height: 261px; width: 700px;"></p> + +<p>Esimerkkejä: <a href="https://addons.mozilla.org/en-US/firefox/addon/web-developer/">Web Developer</a> , <a href="https://addons.mozilla.org/en-US/firefox/addon/react-devtools/">Web React Developer Tools</a> ja <a href="https://addons.mozilla.org/en-US/firefox/addon/axe-devtools/">ax Developer Tools</a></p> + +<p>Firefoxin laajennukset rakennetaan <a href="/en-US/Add-ons/WebExtensions">WebExtensions API: illa</a> , joka on selainten välinen järjestelmä laajennusten kehittämiseksi. Suurelta osin sovellusliittymä on yhteensopiva <a class="external external-icon" href="https://developer.chrome.com/extensions">laajennussovellusliittymän kanssa,</a> jota Google Chrome ja Opera tukevat. Näille selaimille kirjoitetut laajennukset toimivat useimmissa tapauksissa Firefoxissa tai Microsoft Edgessä vain muutamalla <a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/Porting_a_Google_Chrome_extension">muutoksella</a> . API on myös täysin yhteensopiva <a href="/en-US/Firefox/Multiprocess_Firefox">moniprosessisen Firefoxin kanssa</a> .</p> + +<p>Jos sinulla on ideoita tai kysyttävää tai tarvitset apua <a href="https://extensionworkshop.com/documentation/develop/porting-a-legacy-firefox-extension">vaeltavien legacy lisäosa WebExtensions API</a> , pääsette on <a class="external external-icon" href="https://mail.mozilla.org/listinfo/dev-addons">dev-lisät postituslistalle</a> tai <a href="https://chat.mozilla.org/#/room/#addons:mozilla.org">lisäosat huoneen</a> päälle <a href="https://wiki.mozilla.org/Matrix">Matrix</a> .</p> + +<h2 id="Mitä_seuraavaksi">Mitä seuraavaksi?</h2> + +<ul> + <li>Käy läpi yksinkertaisen laajennuksen kehittäminen <a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/Your_first_WebExtension">ensimmäisessä laajennuksessa</a> .</li> + <li>Opi laajennuksen rakenteesta laajennuksen <a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/Anatomy_of_a_WebExtension">anatomiassa</a> .</li> + <li>Kokeile esimerkkilaajennuksia <a href="/en-US/Add-ons/WebExtensions/Examples">esimerkkilaajennuksissa</a> .</li> +</ul> |