Fix images in READMEs (#1178)
These were being loaded from a CDN from our old hosting infrastructure for developer.chrome.com. This is no longer live, and we shouldn't have been using external images anyway, so move all of the images to the repo. Fixes #1171
BIN
.repo/images/content-script-favicon.png
Normal file
|
After Width: | Height: | Size: 67 KiB |
BIN
.repo/images/global-side-panel-open.png
Normal file
|
After Width: | Height: | Size: 150 KiB |
BIN
.repo/images/global-side-panel.png
Normal file
|
After Width: | Height: | Size: 78 KiB |
BIN
.repo/images/google-analytics-events.png
Normal file
|
After Width: | Height: | Size: 39 KiB |
BIN
.repo/images/multiple-side-panel-main.png
Normal file
|
After Width: | Height: | Size: 122 KiB |
BIN
.repo/images/multiple-side-panel-welcome.png
Normal file
|
After Width: | Height: | Size: 142 KiB |
BIN
.repo/images/optional-permissions-dialog.png
Normal file
|
After Width: | Height: | Size: 72 KiB |
BIN
.repo/images/optional-permissions-new-tab.png
Normal file
|
After Width: | Height: | Size: 54 KiB |
BIN
.repo/images/optional-permissions-top-sites.png
Normal file
|
After Width: | Height: | Size: 96 KiB |
BIN
.repo/images/side-panel-dictionary-context-menu.png
Normal file
|
After Width: | Height: | Size: 111 KiB |
BIN
.repo/images/site-specific-side-panel.png
Normal file
|
After Width: | Height: | Size: 140 KiB |
@@ -8,8 +8,8 @@ This example demonstrates how to display the same side panel on every site using
|
||||
2. Load this directory in Chrome as an [unpacked extension](https://developer.chrome.com/docs/extensions/mv3/getstarted/development-basics/#load-unpacked).
|
||||
3. Open the side panel UI
|
||||
|
||||
<img src="https://wd.imgix.net/image/BhuKGJaIeLNPW9ehns59NfwqKxF2/2uFG8qxM7cqyMuXWlD9R.png?auto=format&w=400" alt="Global side panel">
|
||||
<img src="../../.repo/images/global-side-panel.png" alt="Global side panel" width=400>
|
||||
|
||||
4. Choose the "Global side panel".
|
||||
|
||||
<img src="https://wd.imgix.net/image/BhuKGJaIeLNPW9ehns59NfwqKxF2/iidZp01nIEHRUjrpt6Hn.png?auto=format&w=700" alt="Global side panel">
|
||||
<img src="../../.repo/images/global-side-panel-open.png" alt="Global side panel" width=700>
|
||||
|
||||
@@ -9,8 +9,8 @@ You can use [`sidepanel.getOptions()`](https://developer.chrome.com/docs/extensi
|
||||
3. Open the side panel UI
|
||||
4. Choose "Multiple side panels" to see the welcome page.
|
||||
|
||||
<img src="https://wd.imgix.net/image/BhuKGJaIeLNPW9ehns59NfwqKxF2/dhSqpr4hqDX0EFy8NlzE.png?auto=format&w=600" alt="Welcome side panel">
|
||||
<img src="../../.repo/images/multiple-side-panel-welcome.png" alt="Welcome side panel" width=600>
|
||||
|
||||
5. Navigate to https://developer.chrome.com to see the main side panel.
|
||||
|
||||
<img src="https://wd.imgix.net/image/BhuKGJaIeLNPW9ehns59NfwqKxF2/vtTL1BW8HLukz7jlrqZb.png?auto=format&w=600" alt="Main side panel">
|
||||
<img src="../../.repo/images/multiple-side-panel-main.png" alt="Main side panel" width=600>
|
||||
|
||||
@@ -12,4 +12,4 @@ This example demonstrates how to display the side panel only on google.com using
|
||||
|
||||
💡 You can also open the side panel by pressing `Ctrl+B` (Windows) or `Cmd+B` (macOS).
|
||||
|
||||
<img src="https://wd.imgix.net/image/BhuKGJaIeLNPW9ehns59NfwqKxF2/3vhkSp1cBQOydpYZoRbD.png?auto=format&w=700" alt="Google.com side panel">
|
||||
<img src="../../.repo/images/site-specific-side-panel.png" alt="Google.com side panel" width=700>
|
||||
|
||||
@@ -13,4 +13,4 @@ See [Fetching favicons](https://developer.chrome.com/docs/extensions/mv3/favicon
|
||||
|
||||
It should look like this:
|
||||
|
||||
<img src="https://wd.imgix.net/image/BhuKGJaIeLNPW9ehns59NfwqKxF2/3Q1glvnzbWhraXRtnGOy.png" alt="Content script using the Favicon API" width="400"/>
|
||||
<img src="../../.repo/images/content-script-favicon.png" alt="Content script using the Favicon API" width="400"/>
|
||||
|
||||
@@ -10,12 +10,12 @@ Follow the instructions to load an [unpacked extension](https://developer.chrome
|
||||
|
||||
It should look like this:
|
||||
|
||||
<img src="https://wd.imgix.net/image/BhuKGJaIeLNPW9ehns59NfwqKxF2/28zBZUTWK1aAZPnKs4ZD.png" alt="New tab with the focus of the day and optional feature button" width="500"/>
|
||||
<img src="../../.repo/images/optional-permissions-new-tab.png" alt="New tab with the focus of the day and optional feature button" width="500"/>
|
||||
|
||||
Then, click on "Allow Extension to Access to top sites". You will see the following message:
|
||||
|
||||
<img src="https://wd.imgix.net/image/BhuKGJaIeLNPW9ehns59NfwqKxF2/rPN5Co1OdkuIZpfAAgPg.png" alt="Allow permissions dialog" width="400"/>
|
||||
<img src="../../.repo/images/optional-permissions-dialog.png" alt="Allow permissions dialog" width="400"/>
|
||||
|
||||
If you accept, it will display a list of your top sites.
|
||||
|
||||
<img src="https://wd.imgix.net/image/BhuKGJaIeLNPW9ehns59NfwqKxF2/ibZ6PqWHsU2v0Y1h0ig2.png" alt="New tab displaying top sites" width="400"/>
|
||||
<img src="../../.repo/images/optional-permissions-top-sites.png" alt="New tab displaying top sites" width="400"/>
|
||||
|
||||
@@ -24,4 +24,4 @@ may not be open yet. To handle this we store the word in
|
||||
|
||||
You should see the definition on the side panel
|
||||
|
||||
<img src="https://wd.imgix.net/image/BhuKGJaIeLNPW9ehns59NfwqKxF2/aC3zkJDPliNLXdvfugeU.png" alt="Dictionary extension context menu">
|
||||
<img src="../../.repo/images/side-panel-dictionary-context-menu.png" alt="Dictionary extension context menu">
|
||||
|
||||
@@ -15,4 +15,4 @@ This example demonstrates how to track extension events in Google Analytics 4 us
|
||||
<img src="https://github-production-user-asset-6210df.s3.amazonaws.com/380472/240995103-87cb61a3-d3f9-44d6-9dfa-0e3bf0c11a1e.png" alt="Extension popup" width="200"/>
|
||||
5. Check out the [real-time report](https://support.google.com/analytics/answer/1638635) to see how the events surface in Google Analytics.
|
||||
|
||||

|
||||
<img src="../../.repo/images/google-analytics-events.png" alt="Google Analytics real-time report" width=400>
|
||||
|
||||