Zeplin Popout Tool in Chrome

Latest Version

Version
1.1.0
Update
February 6, 2023
Size
24.43KiB
Developer
Category
Users
600
Rating
5 ★
Manifest Version
3
Web Store Status
Languages Support
English (United States)
See more
Permissions
Storage
Scripting
See more

Zeplin Popout Tool Extension

Zeplin Popout tool allows you to compare your code output with Zeplin screens for better design-development workflow.
Read more

Source Manifest.json

{"update_url": "https://clients2.google.com/service/update2/crx", "name": "Zeplin Popout Tool", "version": "1.1.0", "manifest_version": 3, "description": "Zeplin Popout Tool in Chrome", "icons": { "16": "icons/icon16.png", "48": "icons/icon48.png", "128": "icons/icon128.png" }, "background": { "service_worker": "background.js" }, "action": { "default_popup": "popup/popup.html" }, "content_scripts": [ { "matches": ["*://*/*"], "js": ["content/content.js"], "css": ["content/content.css"], "run_at": "document_idle" } ], "permissions": ["storage", "scripting"], "host_permissions": [ "" ], "web_accessible_resources": [ { "matches": [ "" ], "resources": [ "img/icSolid.png", "img/icTransparent.png" ] } ]}
Read more

How to download and manually install Zeplin Popout Tool extension for Chrome

Looking for a way to install Zeplin Popout Tool extensions for Chrome, you can search for them in the Chrome Web Store, clicking the "Add to Chrome" button, and following the straightforward process.

However, you may need to install Zeplin Popout Tool extensions manually, this article outlines two simple methods to effortlessly install Zeplin Popout Tool extensions, whether they come as unpacked folders in compressed formats like .zip or as .crx files.

Method 1: Download Zeplin Popout Tool extension and manually install through Drag &Drop

If you ever need to manually install a Zeplin Popout Tool extension for Chrome, don't worry, it's a simple process. Just follow these easy steps, and you will have your extension ready to use in no time.

Step 1: Download the Zeplin Popout Tool Extension by clicking the "Download CRX" button on the website.

Look for the Zeplin Popout Tool extension you wish to install. Go to the website and download the Zeplin Popout Tool extension package, which is usually a .CRX file and comes in a zipped file. Here ".crx" file is the format for Zeplin Popout Tool extension that contains all the data.

Step 2: Extract &Arrange Files

Once the file is downloaded, extract that file into its own folder. Similarly, give that extension files a permanent home. In other words, keep it in a folder that you don't accidentally delete it because these files will be needed to make that extension work.

Step 3: Go to the Chrome Extensions Page

Open Google Chrome and in the address bar, type chrome://extensions; it will open the Google Chrome extensions page. Make sure that "My extensions" is selected in the sidebar.

Step 4: Drag and Drop the Extension

Now, go to the folder where you extracted the Zeplin Popout Tool extension and drag &drop the extension file from there anywhere onto the extension page within Google Chrome.

Step 5: Complete the Installation

Once you drag and drop the extension file, follow the steps that Google Chrome takes you through. Similarly, if the extension file is of .crx file format, you will be required to review the permissions and then add the extension.

Now, you can manage that added extension as you would like to with any other Chrome extension that you added through Chrome Webstore. Its icon will also appear in the Google Chrome Menu on the right side of the address bar once you activate it.

Method 2: Download Zeplin Popout Tool extension for Chrome and install in Developer Mode

This is another method to install Zeplin Popout Tool extension manually, but the twist is that here, you install by enabling the developer mode option provided in Google Chrome. This mode is commonly used for testing extensions or running unpublished tools.

Step 1: Download the Zeplin Popout Tool extension file

Select and download the Zeplin Popout Tool extension by clicking the 'Download CRX' button on the website.

Step 2: Extract the downloaded contents

Convert the file to a ZIP file if it is in CRX format then extract the Zeplin Popout Tool extension zip file or folder that you downloaded. Make sure you extract it using the same folder name and keep it safely in another folder, so you don't delete it by mistake. The extracted folder will be needed to keep your Zeplin Popout Tool extension running.

Step 3: Open Chrome Extension Setting Page

In the address bar of Google Chrome, type chrome://extensions and open the Chrome Extension Page.

Step 4: Enable Developer Mode

After opening the Chrome Extension page, look at the top right side, and you will find the toggle option of "Developer mode."Simply enable that developer mode option.

Step 5: Load the Unpacked Extension

Once you enable the developer mode option, you will see the menu of Load Unpacked, Pack Extensions and Update. From that, select the option "Load unpacked."

Step 6: Select the Extension Folder

Once the pop-up opens upon clicking Load unpacked, select the Zeplin Popout Tool extension directory and click on the "Select Folder "button.

Step 7: Confirm and Install

After you select an extension folder of a Google Chrome extension you're installing manually, confirm its installation for the final time and let the installation complete.

Conclusion

Here we've made a step-by-step guide on How to manually install Zeplin Popout Tool extension in 2 ways. We hope this guide proves helpful.

Similar Extensions

icon

Hover inspector like in Zeplin , Figma Extension · Developer Tools 600 29 ★ 122KiB

icon

Marker.io: Visual bug reporting for websites Extension · Developer Tools 600 177 ★ 288KiB

icon

Ghost Screen Extension · Developer Tools 600 3 ★ 659KiB

icon

Mood Based Tab Manager Extension · Productivity 600 9 ★ 3.97MiB

icon

Jira Product Discovery Extension · Productivity 600 14 ★ 10.09MiB

icon

Pixelay for Figma Extension · Developer Tools 600 4 ★ 391KiB

icon

Popout Extension · Productivity 600 26 ★ 22.05KiB

icon

Stark Accessibility Checker Extension · Developer Tools 600 22 ★ 2.29MiB

icon

Measuremate Extension · Developer Tools 600 42 ★ 797KiB

icon

Figma Extension · Productivity 600 27 ★ 1.36MiB

icon

BrowserStack Extension · Developer Tools 600 95 ★ 805KiB

icon

Notes – Organize your Zeplin Comments Extension · Productivity 600 20 ★ 218KiB

icon

Popout Plus Extension · Productivity 600 8 ★ 695KiB

icon

Pixel Perfect Pro Extension · Developer Tools 600 12 ★ 124KiB

icon

BrowserStack Accessibility Toolkit Extension · Accessibility 600 61 ★ 3.49MiB

icon

GoTodo - Todo list, Notes & Reminders Extension · Productivity 600 2 ★ 46.27KiB

icon

Designer Tools Extension · Developer Tools 600 227 ★ 987KiB

icon

Heurio - One-Click Bug Report & UX Check Tool Extension · Developer Tools 600 76 ★ 5.86MiB

icon

Hoverify Extension · Developer Tools 600 145 ★ 14.54MiB

icon

PopOut Extension · Productivity 600 7 ★ 5.66KiB

icon

PerfectPixel by WellDoneCode (pixel perfect) Extension · Developer Tools 600 605 ★ 732KiB

icon

PixelParallel by htmlBurger Extension · Developer Tools 600 65 ★ 223KiB

icon

Web Developer Tool for Chrome Extension · Developer Tools 600 21 ★ 30.89KiB

User reviews

icon

Nico Carmosino (ID: 0000006eb24f783e) Voted 5 ★ - Updated 03/08/2023 Loved this on desktop, and now it's here on Chrome! Thank you Zeplin devs. 🖖

icon

Fatih Ok (ID: 00000081d65a5397) Voted 5 ★ - Updated 01/31/2023 This is amazing! 😍

icon

Bedriye Hatip Özgür (ID: 00000093c6df772c) Voted 5 ★ - Updated 01/31/2023 great work!

icon

Tuba Güzelsevenlerden (ID: 0000000a0c536a57) Voted 5 ★ - Updated 01/31/2023 Thanks for building this helpful extension! 🤩

icon

Tuba Tel (ID: 0000008ea4fc6070) Voted 5 ★ - Updated 01/31/2023 This is exactly what we need! 🎉