I created this extension for personal use, but feel free to take this idea and improve upon it. The project was built entirely using ChatGPT, and while some of the code may be unnecessary, I decided to leave it as is for now. Future updates will refine and optimize the code further.
I have made two versions: 'Translate-image-manga-In-Page,' which is an extension that requires the Google API and comes with costs, and 'ghostmanga.py,' which is a script with a UI that's free and easy to use. The details are below. I created them because they share the same code structure but are used differently. I hope everyone will like them.
This Chrome extension finds the URLs of images on a page using a specified class, performs OCR (Optical Character Recognition) on those images, translates the text, and replaces the original images with new, translated versions.
- Google Chrome
- Go to API & Services > Library in the Google Cloud Console.
- Search for Vision API and click to enable it.
- fter enabling the APIs, go to API & Services > Credentials to create your API key:
- Click on Create Credentials.
- Select API Key.
- Copy the API Key and save it securely.
- Ensure all images have the same class. This extension cannot be used on websites that use blob images and Protected websites.
- Download the extension
- Unzip the downloaded file:
Translate-image-manga-In-Page-main.zip
- Open Chrome and go to
chrome://extensions/ - Enable
Developer Mode - Cilck
Load unpacked - Select Folder
Translate-image-manga-In-Page-main - Done! Your extension is ready to use.
- Go to
Translate-image-manga-In-Pagefolder - Compress all the files inside, including any subfolders, into a .zip file.
- Drag the .zip file into
chrome://extensions/ - Done.
- v1.4: Will add free OCR but it is not available yet.
- v1.3: Upgraded the Merge mode for improved translation accuracy, but there are still issues with missing text detection and disorganized word groups when applied to images with tightly packed text. (I have fixed these issues.)
- v1.2: Added a new UI and CSS Selector options.
- v1.1: Implemented image detection on web pages.
Below are common CSS selectors and their abbreviations, which the extension uses to find and manipulate images:
| Full Form (HTML Attribute) | Abbreviation (CSS Selector) |
|---|---|
[class="image-container"] |
.image-container |
[id="main-header"] |
#main-header |
[rel="stylesheet"] |
link[rel="stylesheet"] |
[href="https://example.com"] |
a[href="https://example.com"] |
[type="submit"] |
input[type="submit"] |
[role="navigation"] |
[role="navigation"] |
[data-toggle="dropdown"] |
[data-toggle="dropdown"] |
[alt="Image description"] |
img[alt="Image description"] |
[src^="https://"] |
img[src^="https://"] |
[name="email"] |
input[name="email"] |
[value="Search"] |
input[value="Search"] |
[class="image-container"] > img |
.image-container > img |
[class="button primary"] > span |
.button.primary > span |
div[class="content"] p |
div.content p |
[class="nav"] ul > li[class="nav-item"] |
.nav ul > li.nav-item |
[class="menu-item"] a:hover |
.menu-item a:hover |
[class="form-group"] input[type="text"] |
.form-group input[type="text"] |
[class="gallery"] div[class="gallery-item"] |
.gallery div.gallery-item |
If you want to search for all the images on the page, you can use the selector as just 'img', as shown in the image.
- There are still problems with dynamic word merging.
Ghost Manga UI v2.2.0 (This version still has a problem with slow program closing. I will fix it later.):
https://www.mediafire.com/file/ftjnwukhpb4h0qx/Ghost_Manga_UI_v2.2.0.exe/file
Ghost Manga UI All version:
https://www.mediafire.com/folder/s6ecg0np9f6gj/Ghost+manga
