Skip to content

Commit 7b85976

Browse files
committed
mainly done
1 parent b2ed9bc commit 7b85976

11 files changed

Lines changed: 202 additions & 96 deletions

File tree

microsoft-edge/extensions-chromium/getting-started/part1-simple-extension-images/part1-developermode-toggle.png renamed to microsoft-edge/extensions-chromium/getting-started/part1-simple-extension-images/developermode-toggle.png

File renamed without changes.

microsoft-edge/extensions-chromium/getting-started/part1-simple-extension.md

Lines changed: 20 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,7 @@ ms.author: msedgedevrel
66
ms.topic: conceptual
77
ms.service: microsoft-edge
88
ms.subservice: extensions
9-
ms.date: 12/03/2024
9+
ms.date: 01/10/2025
1010
---
1111
# Sample: Display an image in a pop-up
1212

@@ -18,7 +18,8 @@ This sample is a simple static extension, without JavaScript, that displays the
1818
<!-- ====================================================================== -->
1919
## Clone the MicrosoftEdge-Extensions repo
2020

21-
You can use various tools to clone a GitHub repo. You can download a selected directory, or clone the entire repo. These instructions use GitHub Desktop to clone the repo and switch to a working branch.
21+
<!-- for all extensions samples, this is the main copy to propagate copy/paste/modify. put comments on lines that vary per-sample -->
22+
You can use various tools to clone a GitHub repo. You can download a selected directory, or clone the entire repo. These instructions use GitHub Desktop to clone the repo and switch to a working branch.<!-- future: doc git bash as the main way -->
2223

2324
To clone the `MicrosoftEdge-Extensions` repo to your local drive:
2425

@@ -28,7 +29,7 @@ To clone the `MicrosoftEdge-Extensions` repo to your local drive:
2829

2930
1. Click the **Code** button, and then select **Open with GitHub Desktop**.
3031

31-
A dialog opens, saying **This site is trying to open GitHubDesktop.exe.**
32+
A dialog opens, saying **This site is trying to open GitHubDesktop.exe.**<!-- todo: update steps like part 2? -->
3233

3334
1. Click the **Open** button.
3435

@@ -59,7 +60,7 @@ Instead of installing the sample from the Store, you'll install the sample local
5960

6061
1. Click **Manage extensions**. The **Extensions** management page opens in a new tab:
6162

62-
![Turning on Developer Mode](./part1-simple-extension-images/part1-developermode-toggle.png)
63+
![Turning on Developer Mode](./part1-simple-extension-images/developermode-toggle.png)
6364

6465
1. Turn on the **Developer mode** toggle.
6566

@@ -96,6 +97,10 @@ Instead of installing the sample from the Store, you'll install the sample local
9697
See also:
9798
* [Sideload an extension to install and test it locally](./extension-sideloading.md)
9899

100+
101+
<!-- ====================================================================== -->
102+
## Study the sample
103+
99104
In the following sections, you study the sample. After that, to develop your own Microsoft Edge extension, you can copy and modify the sample's directory, and install and test the resulting extension.
100105

101106

@@ -105,9 +110,9 @@ In the following sections, you study the sample. After that, to develop your ow
105110
The sample has the following directory structure:
106111

107112
Example path for the sample:
108-
`C:\Users\myAlias\GitHub\MicrosoftEdge-Extensions\Extension samples\extension-getting-started-part1\part1\`
113+
`C:\Users\localAccount\GitHub\MicrosoftEdge-Extensions\Extension samples\extension-getting-started-part1\part1\`
109114

110-
Directories and files:
115+
Directories and files in the `\part1\` directory:
111116

112117
```shell
113118
/icons/
@@ -200,13 +205,21 @@ The popup (`popup.html`) is registered as the default popup in `manifest.json` u
200205
}
201206
```
202207

208+
<!-- ------------------------------ -->
209+
#### The Part 1 sample running
210+
211+
The simple extension running:
212+
213+
![The simple extension running](./part1-simple-extension-images/extension-running.png)
214+
203215

204216
<!-- ====================================================================== -->
205217
## Next steps
206218

207219
To develop your own Microsoft Edge extension, you can copy and modify the sample's directory, and install and test the resulting extension.
220+
<!-- todo: mention which branch you're in -->
208221

209-
After running and testing the extension, you can continue on to [Sample: Insert an image in the webpage](./part2-content-scripts.md).
222+
After running and testing this extension sample, you can continue on to [Sample: Insert an image in the webpage](./part2-content-scripts.md), which dynamically inserts JavaScript running as content in the browser tab.
210223

211224

212225
<!-- ====================================================================== -->
19.2 KB
Loading
76 KB
Loading
40.3 KB
Loading
306 Bytes
Loading
-132 KB
Loading
95.2 KB
Loading
-132 KB
Loading
24.8 KB
Loading

0 commit comments

Comments
 (0)