Firefox 主题制作简介(页 1) - 主题 - 论坛 - Mozest 社区 - 专业的 Mozilla 技术专题社区

baggio 发表于 2006-5-28 04:36

<div align='center'><b><span style="font-size:12pt;line-height:100%"><span style="color:#ff0000">Firefox 主题制作简介</span></span></b> <a href="#about">[跳过目录]</a></div>
<ul><li><a href="#about"><b>关于这个帖子</b></a><ul><li><a href="#re">mozine 论坛相关帖子</a></li><li><a href="#sit">主题下载相关站点</a></li></ul></li><li><a href="#theme"><b>为 Firefox 制作主题</b></a><ul><li><a href="#vor">准备工作</a></li><li><a href="#zip">文件压缩</a></li><li><a href="#classic">Classic.jar 目录结构</a></li></ul></li><li><a href="#ins"><b>安装您的新主题</b></a><ul><li><a href="#copy">复制所要替换的文件</a></li><li><a href="#cra">建立安装文件</a><ul><li><a href="#Contents">contents.rdf</a></li><li><a href="#install">install.rdf</a><ul><li><a href="#a">install.rdf 中必填的属性</a></li><li><a href="#b">install.rdf 中选填的属性</a><ul><li><a href="#update">update.rdf（自动更新）</a></li></ul></li></ul></li></ul></li></ul></li><li><a href="#2"><b>由 1.5.0.x 到 2.0 的变化</b></a><ul><li><a href="#one">browser/browser.css</a></li><li><a href="#two">help.css</a></li><li><a href="#three">extensions.css</a></li><li><a href="#four">profileSelection.css</a></li></ul></li><li><a href="#book"><b>相关知识库</b></a></li><li><a href="#out"><b>Firefox 主题发布</b></a><ul><li><a href="#on">在线安装</a></li><li><a href="#off">在 Update 中国发布</a></li></ul></li></ul><br>

baggio 发表于 2006-5-28 04:45

<h3><a name="about"></a><div align='center'><b>关于这个帖子</b></div></h3><br /><br />本贴是写给 mozine 论坛对 firefox 主题修改与制作感兴趣的同学们的，非常粗浅的介绍了一下 firefox 的主题结构，如果想写出很漂亮的主题，光靠这贴子远远不够，还需要很牛的图形处理能力以及相关的 CSS 知识，大家要努力。<br /><br /><span style="color:#FF0000"><b>做人要厚道，转载请注明出自 mozine.org，谢谢。</b></span><br /><br /><span style="color:#FF0000">免责条款：随着 firefox 的主题结构不断更新，也许本贴中的部分内容会由于没有及时更新而不再适用。</span><br /><br />写的比较仓促，欢迎大家补充，谢谢。<br /><br /><a name="re"></a><span style="color:#CC0000"><b>mozine 论坛相关贴子：</b></span><ol type='1'><li><a href="http://forums.mozine.org/index.php?showtopic=176" target="_blank">userContent.css, 设置 userContent.css — 改变网页的外观</a></li><li><span style="color:#999999">userChrome.css, 设置 userChrome.css — 改变 FireFox 的外观（整理编辑中....）</span></li><li><a href="http://forums.mozine.org/index.php?showtopic=5119" target="_blank">mozine 火狐桌面秀</a></li><li><a href="http://forums.mozine.org/index.php?showtopic=3891" target="_blank">Firefox 平滑主题教程</a></li><li><a href="http://forums.mozine.org/index.php?showtopic=3592" target="_blank">Thunderbird 模拟 Tiger Mail 教程</a></li></ol><a name="sit"></a><span style="color:#CC0000"><b>主题下载相关站点：</b></span><ul><li><a href="http://addons.mozine.org/" target="_blank"><b>Mozilla Update 中国 (本站)</b></a><ul><li><a href="http://addons.mozine.org/firefox/themes/" target="_blank">firefox 主题</a></li><li><a href="http://addons.mozine.org/thunderbird/themes/" target="_blank">thunderbird主题</a></li></ul></li><li><a href="https://addons.mozilla.org/" target="_blank"><b>Addons.Mozilla.org</b></a><ul><li><a href="https://addons.mozilla.org/firefox/themes/" target="_blank">firefox 主题</a></li><li><a href="https://addons.mozilla.org/thunderbird/themes/" target="_blank">thunderbird主题</a></li></ul></li><li><a href="http://www.deviantart.com/" target="_blank"><b>DeviantArt.com</b></a><ul><li><a href="http://skins.deviantart.com/web/firefox/" target="_blank">firefox 主题</a></li><li><a href="http://skins.deviantart.com/email/thunderbird/" target="_blank">thunderbird主题</a></li></ul></li></ul>

baggio 发表于 2006-5-28 05:24

<h3><a name="theme"></a><div align='center'><b>为 Firefox 制作主题</b></div></h3><br /><a name="vor"></a><b><span style="color:#CC0000">准备工作</span></b><br /><br />我相信每一个用户都有能力制作出自己的主题，不过随着对 firefox 主题认识的逐步深入您会发现这项工作其实并不像想象中的那么简单，anyway，在开始之前您一定要对 firefox 主题具备一定的常识：<span style="color:#33CC00">图形处理</span>，<span style="color:#33CC00">文件压缩</span>和<span style="color:#33CC00">如何编辑 CSS 文件</span>。<br /><br />Firefox 的按钮使用了标准的 gif, png 和 jpeg 格式并使用了 CSS 来定义浏览器的整个图形界面。<br /><br /><a name="zip"></a><b><span style="color:#CC0000">文件压缩</span></b><br /><br />首次制作主题您可以先在别人已经发表的主题上进行修改，为了保持主题的结构完整性以及可能涉及到的授权问题，我建议您可以先使用 firefox 默认主题进行修改，关于这个默认主题，您可以在 Firefox 安装目录下搜索 "<span style="color:#FF0000">classic.jar</span>" 。 <br /><br />XXX.jar 实事上是更改了扩展名的 zip 压缩文件，您可以使用 winrar , winzip , 7z 等解压工具对她进行操作。<br /><br />附 Classic.jar 路径：<br /><br /><b>Linux:</b><br /> * /usr/lib/MozillaFirefox/chrome/classic.jar<br /><br /><b>Windows:</b><br /> * \Program Files\Mozilla Firefox\chrome\classic.jar<br /><b><br />Mac OS X:</b><br /> * 转到 “应用程序” 文件夹<br /> * 按住 Control 键猛击应用程序的图标（Firefox的图标）,如果你有双键鼠标那就是右键。选择“显示包内容”<br /> * 转到里边的 contents/MacOS/Chrome/classic.jar<br /><br />注：为了保持 firefox 目录结构的整洁，建议将 classic.jar 复制到别的文件夹进行修改操作。<br /><br /><a name="classic"></a><b><span style="color:#CC0000">Classic.jar 目录结构</span></b><br /><br />Classic.jar 根目录下您会发现有一个 skin 目录和 preview.png , icon.png 。<br /><br />preview.png 由于会出现在 Firefox 主题列表的预览框中，所以建议不要做太大。<br /><br />在 Classic.jar\skin\classic 目录下包含有以下目录：<br /><br /><span style="color:#CC33CC">browser</span>：Browser 包括了所有的工具栏图标，书签管理器图标以及属性窗口。 <br /><br /><span style="color:#CC33CC">global</span>： Global 是 firefox 主题最重要的一个目录，她包含了几乎所有的定义浏览器外观的 CSS 文件。<br /><br /><span style="color:#CC33CC">mozapps</span>：Mozapps 里包括了浏览器附件的所有图标和风格定义，比如扩展管理器，升级向导等等。 <br /><br /><span style="color:#CC33CC">help</span>：这个目录下包括了所有定义 help 窗口的主题文件。<br /> <br /><span style="color:#CC33CC">communicator</span>：这个文件作用不是很大，不过具体做什么的，我还没有搞清楚 <img src="http://forums.mozine.cn/style_emoticons/<#EMO_DIR#>/ph34r.gif" style="vertical-align:middle" emoid=":ph34r:" border="0" alt="ph34r.gif" /> <img src="http://forums.mozine.cn/style_emoticons/<#EMO_DIR#>/ph34r.gif" style="vertical-align:middle" emoid=":ph34r:" border="0" alt="ph34r.gif" /> <img src="http://forums.mozine.cn/style_emoticons/<#EMO_DIR#>/ph34r.gif" style="vertical-align:middle" emoid=":ph34r:" border="0" alt="ph34r.gif" /> <br /><br /><h3><a name="ins"></a><div align='center'><b>安装您的新主题</b></div></h3><br /><br />首先您要替换默认主题，将她可以被 firefox 正确识别并安装。那么咱们暂时先给她起个好听的名字，叫 <span style="color:#993399">otherside </span>吧。 <img src="http://forums.mozine.cn/style_emoticons/<#EMO_DIR#>/wub.gif" style="vertical-align:middle" emoid=":wub:" border="0" alt="wub.gif" /> <img src="http://forums.mozine.cn/style_emoticons/<#EMO_DIR#>/wub.gif" style="vertical-align:middle" emoid=":wub:" border="0" alt="wub.gif" /> <img src="http://forums.mozine.cn/style_emoticons/<#EMO_DIR#>/wub.gif" style="vertical-align:middle" emoid=":wub:" border="0" alt="wub.gif" /> <br /> <br /><a name="copy"></a><span style="color:#FF0000"><b>复制所要替换的文件</b></span><br /><br />第一步，要将正确的文件放到正确的地方，所以您先建一个文件夹，叫 otherside，然后将上面提到的几个目录 browser, global, communicator, help 和 mozapps 都放到建好的 otherside 文件夹里，lol 千万别忘了上面还提到的 icon.png 和 preview.png 两个图片。<br /><br /><a name="cra"></a><span style="color:#FF0000"><b>建立安装文件</b></span><br /> <br /><a name="Contents"></a><span style="color:#FF6600"><b>Contents.rdf</b></span><br /><br />这个文件的主要作用是将您所更改的图标和 CSS 正确的定义到浏览器界面上去。创建一份 contents.rdf 然后将她放到 \otherside，然后用文本编辑器轻轻的打开她，然后将她作如下修改 (注意文中 <span style="color:#FF0000">otherside</span> 的部分)：<br /><br /><div class='codetop'>代码</div><div class='codemain'><?xml version="1.0"?><br /><br /><RDF:RDF xmlns:RDF="http://www.w3.org/1999/02/22-rdf-syntax-ns#"<br />         xmlns:chrome="http://www.mozilla.org/rdf/chrome#"><br /><br />  <br />  <RDF:Seq about="urn:mozilla:skin:root"><br />    <RDF:li resource="urn:mozilla:skin:otherside" /><br />  </RDF:Seq><br /><br />  <RDF:Description about="urn:mozilla:skin:otherside"<br />        chrome:displayName="Otherside"<br />        chrome:accessKey="O"<br />        chrome:author="Mozine"<br />        chrome:description="教你怎样做主题 by mozine"<br />        chrome:name="otherside"<br />        chrome:image="preview.png"><br />    <chrome:packages><br />      <RDF:Seq about="urn:mozilla:skin:otherside:packages"><br />        <RDF:li resource="urn:mozilla:skin:otherside:communicator"/><br />        <RDF:li resource="urn:mozilla:skin:otherside:editor"/><br />        <RDF:li resource="urn:mozilla:skin:otherside:global"/><br />        <RDF:li resource="urn:mozilla:skin:otherside:messenger"/><br />        <RDF:li resource="urn:mozilla:skin:otherside:navigator"/><br />      </RDF:Seq><br />    </chrome:packages><br />  </RDF:Description><br /><br />  <br />  <RDF:Description chrome:skinVersion="1.0" about="urn:mozilla:skin:otherside:communicator"/><br />  <RDF:Description chrome:skinVersion="1.0" about="urn:mozilla:skin:otherside:editor"/><br />  <RDF:Description chrome:skinVersion="1.0" about="urn:mozilla:skin:otherside:global"/><br />  <RDF:Description chrome:skinVersion="1.0" about="urn:mozilla:skin:otherside:messenger"/><br />  <RDF:Description chrome:skinVersion="1.0" about="urn:mozilla:skin:otherside:navigator"/><br /></RDF:RDF></div>

baggio 发表于 2006-5-28 06:14

<a name="install"></a><span style="color:#FF6600"><b>install.rdf</b></span><br /><br /><span style="color:#FF0000">( 注：这一部分对于 mozilla 扩展的 install.rdf 也同样适用)</span><br /><br />这个文件记录了主题的一些最基本的信息以及指定自动更新路径，并确保主题可以正确的安装到 firefox 上。从源文件中复制一份 install.rdf 然后将她放到<span style="color:#FF6600"> \otherside</span> 目录下，然后用文本编辑器轻轻的打开她，install.rdf 的正确格式如下 :<br /><br /><div class='codetop'>代码</div><div class='codemain'><?xml version="1.0"?><br /><br /><RDF xmlns="http://www.w3.org/1999/02/22-rdf-syntax-ns#"<br />     xmlns:em="http://www.mozilla.org/2004/em-rdf#"><br /><br />  <Description about="urn:mozilla:install-manifest"><br />    <-- properties --><br />  </Description>      <br /></RDF></div><br /><br /><a name="a"></a><b><span style="color:#009900">install.rdf 中必须定义的属性：</span></b><br /><br /><span style="color:#FF0000">em:name</span><br /> 主题的名字，别忘了。<br /><br /><div class='codetop'>代码</div><div class='codemain'><em:name>otherside</em:name></div><br /><br /><span style="color:#FF0000">em:id</span><br /> 您可以在<a href="http://www.hoskinson.net/webservices/guidgeneratorclient.aspx" target="_blank"> <b>这个页面 </b></a>自动生成 GUID，或者从网上下载 GuidGen 来生成 ID 。<br /><br /><div class='codetop'>代码</div><div class='codemain'><em:id>{daf44bf7-a45e-4450-979c-91cf07434c3d}</em:id></div><br /><br /><span style="color:#FF0000">em:version</span><br /> 版本号<br /><div class='codetop'>代码</div><div class='codemain'><em:version>4.6</em:version></div><br /><br /><span style="color:#FF0000">em:targetApplication</span><br /> 这个值定义了主题的兼容程序及其最大最小版本号，如下：<br /><div class='codetop'>代码</div><div class='codemain'><em:targetApplication><br />    <Description><br />      <em:id>{ec8030f7-c20a-464f-9b0e-13a3a9e97384}</em:id><br />      <em:minVersion>1.0</em:minVersion><br />      <em:maxVersion>1.5.0.3</em:maxVersion><br />    </Description><br />  </em:targetApplication></div><br /><br />提示： <br /> Firefox {ec8030f7-c20a-464f-9b0e-13a3a9e97384}<br /> Thunderbird {3550f703-e582-4d05-9a08-453d09bdfdc6}<br /><br /><a name="b"></a><b><span style="color:#009900">install.rdf 中选填的属性：</span></b><br /><br /><span style="color:#FF0000">em:description</span><br /> 扩展或者主题的简短描述<br /><div class='codetop'>代码</div><div class='codemain'><em:description>Creating a Theme for Firefox</em:description></div><br /><br /><span style="color:#FF0000">em:creator</span><br /> 作者 ID，您非要用真用我也没办法。<br /> <div class='codetop'>代码</div><div class='codemain'><em:creator>mozine</em:creator></div><br /><span style="color:#FF0000"><br />em:contributor</span><br /> 贡献者，您可以不写，也可也写很多条。<br /><div class='codetop'>代码</div><div class='codemain'><em:contributor>baggio@mozine.org</em:contributor></div><br /><br /><span style="color:#FF0000">em:homepageURL</span><br /> 主页链接<br /><div class='codetop'>代码</div><div class='codemain'><em:homepageURL>http://www.mozine.org/</em:homepageURL></div><br /><br /><a name="update"></a><span style="color:#FF6600"><b>update.rdf</b></span><br /><br /><span style="color:#FF0000">em:updateURL</span><br /> 自动更新<br /><br />假如你存放主题的主机在 update.mozilla.org 或者本站的 update 的话就，建议就不要在 install.rdf 中定义自动更新了。<br /><br />如果你想实现自动更新，首先要在 install.rdf 中定义 em:updateURL，这个 URL 应该是 RDF 格式并且存放在一个最好你有全部管理权限的服务器上。然后 FF 的更新系统会定期的检查这个 RDF 文件，如果有更新可以自动更新。<br /><br />当然你也可以使用 PHP 或 CGI 动态生成自动更新的回应 RDF 文档，参数如下：<br /><br />%ITEM_ID% 被更新的主题的 GUID<br />%ITEM_VERSION% 被更新的主题的版本号<br />%APP_ID% 新版的主题的 GUID<br />%APP_VERSION% 新版主题的版本号<br /><br />比如：<br /><br /><div class='codetop'>代码</div><div class='codemain'><em:updateURL>http://www.mozine.org/update.cgi?id=%ITEM_ID%&version=%ITEM_VERSION%</em:updateURL></div><br /><br />然后你要自己编写在 em:updateURL 定义的 RDF 文件，然后放到你自己的服务器上：<br /><br /><div class='codetop'>代码</div><div class='codemain'><RDF:Description about="urn:mozilla:extension:{主题 GUID}"><br /><em:version><版本号></em:version><br /><em:updateLink><更新主题绝对链接></em:updateLink><br /></RDF:Description></div><br /><br />附：在这里提供一份小人从<a href="http://blog.osxcn.com/firefox-theme-update.html#more-327" target="_blank"> Nicky Blog</a> 上抄袭到的一段参考 update.rdf 文件, 谢谢 Nicky 大大 <img src="http://forums.mozine.cn/style_emoticons/<#EMO_DIR#>/wub.gif" style="vertical-align:middle" emoid=":wub:" border="0" alt="wub.gif" /> <img src="http://forums.mozine.cn/style_emoticons/<#EMO_DIR#>/wub.gif" style="vertical-align:middle" emoid=":wub:" border="0" alt="wub.gif" /> ：<br /><br /><div class='codetop'>代码</div><div class='codemain'><?xml version="1.0"?><br /><r:RDF xmlns:r="http://www.w3.org/1999/02/22-rdf-syntax-ns#" xmlns="http://www.mozilla.org/2004/em-rdf#"><br /> <br /><r:Description about="urn:mozilla:theme:{xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx}"><br /><updates><br /><r:Seq><br /><r:li><br /><r:Description><br /><version>1.5.1</version><br /> <br /><targetApplication><br /><r:Description><br /><id>{ec8030f7-c20a-464f-9b0e-13a3a9e97384}</id><br /><minVersion>0.8</minVersion><br /><maxVersion>1.6</maxVersion><br /><updateLink>http://www.site.com/theme.jar</updateLink><br /></r:Description><br /></targetApplication><br /> <br /></r:Description><br /></r:li><br /></r:Seq><br /></updates><br /> <br /></r:Description><br /></r:RDF></div>

baggio 发表于 2006-5-28 06:24

<h3><a name="2"></a><div align='center'><b>Firefox 主题从 1.5.0.x 到 2.0 的变化</b></div></h3><br /><br /><a name="one"></a><span style="color:#FF6600"><b>browser/browser.css</b></span> 中<br /><br />下列代码被移除：<br /><br /><div class='codetop'>代码</div><div class='codemain'>/* mail button */<br /><br />#mail-button {<br />  -moz-image-region: rect(0px 360px 24px 336px);<br />}<br />#mail-button:hover {<br />  -moz-image-region: rect(24px 360px 48px 336px);<br />}<br />#mail-button[disabled="true"] {<br />  -moz-image-region: rect(48px 360px 72px 336px);</div><br /><br /><div class='codetop'>代码</div><div class='codemain'>/* mail button */<br /><br />toolbar[iconsize="small"] #mail-button {<br />  -moz-image-region: rect(0px 240px 16px 224px);<br />}<br />toolbar[iconsize="small"] #mail-button:hover {<br />  -moz-image-region: rect(16px 240px 32px 224px);<br />}<br />toolbar[iconsize="small"] #mail-button[disabled="true"] {<br />  -moz-image-region: rect(32px 240px 48px 224px);<br />}</div><br /><br />下列代码发生了改变：<br /><br />1.5.0.x 中<br /><div class='codetop'>代码</div><div class='codemain'>/* ::::: go button ::::: */<br /><br />#go-button {<br />  list-style-image: url("chrome://browser/skin/Go.png");<br />  -moz-image-region: rect(0px 20px 20px 0px);<br />  padding-top: 2px;<br />  padding-bottom: 2px;<br />  -moz-padding-start: 3px;<br />  -moz-padding-end: 5px;<br />}</div><br /><br />2.0 中变为：<br /><div class='codetop'>代码</div><div class='codemain'>/* ::::: go button ::::: */<br /><br />#go-container {<br />  -moz-box-orient: vertical; /* for go button flex hack */<br />}<br /><br />#go-button {<br />  -moz-box-flex: 1; /* expand to fill toolbar height */<br />  list-style-image: url("chrome://browser/skin/Go.png");<br />  -moz-image-region: rect(0px 20px 20px 0px);<br />  padding-top: 2px;<br />  padding-bottom: 2px;<br />  -moz-padding-start: 3px;<br />  -moz-padding-end: 5px;<br />}</div><br /><br />1.5.0.x 中<br /><div class='codetop'>代码</div><div class='codemain'>#go-button[disabled="true"] {<br />  -moz-image-region: rect(0px 60px 20px 40px);<br />}<br /><br />#go-button > .toolbarbutton-text {<br />  display: -moz-box !important;<br />}</div><br /><br />2.0 中变为<br /><div class='codetop'>代码</div><div class='codemain'>#go-button[disabled="true"] {<br />  -moz-image-region: rect(0px 60px 20px 40px);<br />}<br /><br />#go-button > .toolbarbutton-icon {<br />  margin: 0;<br />}<br /><br />#go-button > .toolbarbutton-text {<br />  display: -moz-box !important;<br />  margin: 0 2px 1px 2px !important;<br />}</div><br /><br />在 2.0 中新加入以下代码：<br /><br /><div class='codetop'>代码</div><div class='codemain'>#places-bookmark {<br />  list-style-image: url("chrome://browser/skin/bookmarks/Bookmarks-toolbar.png");<br />  -moz-image-region: rect(0px 24px 24px 0px);<br />}<br /><br />#places-subscribe {<br />  list-style-image: url("chrome://browser/skin/page-livemarks.png");<br />  opacity: 1.0;<br />}<br /><br />#places-subscribe[disabled="true"] {<br />  opacity: 0.3;<br />}<br /><br />#bookmarksBarShowPlaces {<br />  list-style-image: url("chrome://browser/skin/places/places-icon.png");<br />}<br /><br /><br />/* Personal toolbar */<br />.toolbar-drop-indicator {<br />  height: 16px;<br />  width: 5px;<br />  margin-bottom: -8px;<br />  position: relative;<br />  background: url('chrome://browser/skin/places/toolbarDropMarker.png') 50% 50% no-repeat;<br />}<br /><br />.toolbar-drop-indicator-bar {<br />  display: none;<br />  height: 16px;<br />  margin-bottom: -16px;<br />  margin-left: 4px;<br />  position: relative;<br />}<br /><br />.toolbar-drop-indicator-bar[dragging="true"] {<br />  display: -moz-box;<br />}<br /><br />toolbarbutton.bookmark-item[dragover="true"][open="true"] {<br />  -moz-appearance: none;<br />  background: Highlight !important;<br />  color: HighlightText !important;<br />  list-style-image: url('chrome://browser/skin/places/folderDragOver.png') !important;<br />  -moz-image-region: rect(0px, 16px, 16px, 0px) !important;<br />}<br /><br />.bookmark-item[dragover-into="true"] {<br />  background: Highlight !important;<br />  color: HighlightText !important;<br />}<br /><br />.bookmark-item[dragover-top="true"] {<br />  -moz-border-top-colors: #000000;<br />}<br /><br />.bookmark-item[dragover-bottom="true"] {<br />  -moz-border-bottom-colors: #000000;</div><br /><br /><a name="two"></a><span style="color:#FF6600"><b>help.css 中</b><br /></span><br />以下代码被添加：<br /><br /><div class='codetop'>代码</div><div class='codemain'>#context-copy[disabled="true"] {<br />  visibility: collapse;<br />}</div><br /><br /><a name="three"></a><b><span style="color:#FF6600">extensions.css</span></b> 中<br /><br />以下代码由 1.5.0.x 中<br /><div class='codetop'>代码</div><div class='codemain'>extension[disabled="true"][compatible="false"] .extension-item-description,<br />extension[incompatibleUpdate="true"] .extension-item-description {<br />  color: #C77173;<br />}</div><br />在 2.0 中变为：<br /><div class='codetop'>代码</div><div class='codemain'>extension[disabled="true"][compatible="false"] .extension-item-description,<br />extension[satisfiesDependencies="false"] .extension-item-description,<br />extension[incompatibleUpdate="true"] .extension-item-description {<br />  color: #C77173;<br />}</div><br /><br /><a name="four"></a><span style="color:#FF6600"><b>profileSelection.css</b></span> 中<br /><br />以下代码由 1.5.0.x 中<br /><div class='codetop'>代码</div><div class='codemain'>#profiles > listitem {<br />  list-style-image: url("chrome://mozapps/skin/profile/profileicon.gif");<br />}</div><br />在 2.0 中变为：<br /><div class='codetop'>代码</div><div class='codemain'>#profiles > listitem {<br />  list-style-image: url("chrome://mozapps/skin/profile/profileicon.png");<br />}</div><br /><br /><h3><a name="book"></a><div align='center'><b>相关知识库</b></div></h3><br /><br />很可惜，我知道大家很期待这部分，可是技术文档都是英文的，最关键的部分我实在没有时间翻译了，所以只好给出大家相关链接，如果有时间一定会补上，不好意思：<br /><br /><a href="http://www.mozilla.org/projects/xul/" class="external text" title="http://www.mozilla.org/projects/xul/" rel="nofollow">XUL (XML User Interface Language)</a><br /><br /><a href="http://xulplanet.mozdev.org/" class="external text" title="http://xulplanet.mozdev.org/" rel="nofollow">XULPlanet</a><br /><br /><a href="http://w3.org/tr/html401" class="external text" title="http://w3.org/tr/html401" rel="nofollow">HTML (HyperText Markup Language)</a><br /> <br /><a href="http://www.w3.org/XML/" class="external text" title="http://www.w3.org/XML/" rel="nofollow">XML (Extensible Markup Language)</a><br /><br /><a href="http://www.w3.org/RDF/" class="external text" title="http://www.w3.org/RDF/" rel="nofollow">RDF (Resource Description Framework)</a><br /><br /><h3><a name="out"><div align='center'><b>Firefox 主题发布</b></a></div></h3><br /><br /><a name="on"></a><span style="color:#CC0000"><b>在线安装：</b></span><br /><br />如果您有自己的网站，想将自己制作的主题放到自己的主页上直接供 firefox 用户在线安装，下面的 javascript 可能会派上用场：<br /><br /><div class='codetop'>代码</div><div class='codemain'><a href="java script:InstallTrigger.installChrome(InstallTrigger.SKIN, <br /> 'otherside.jar', '我做的主题')">安装我制作的主题</a></div><br /><br /><a name="off"></a><span style="color:#CC0000"><b>在 <a href="http://addons.mozine.org/firefox/themes/" target="_blank">Update 中国</a> 发布：</b></span><br /><br />如果您想将自己制作出的主题发布到 <a href="http://addons.mozine.org/firefox/themes/" target="_blank">update 中国</a>，可以在 <a href="http://forums.mozine.org/index.php?showforum=32" target="_blank">mozine 开发者主题区</a>发贴，格式如下：<br /><i><span style="color:#FF6600">作者： <br />版本号： <br />兼容： <br />简介： <br />更新日志：<br />缩略图：</span></i><br /><br />如果您比较羞涩，也可以在 mozine 论坛直接给我发消息，或者给我发 email : baggio.corleone(at)gmail.com，在下一定会及时处理。<br /><br /><span style="color:#FF0000"><b>注意：修改自别人主题的作品在发布时必须征得修改许可授权，请各位作者一定要注意。</b></span>

xiaowm 发表于 2006-5-28 09:35

firefox 1.5 以后的皮肤优先用 chrome.manifest，这样简单一些。<br />（当然 Contents.rdf 方式仍然可用）<br /><br />使用 chrome\theme_name.jar 结构的，<br />内容为<br />skin global theme_name jar:chrome/theme_name.jar!/global/<br /><br />不想压缩为jar的， <br />skin global theme_name global/ 之类的方法（要注意文件路径）。<br /><br />这样的好处是一个简单的 chrome.manifest 即可，没有必要去写好几个Contents.rdf 。<br /><br />其缺点是做出来的主题不可能兼容于 Firefox 1.0 。

花小蛮 发表于 2006-5-28 10:32

修改别人的主题要授权……我还不知道呢，误解了<br />现在应该删除我的帖子里的主题吗？<br />可以的话，如果我不小心犯了什么错误，请及时的告诉我，谢谢

花小蛮 发表于 2006-5-28 10:34

我把教程编成了电子书，斑竹同意的话，可以发出来共享

xiaowm 发表于 2006-5-28 11:30

<div class='quotetop'>引用 (花小蛮 @ 2006年5月28日 10:32 AM) <a href="index.php?act=findpost&pid=30254"><{POST_SNAPBACK}></a></div><div class='quotemain'>修改别人的主题要授权……我还不知道呢，误解了<br />现在应该删除我的帖子里的主题吗？<br />可以的话，如果我不小心犯了什么错误，请及时的告诉我，谢谢</div><br /><br /><br />修改别人的要授权－－－－－－－我是这样理解的：<br /><br /><br />修改了以后不能以原来的名字发布。也就是不能混淆视听，让人将修改版当作原版。<br /><br />如果原主题授权协议是 GPL, 那么就可以在其基础上替换图标，少量修改后换个名字，就是一个新的主题。注明一下参考了某某主题便是。

花小蛮 发表于 2006-5-28 17:15

提问<br />默认的主题解压后，browser等5个目录在skin\classic\下<br />这样，怎样编写contents.rdf？<br />按照文中的例子<br />是不是应该吧classic目录改成otherside<br />还有，整个contents.rdf的内容就是下面这些吗？<br /><RDF:li resource="urn:mozilla:skin:otherside:communicator"/><br /><RDF:li resource="urn:mozilla:skin:otherside:editor"/><br /><RDF:li resource="urn:mozilla:skin:otherside:global"/><br /><RDF:li resource="urn:mozilla:skin:otherside:messenger"/><br /><RDF:li resource="urn:mozilla:skin:otherside:navigator"/>

baggio 发表于 2006-5-29 00:57

which tough guy bestowed four stars for my topic...

金箭发表于 2006-5-29 09:30

先回答人家的问题然后再灌，觉得星星太多我给你换成警告？<img src="http://forums.mozine.cn/style_emoticons/<#EMO_DIR#>/tongue.gif" style="vertical-align:middle" emoid=":P" border="0" alt="tongue.gif" />

baggio 发表于 2006-5-31 07:35

<div class='quotetop'>引用 (花小蛮 @ 2006年5月28日 11:15 AM) <a href="index.php?act=findpost&pid=30321"><{POST_SNAPBACK}></a></div><div class='quotemain'>提问<br />默认的主题解压后，browser等5个目录在skin\classic\下<br />这样，怎样编写contents.rdf？<br />按照文中的例子<br />是不是应该吧classic目录改成otherside<br />还有，整个contents.rdf的内容就是下面这些吗？<br /><RDF:li resource="urn:mozilla:skin:otherside:communicator"/><br /><RDF:li resource="urn:mozilla:skin:otherside:editor"/><br /><RDF:li resource="urn:mozilla:skin:otherside:global"/><br /><RDF:li resource="urn:mozilla:skin:otherside:messenger"/><br /><RDF:li resource="urn:mozilla:skin:otherside:navigator"/></div><br /><br /><br />@花 MM ,<br /><br />不好意思，那天没有中文输入，就没有回你，现在补上。<br /><br />contents.rdf 这个文件最主要的作用就是要所有你写的 CSS 定义到 FF 界面上，关于她的修改要看你具体改哪个主题了，这里只是举了个例子，别担心这个，大不了以后你做的主题的安装文件都让 otherside 帮你改。<br /><br />如果你修改别人的主题要到各大网站发布的话，最好还是跟原作者联系一下，如果没有授权只好发到论坛内部交流了。<br /><br />做好了电子书记得给我发一份啊，不过这个帖子我总觉得还不是很全面，以后会不定期的修订的，只是最近实在没有时间。<br /><br />对了，我已经代表楼上的金哥哥加你的 MSN 了 <img src="http://forums.mozine.cn/style_emoticons/<#EMO_DIR#>/ph34r.gif" style="vertical-align:middle" emoid=":ph34r:" border="0" alt="ph34r.gif" /> <img src="http://forums.mozine.cn/style_emoticons/<#EMO_DIR#>/ph34r.gif" style="vertical-align:middle" emoid=":ph34r:" border="0" alt="ph34r.gif" /> <img src="http://forums.mozine.cn/style_emoticons/<#EMO_DIR#>/ph34r.gif" style="vertical-align:middle" emoid=":ph34r:" border="0" alt="ph34r.gif" />

otherside 发表于 2006-5-31 08:53

<div class='quotetop'>引用 </div><div class='quotemain'>对了，我已经代表楼上的金哥哥加你的 MSN 了</div><br />你看，你看。<br /><br />月亮的脸悄悄的在改变～

Eric Chu 发表于 2006-5-31 09:44

<div class='quotetop'>引用 (baggio @ 2006年5月31日 7:35 AM) <a href="index.php?act=findpost&pid=30765"><{POST_SNAPBACK}></a></div><div class='quotemain'>对了，我已经代表楼上的金哥哥加你的 MSN 了 <img src="http://forums.mozine.cn/style_emoticons/<#EMO_DIR#>/ph34r.gif" style="vertical-align:middle" emoid=":ph34r:" border="0" alt="ph34r.gif" /> <img src="http://forums.mozine.cn/style_emoticons/<#EMO_DIR#>/ph34r.gif" style="vertical-align:middle" emoid=":ph34r:" border="0" alt="ph34r.gif" /> <img src="http://forums.mozine.cn/style_emoticons/<#EMO_DIR#>/ph34r.gif" style="vertical-align:middle" emoid=":ph34r:" border="0" alt="ph34r.gif" /></div><br /><br />黑暗来临了……

寒翌发表于 2006-9-6 23:40

请问要把标签栏改成默认的样式要修改哪里,

RobyLiang 发表于 2006-9-7 09:33

<div class='quotetop'>引用 (寒翌 @ 2006年9月6日 5:40 PM) <a href="index.php?act=findpost&pid=47615"><{POST_SNAPBACK}></a></div><div class='quotemain'>请问要把标签栏改成默认的样式要修改哪里,</div><br /><br />那要看你使用的主题对 TAB 都做了哪些改动了。

mayleann 发表于 2007-10-6 12:37

自己很想莱diy一下的说<br />希望能有成果吧

life31 发表于 2008-10-6 11:41

初次查看,跟进.

初次查看,跟进.

谢谢共享

页: [1]

论坛's Archiver

初次查看,跟进.