CODEWITHSUNDEEP
google-chromegoogle-chrome-extensionchromebook
max pleaner
max pleaner

Reputation: 26778

how to zoom out on an chrome extension's popup

Some extensions' popup windows don't fit nicely into the page. If I can zoom out on the popup window, I can use it as normal, but there's no apparent way to do this.

Example screenshot: img

you can see that the popup window extends below the visible portion of the screen. There's a button on the bottom that says "record tab" which I can't manage to click.

My chrome build:

Version 52.0.2743.116 (64-bit)
Platform 8350.68.0 (Official Build) stable-channel orco
Firmware Google_Orco.5216.362.7

All this is with my page zoom set to 100% and font-size set to medium in the about://settings menu.

Adjusting the page zoom to 75% in about://settings fixed it for about 30 seconds but the popup soon reverted back to its original zoom level.

Upvotes: 5

Views: 5070

Answers (3)

rlayer
rlayer

Reputation: 1

Depending on the extension, opening the popup HTML separately might not be feasible. I suggest setting the non-standard CSS zoom directly for the extension's popup:

  1. Open the extension's popup and right-click.
  2. Select Inspect to open the Chrome Developer Tools.
  3. Select the html tag in the Elements tab, and add to the styles the zoom property with the desired value. To zoom out, use a value < 1 (e.g., 0.75).

Upvotes: 0

V. Rubinetti
V. Rubinetti

Reputation: 1766

The accepted answer mentions going to the extension's options page to reset the zoom, but many extensions don't have/need an options page.

If that is the case:

  1. Open the popup
  2. Right-click and "Inspect"
  3. A "Developer Tools" window should open, and in the title bar it should say the name and path of the popup html file, like this: chrome-extension://[the extension ID, a long string of random letters]/popup.html
  4. Open that long address in a new tab, and it should show the normal popup content. (Instead of typing out the extension id manually, it can be copy/pasted from chrome://extensions with "Developer mode" on.)
  5. Reset the zoom there to the default 100% (ctrl+0), as most extension developers will design and test assuming 100%.

The key point here is, the zoom is global/consistent across all of the extension's pages, including the popup, which is why zooming the "options" page works. Any page beginning within chrome-extension://[the extension ID] will have the same zoom as and affect the zoom of all the other pages.

For example, my extension's popup has a question mark icon that navigates to a separate help.html page still within the popup, and the zoom there affects the main popup.html zoom as well.

This also applies to webpages. Zoom is maintained over all pages from the same domain. If you zoom from 125% to 150% on one stackoverflow.com question, a different stackoverflow.com question in another tab will also zoom to 150%.

Upvotes: 5

zwl
zwl

Reputation: 57

The zoom setting for a Chrome extension can be managed on that extension's options page:

  1. Right click on the extension
  2. Click on Options
  3. Zoom In or Out using ctrl +/-

Now, click on the extension and watch the magic!

Google Chrome saves your zoom levels on a per-site basis. When one adjusts the zoom level on an extension’s options page, that level also applies to that extension’s popups.

Source: How to prevent zooming in popup window in my Chrome Extension

Upvotes: 2

Related Questions