Pieces for Developers Web Extension
Save, share, and ask questions about code you find online without leaving your current tab by using our Web Extensions.
Supported Browsersβ
Installing the Extensionβ
In order to use any of our web extensions, you must have Pieces OS installed on your machine.
Please use the Chromium web extension for Opera and Brave browsers.
Once installed, refresh your browser, and you'll see the Pieces buttons appear below code blocks on the web.
Saving Snippetsβ
To save a snippet on the web, click the "Copy and Save" Pieces button below a code block. You can also use Pieces context menu actions to save a particular selection.
- When you save code snippets with Pieces, they're stored locally in the Pieces desktop app.
- When you save a snippet, Pieces also saves metadata such as the origin url of the snippet, tags, a title, annotations, and more.
To view and reuse your snippets, just open the Pieces desktop app or one of our other integrations and scroll through your snippets.
Sharing Codeβ
When you click the "Share" button below a code block, Pieces generates a link that is specifically designed to share useful code with its context. Plus, it's automatically copied to your clipboard once it's generated.
This means that instead of copying code and pasting it into a message, you can create a Pieces shareable link that shares the code and maintains formatting, syntax highlighting, and relevant tags. Your recipient will also get the title, description, related links, and other context about the snippet.
Pieces Copilotβ
By using the Pieces Copilot in the Pieces Web Extension, you can chat with the copilot about any code you find on the web. You can chat with the Pieces Copilot in the extension popover menu, but we like opening the Pieces Copilot in the side panel.
You can chat with Pieces Copilot about any code block, generate new code, and ask other technical questions, similar to chatting with the copilot in the Pieces Desktop App.
Snippet Discoveryβ
Pieces Web Extension can automatically discover code snippets you come across on the web.
Snippets discovered on a website are shown within the Discovered Snippets tab on the extension's home page. From there, you can scroll through all the discovered snippets on a site and save the most useful ones.
View Your Saved Snippetsβ
You can view your saved snippets in the extension. Simply go to the Saved Snippets tab on the extension's home page to see all your saved snippets.
Click on any snippet to open its detailed view, where you can see the full snippet, along with other information captured from the snippet. You can also perform various actions on the snippet, such as generating shareable links, copying the snippet, and more.
Recently Discovered Snippetsβ
From the extension's popover menu, you can view your Recently Discovered Snippets. This is a list of the last 100 snippets you've come across on the web, or the last 5 sites you've visited. From here, you can save a snippet without returning to that page. You can adjust the number of sites whose snippets Pieces will remember in the extension settings.
Disabling the Pieces Buttonsβ
If you don't want the Pieces buttons to appear on a certain website, you can disable them for that site in the extension settings.
- Right-click the Pieces icon in the top right corner of your browser and choose βSettings.β
- Toggle the "Disable Pieces buttons" option. The page will automatically refresh and the Pieces buttons will disappear.
Customizing the Pieces Extensionβ
To customize your Pieces Web Extension experience, click on the Pieces icon in the upper right corner of your browser.
Hit the Settings icon in the top right and set your preferences.
You can adjust the following settings for the Pieces Web Extension:
- Which Pieces Buttons are shown around snippets
- The placement of the Pieces Buttons
- Toggle between dark and light Pieces Buttons
- Decide if you'd like Pieces Buttons to be enabled or disabled on a website by default
- Manage your website blacklist
- Adjust the minimum number of characters necessary to recognize a code block
- Adjust the functionality of the Copy & Save Button
- Set the number of recent websites for Pieces to display snippets in the History tab of the extension.
Uninstalling the Pieces Web Extensionβ
- Chrome/Brave/Opera
- Edge
- Firefox
- Click the Extensions button in the top right corner of your window
- Choose
More Actions
next to the Pieces for Developers Chrome Extension - Select
Remove from Chrome
- Click the Extensions button in the top right corner of your window
- Choose
More Actions
next to the Pieces for Developers Edge Extension - Select
Remove from Microsoft Edge
- Click the Add-ons button in the top right corner of your window
- Choose
Theme
βManage Extensions
- Click to the right of the extension you want to remove
- Select
Remove
Troubleshooting the Pieces Buttonsβ
There are a few reasons why the Pieces buttons may not be displayed or working properly:
-
Pieces OS isn't running.
- To double-check that Pieces OS is running, make sure that the Pieces logo is present in your toolbar (on macOS) or your task bar (on Windows and Linux). If it isn't there, please launch Pieces OS by double-clicking Pieces OS in your Applications folder.
- If you need to download and install Pieces OS, visit this link.
-
You disabled the Pieces buttons on that website.
- Double-check that you haven't disabled the Pieces buttons from this site by navigating to the extension settings. If you enable the Pieces buttons, the page will automatically refresh and the buttons should appear.
-
This website doesn't have detectable code.
- The code on this site might be embedded in an iframe or rendered in a way we haven't encountered before! Please send us the site and we'll work on supporting it.
Whitelisted Websitesβ
We maintain a curated list of websites that are verified to work seamlessly with the Pieces buttons. Should you come across a site where the Pieces buttons are not automatically present, you have the option to manually activate them within the extension's settings.
If you discover a website that supports our buttons effectively, please share this information with us via our feedback form.
If none of the above fix your issue, please email us and we'll get back to you!