Chromium Code Reviews
chromiumcodereview-hr@appspot.gserviceaccount.com (chromiumcodereview-hr) | Please choose your nickname with Settings | Help | Chromium Project | Gerrit Changes | Sign out
(92)

Side by Side Diff: chrome/common/extensions/docs/static/override.html

Issue 1530002: Move history API out of experimental. Allow extensions to override history page. (Closed)
Patch Set: Rebase for commit. Created 10 years, 8 months ago
Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.
Jump to:
View unified diff | Download patch
OLDNEW
1 <style> 1 <style>
2 #pics { 2 #pics {
3 margin:2em 1em 1.5em; 3 margin:2em 1em 1.5em;
4 } 4 }
5 5
6 #pics td { 6 #pics td {
7 text-align:center; 7 text-align:center;
8 width:50%!important; 8 width:50%!important;
9 border:none; 9 border:none;
10 padding:0 1em; 10 padding:0 1em;
11 font-size:90%; 11 font-size:90%;
12 } 12 }
13 13
14 #pics img { 14 #pics img {
15 width:188; 15 width:188;
16 height:246; 16 height:246;
17 border:none; 17 border:none;
18 } 18 }
19 </style> 19 </style>
20 20
21 <div id="pageData-title" class="pageData">Override Pages</div> 21 <div id="pageData-title" class="pageData">Override Pages</div>
22 <div id="pageData-showTOC" class="pageData">true</div> 22 <div id="pageData-showTOC" class="pageData">true</div>
23 23
24 <p> 24 <p>
25 Override pages are a way to replace a page 25 Override pages are a way to replace a page
26 that Google Chrome provides 26 that Google Chrome provides
27 with an HTML file that your extension provides. 27 with an HTML file that your extension provides.
28 An override page usually has CSS and JavaScript code, 28 An override page usually has CSS and JavaScript code,
29 in addition to HTML. 29 in addition to HTML. A single extension can only override
30 one page.
30 </p> 31 </p>
31 32
32 <p> 33 <p>
33 Currently, the only page you can replace is 34 Currently, extensions can replace two pages:
34 the <em>New Tab page</em> &mdash; 35 <ul>
35 the page that appears 36 <li> The <em>New Tab page</em> &mdash;
36 when the user creates a new tab or window. 37 the page that appears when the user creates a new tab or window.</li>
38
39 <li> The <em>History page</em> &mdash;
40 the page that appears when the user selects the 'History' menu item.</li>
41 </ul>
37 </p> 42 </p>
38
39 <table id="pics"> 43 <table id="pics">
40 <tr> 44 <tr>
41 <td> <b>The default New Tab page</b> </td> 45 <td> <b>The default New Tab page</b> </td>
42 <td> <b>An alternative New Tab page</b> </td> 46 <td> <b>An alternative New Tab page</b> </td>
43 </tr> 47 </tr>
44 <tr> 48 <tr>
45 <td> 49 <td>
46 <img src="images/ntp-default.png" 50 <img src="images/ntp-default.png"
47 alt="default New Tab page" 51 alt="default New Tab page"
48 width="200" height="173"> 52 width="200" height="173">
49 </td> 53 </td>
50 <td> 54 <td>
51 <img src="images/ntp-blank.png" 55 <img src="images/ntp-blank.png"
52 alt="a blank New Tab page" 56 alt="a blank New Tab page"
53 width="200" height="173"> 57 width="200" height="173">
54 </td> 58 </td>
55 </tr> 59 </tr>
56 </table> 60 </table>
57 61
58
59 <h2 id="manifest">Manifest</h2> 62 <h2 id="manifest">Manifest</h2>
60 63
61 <p> 64 <p>
62 Register your New Tab page in the 65 Register override pages in the
63 <a href="manifest.html">extension manifest</a> 66 <a href="manifest.html">extension manifest</a>
64 like this: 67 using property <code>chrome_url_overrides</code>. For example, the new tabs pag e can be overridden like this:
65 </p> 68 </p>
66 69
67 <pre>{ 70 <pre>{
68 "name": "My extension", 71 "name": "My extension",
69 ... 72 ...
70 <b>"chrome_url_overrides": { 73 <b>"chrome_url_overrides": {
71 "newtab": "newtab.html" 74 "newtab": "newtab.html"
72 }</b>, 75 }</b>,
73 ... 76 ...
74 }</pre> 77 }</pre>
75 78
79 You can override the history page like this:
80
81 <pre>{
82 "name": "My extension",
83 ...
84 <b>"chrome_url_overrides": {
85 "history": "history.html"
86 }</b>,
87 ...
88 }</pre>
89
90 A single extension may only override one page.
91
76 <h2 id="tips">Tips</h2> 92 <h2 id="tips">Tips</h2>
77 93
78 <p> 94 <p>
79 For an effective New Tab page, follow these guidelines: 95 For an effective override pages, follow these guidelines:
80 </p> 96 </p>
81 97
82 <ul> 98 <ul>
83 <li> 99 <li>
84 <p> 100 <p>
85 <b>Make your page quick and small.</b> <br /> 101 <b>Make your page quick and small.</b> <br />
86 Because the New Tab page appears often, 102 Users expect built in browser pages to open instantly. Avoid doing things t hat
87 its performance is important. 103 may take a long time.
88 For example, avoid synchronous fetches of network or database resources. 104 For example, avoid synchronous fetches of network or database resources.
89 </p> 105 </p>
90 </li> 106 </li>
91 <li> 107 <li>
92 <p> 108 <p>
93 <b>Include a title in your page.</b> <br /> 109 <b>Include a title in your page.</b> <br />
94 Otherwise people will see the URL of the page, 110 Otherwise people will see the URL of the page,
95 which might confuse them. 111 which might confuse them.
96 Here's an example of specifying the title: 112 Here's an example of specifying the title:
97 <code>&lt;title>New&nbsp;Tab&lt;/title></code> 113 <code>&lt;title>New&nbsp;Tab&lt;/title></code>
98 </p> 114 </p>
99 115
100 <li> 116 <li>
101 <p> 117 <p>
102 <b>Don't rely on the page having the keyboard focus.</b> <br /> 118 <b>Don't rely on the page having the keyboard focus.</b> <br />
103 The address bar always gets the focus first 119 The address bar always gets the focus first
104 when the user creates a new tab. 120 when the user creates a new tab.
105 </p> 121 </p>
106 </li> 122 </li>
107 <li> 123 <li>
108 <p> 124 <p>
109 <b>Don't try to emulate the default New Tab page.</b> <br /> 125 <b>Don't try to emulate the default pages.</b> <br />
110 The APIs necessary to create 126 The APIs necessary to create
111 a slightly modified version of the default New Tab page &mdash; 127 a slightly modified version of the default New Tab page &mdash;
112 with top pages, 128 with top pages,
113 recently closed pages, 129 recently closed pages,
114 tips, 130 tips,
115 a theme background image, 131 a theme background image,
116 and so on &mdash; 132 and so on &mdash;
117 don't exist yet. 133 don't exist yet.
118 Until they do, 134 Until they do,
119 you're better off trying to make something completely different. 135 you're better off trying to make something completely different.
120 </p> 136 </p>
121 </li> 137 </li>
122 </ul> 138 </ul>
123 139
124 <h2 id="examples"> Examples </h2> 140 <h2 id="examples"> Examples </h2>
125 141
126 <p> 142 <p>
127 You can find simple examples of defining override pages in the 143 You can find simple examples of defining override pages in the
128 <a href="http://src.chromium.org/viewvc/chrome/trunk/src/chrome/common/extension s/docs/examples/api/override/">examples/api/override</a> 144 <a href="http://src.chromium.org/viewvc/chrome/trunk/src/chrome/common/extension s/docs/examples/api/override/">examples/api/override</a>
129 directory. 145 directory.
130 For other examples and for help in viewing the source code, see 146 For other examples and for help in viewing the source code, see
131 <a href="samples.html">Samples</a>. 147 <a href="samples.html">Samples</a>.
132 </p> 148 </p>
133 149
134 150
135 <!-- [PENDING: Maybe have a gallery of NTPs?] --> 151 <!-- [PENDING: Maybe have a gallery of NTPs?] -->
OLDNEW
« no previous file with comments | « chrome/common/extensions/docs/static/history.html ('k') | chrome/common/extensions/docs/tabs.html » ('j') | no next file with comments »

Powered by Google App Engine
This is Rietveld 408576698