User:MarkFinkle/Extensions

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"
      xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">
  <vbox flex="1">
    <label id="caption" value="Hello, welcome to my sidebar" />
    <!-- put more content or controls here -->
  </vbox>
</page>

Slide 3

Simple Visual