From MozillaWiki
Jump to: navigation, search

Let's Make an Extension!

Slide 1:

Technology Behind Extensions

  • Powerful widget-based markup language
    • XUL is an HTML-like markup language designed for rich applications
  • Based on existing standards
    • Cascading Style Sheets (CSS)
    • Document Object Model (DOM)
    • JavaScript, including E4X (ECMAScript for XML)
    • XML
  • Platform portability
    • Extensions can run anywhere Firefox runs with little or no modifications
  • Easy localization
    • Locale specific resources are easily separated from presentation and code
    • Automatically chooses appropriate locale at startup

Slide 2

Basic Extension Example

Manifest file : Tell Firefox about my extension

content emptysidebar content/
overlay chrome://browser/content/browser.xul chrome://mysidebar/content/overlay.xul

Overlay file : Merge my extension's UI into Firefox

<?xml version="1.0"?>
<?xml-stylesheet href="chrome://global/skin/" type"text/css"?>

<page id="mySidebar" title="My Sidebar"
  <vbox flex="1">
    <label id="caption" value="Hello, welcome to my sidebar" />
    <!-- put more content or controls here -->

Slide 3

Simple Visual