Claro, voy a crear una extensión de Chrome llamada ClearSlate con las características que has solicitado. La extensión permitirá a los usuarios ajustar qué datos se borrarán (caché, historial, etc.), tendrá una lista blanca de páginas que no se borrarán y tendrá opciones para añadir o eliminar páginas de esa lista. Además, todos los textos estarán dinámicos en inglés, español, alemán e italiano.
Estructura del Proyecto
clearslate-extension/
│
├── manifest.json
├── background.js
├── popup.html
├── popup.js
├── styles.css
├── locales/
│ ├── en/
│ │ └── messages.json
│ ├── es/
│ │ └── messages.json
│ ├── de/
│ │ └── messages.json
│ └── it/
│ └── messages.json
└── icons/
├── icon16.png
├── icon48.png
└── icon128.png
Paso 1: Crear manifest.json
Este archivo describe la extensión a Chrome.
{
"manifest_version": 3,
"name": "ClearSlate",
"version": "1.0",
"description": "Borra automáticamente datos de navegación cuando cierras el navegador, con opciones personalizables y lista blanca.",
"permissions": ["browsingData", "storage", "tabs"],
"background": {
"service_worker": "background.js"
},
"action": {
"default_popup": "popup.html",
"default_icon": {
"16": "icons/icon16.png",
"48": "icons/icon48.png",
"128": "icons/icon128.png"
}
},
"options_page": "options.html",
"default_locale": "es",
"icons": {
"16": "icons/icon16.png",
"48": "icons/icon48.png",
"128": "icons/icon128.png"
}
}
Paso 2: Crear background.js
Este script manejará el borrado de datos de navegación cuando se cierre el navegador, teniendo en cuenta la lista blanca.
chrome.tabs.onRemoved.addListener(function(tabId, removeInfo) {
if (removeInfo.isWindowClosing) {
chrome.storage.local.get(['settings', 'whitelist'], function(result) {
const settings = result.settings || {
cache: true,
history: true,
cookies: true,
downloads: true,
formData: true,
localStorage: true,
indexedDB: true,
serviceWorkers: true,
webSQL: true
};
const whitelist = result.whitelist || [];
chrome.browsingData.remove({
since: 0
}, {
cache: settings.cache,
history: settings.history,
cookies: settings.cookies,
downloads: settings.downloads,
formData: settings.formData,
localStorage: settings.localStorage,
indexedDB: settings.indexedDB,
serviceWorkers: settings.serviceWorkers,
webSQL: settings.webSQL
});
});
}
});
Paso 3: Crear popup.html
Esta es la interfaz que los usuarios verán cuando hagan clic en el icono de la extensión.
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" type="text/css" href="styles.css">
<title>ClearSlate</title>
</head>
<body>
<div id="app">
<h1 id="title"></h1>
<p id="description"></p>
<button id="donateButton" onclick="window.open('https://www.paypal.com/donate/your-link-here', '_blank')"></button>
<select id="languageSelect">
<option value="en">English</option>
<option value="es">Español</option>
<option value="de">Deutsch</option>
<option value="it">Italiano</option>
</select>
<p id="whitelistLabel"></p>
<input type="text" id="whitelistInput" placeholder="example.com">
<button id="addWhitelistButton"></button>
<ul id="whitelistList"></ul>
<button id="clearWhitelistButton"></button>
</div>
<script src="popup.js"></script>
</body>
</html>
Paso 4: Crear popup.js
Este script manejará la internacionalización y la gestión de la lista blanca.
document.addEventListener('DOMContentLoaded', function() {
const titleElement = document.getElementById('title');
const descriptionElement = document.getElementById('description');
const donateButton = document.getElementById('donateButton');
const languageSelect = document.getElementById('languageSelect');
const whitelistLabel = document.getElementById('whitelistLabel');
const whitelistInput = document.getElementById('whitelistInput');
const addWhitelistButton = document.getElementById('addWhitelistButton');
const whitelistList = document.getElementById('whitelistList');
const clearWhitelistButton = document.getElementById('clearWhitelistButton');
function updateUI() {
const selectedLanguage = languageSelect.value;
chrome.i18n.getMessage('title', function(title) {
titleElement.textContent = title;
});
chrome.i18n.getMessage('description', function(description) {
descriptionElement.textContent = description;
});
chrome.i18n.getMessage('donateButton', function(buttonText) {
donateButton.textContent = buttonText;
});
chrome.i18n.getMessage('whitelistLabel', function(labelText) {
whitelistLabel.textContent = labelText;
});
chrome.i18n.getMessage('addWhitelistButton', function(buttonText) {
addWhitelistButton.textContent = buttonText;
});
chrome.i18n.getMessage('clearWhitelistButton', function(buttonText) {
clearWhitelistButton.textContent = buttonText;
});
}
function loadWhitelist() {
chrome.storage.local.get('whitelist', function(result) {
const whitelist = result.whitelist || [];
whitelistList.innerHTML = '';
whitelist.forEach(function(item) {
const li = document.createElement('li');
li.textContent = item;
li.appendChild(createRemoveButton(item));
whitelistList.appendChild(li);
});
});
}
function createRemoveButton(item) {
const button = document.createElement('button');
button.textContent = 'X';
button.onclick = function() {
chrome.storage.local.get('whitelist', function(result) {
let whitelist = result.whitelist || [];
whitelist = whitelist.filter(function(i) {
return i !== item;
});
chrome.storage.local.set({ whitelist: whitelist }, function() {
loadWhitelist();
});
});
};
return button;
}
addWhitelistButton.addEventListener('click', function() {
const newSite = whitelistInput.value.trim();
if (newSite) {
chrome.storage.local.get('whitelist', function(result) {
let whitelist = result.whitelist || [];
if (!whitelist.includes(newSite)) {
whitelist.push(newSite);
chrome.storage.local.set({ whitelist: whitelist }, function() {
whitelistInput.value = '';
loadWhitelist();
});
}
});
}
});
clearWhitelistButton.addEventListener('click', function() {
chrome.storage.local.set({ whitelist: [] }, function() {
loadWhitelist();
});
});
languageSelect.addEventListener('change', updateUI);
updateUI();
loadWhitelist();
});
Paso 5: Crear styles.css
Este archivo estilizará tu popup.
body {
font-family: Arial, sans-serif;
padding: 10px;
background-color: #f0f0f0;
color: #333;
}
#app {
text-align: center;
}
button {
background-color: #007bff;
color: white;
padding: 10px 20px;
border: none;
border-radius: 5px;
cursor: pointer;
margin: 5px;
}
button:hover {
background-color: #0056b3;
}
select, input {
padding: 5px;
margin-top: 10px;
width: 80%;
}
ul {
list-style-type: none;
padding: 0;
}
li {
background-color: #fff;
margin: 5px 0;
padding: 10px;
border-radius: 5px;
display: flex;
justify-content: space-between;
align-items: center;
}
li button {
background-color: #ff4d4d;
width: 30px;
height: 30px;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
}
li button:hover {
background-color: #ff1a1a;
}
Paso 6: Crear Archivos de Localización
Estos archivos contienen las traducciones para cada idioma.
locales/en/messages.json
{
"title": {
"message": "ClearSlate",
"description": "Título de la extensión"
},
"description": {
"message": "Automatically clears your browsing data when you close your browser.",
"description": "Descripción de la extensión"
},
"donateButton": {
"message": "Donate",
"description": "Texto del botón de donación"
},
"whitelistLabel": {
"message": "Whitelist",
"description": "Etiqueta de la lista blanca"
},
"addWhitelistButton": {
"message": "Add to Whitelist",
"description": "Texto del botón para añadir a la lista blanca"
},
"clearWhitelistButton": {
"message": "Clear Whitelist",
"description": "Texto del botón para limpiar la lista blanca"
}
}
locales/es/messages.json
{
"title": {
"message": "ClearSlate",
"description": "Título de la extensión"
},
"description": {
"message": "Borra automáticamente tus datos de navegación cuando cierras tu navegador.",
"description": "Descripción de la extensión"
},
"donateButton": {
"message": "Donar",
"description": "Texto del botón de donación"
},
"whitelistLabel": {
"message": "Lista Blanca",
"description": "Etiqueta de la lista blanca"
},
"addWhitelistButton": {
"message": "Añadir a Lista Blanca",
"description": "Texto del botón para añadir a la lista blanca"
},
"clearWhitelistButton": {
"message": "Limpiar Lista Blanca",
"description": "Texto del botón para limpiar la lista blanca"
}
}
locales/de/messages.json
{
"title": {
"message": "ClearSlate",
"description": "Titel der Erweiterung"
},
"description": {
"message": "Löscht automatisch Ihre Browsedaten, wenn Sie Ihren Browser schließen.",
"description": "Beschreibung der Erweiterung"
},
"donateButton": {
"message": "Spenden",
"description": "Text für den Spendenknopf"
},
"whitelistLabel": {
"message": "Weißeliste",
"description": "Bezeichnung der Weißeliste"
},
"addWhitelistButton": {
"message": "Zur Weißeliste hinzufügen",
"description": "Text für den Knopf, um zur Weißeliste hinzuzufügen"
},
"clearWhitelistButton": {
"message": "Weißeliste leeren",
"description": "Text für den Knopf, um die Weißeliste zu leeren"
}
}
locales/it/messages.json
{
"title": {
"message": "ClearSlate",
"description": "Titolo dell'estensione"
},
"description": {
"message": "Cancella automaticamente i tuoi dati di navigazione quando chiudi il browser.",
"description": "Descrizione dell'estensione"
},
"donateButton": {
"message": "Donare",
"description": "Testo per il pulsante di donazione"
},
"whitelistLabel": {
"message": "Lista Bianca",
"description": "Etichetta della lista bianca"
},
"addWhitelistButton": {
"message": "Aggiungi alla Lista Bianca",
"description": "Testo per il pulsante per aggiungere alla lista bianca"
},
"clearWhitelistButton": {
"message": "Pulisci Lista Bianca",
"description": "Testo per il pulsante per pulire la lista bianca"
}
}
Paso 7: Crear options.html
Esta página permitirá a los usuarios ajustar qué datos se borrarán.
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" type="text/css" href="styles.css">
<title>Opciones de ClearSlate</title>
</head>
<body>
<div id="options">
<h1 id="optionsTitle"></h1>
<label for="clearCache">
<input type="checkbox" id="clearCache">
<span id="clearCacheLabel"></span>
</label>
<label for="clearHistory">
<input type="checkbox" id="clearHistory">
<span id="clearHistoryLabel"></span>
</label>
<label for="clearCookies">
<input type="checkbox" id="clearCookies">
<span id="clearCookiesLabel"></span>
</label>
<label for="clearDownloads">
<input type="checkbox" id="clearDownloads">
<span id="clearDownloadsLabel"></span>
</label>
<label for="clearFormData">
<input type="checkbox" id="clearFormData">
<span id="clearFormDataLabel"></span>
</label>
<label for="clearLocalStorage">
<input type="checkbox" id="clearLocalStorage">
<span id="clearLocalStorageLabel"></span>
</label>
<label for="clearIndexedDB">
<input type="checkbox" id="clearIndexedDB">
<span id="clearIndexedDBLabel"></span>
</label>
<label for="clearServiceWorkers">
<input type="checkbox" id="clearServiceWorkers">
<span id="clearServiceWorkersLabel"></span>
</label>
<label for="clearWebSQL">
<input type="checkbox" id="clearWebSQL">
<span id="clearWebSQLLabel"></span>
</label>
<button id="saveSettingsButton"></button>
</div>
<script src="options.js"></script>
</body>
</html>
Paso 8: Crear options.js
Este script manejará la carga y guardado de las configuraciones.
document.addEventListener('DOMContentLoaded', function() {
const optionsTitleElement = document.getElementById('optionsTitle');
const clearCacheLabelElement = document.getElementById('clearCacheLabel');
const clearHistoryLabelElement = document.getElementById('clearHistoryLabel');
const clearCookiesLabelElement = document.getElementById('clearCookiesLabel');
const clearDownloadsLabelElement = document.getElementById('clearDownloadsLabel');
const clearFormDataLabelElement = document.getElementById('clearFormDataLabel');
const clearLocalStorageLabelElement = document.getElementById('clearLocalStorageLabel');
const clearIndexedDBLabelElement = document.getElementById('clearIndexedDBLabel');
const clearServiceWorkersLabelElement = document.getElementById('clearServiceWorkersLabel');
const clearWebSQLLabelElement = document.getElementById('clearWebSQLLabel');
const saveSettingsButton = document.getElementById('saveSettingsButton');
const clearCacheCheckbox = document.getElementById('clearCache');
const clearHistoryCheckbox = document.getElementById('clearHistory');
const clearCookiesCheckbox = document.getElementById('clearCookies');
const clearDownloadsCheckbox = document.getElementById('clearDownloads');
const clearFormDataCheckbox = document.getElementById('clearFormData');
const clearLocalStorageCheckbox = document.getElementById('clearLocalStorage');
const clearIndexedDBCheckbox = document.getElementById('clearIndexedDB');
const clearServiceWorkersCheckbox = document.getElementById('clearServiceWorkers');
const clearWebSQLCheckbox = document.getElementById('clearWebSQL');
function updateUI() {
chrome.i18n.getMessage('optionsTitle', function(title) {
optionsTitleElement.textContent = title;
});
chrome.i18n.getMessage('clearCacheLabel', function(labelText) {
clearCacheLabelElement.textContent = labelText;
});
chrome.i18n.getMessage('clearHistoryLabel', function(labelText) {
clearHistoryLabelElement.textContent = labelText;
});
chrome.i18n.getMessage('clearCookiesLabel', function(labelText) {
clearCookiesLabelElement.textContent = labelText;
});
chrome.i18n.getMessage('clearDownloadsLabel', function(labelText) {
clearDownloadsLabelElement.textContent = labelText;
});
chrome.i18n.getMessage('clearFormDataLabel', function(labelText) {
clearFormDataLabelElement.textContent = labelText;
});
chrome.i18n.getMessage('clearLocalStorageLabel', function(labelText) {
clearLocalStorageLabelElement.textContent = labelText;
});
chrome.i18n.getMessage('clearIndexedDBLabel', function(labelText) {
clearIndexedDBLabelElement.textContent = labelText;
});
chrome.i18n.getMessage('clearServiceWorkersLabel', function(labelText) {
clearServiceWorkersLabelElement.textContent = labelText;
});
chrome.i18n.getMessage('clearWebSQLLabel', function(labelText) {
clearWebSQLLabelElement.textContent = labelText;
});
chrome.i18n.getMessage('saveSettingsButton', function(buttonText) {
saveSettingsButton.textContent = buttonText;
});
}
function loadSettings() {
chrome.storage.local.get('settings', function(result) {
const settings = result.settings || {
cache: true,
history: true,
cookies: true,
downloads: true,
formData: true,
localStorage: true,
indexedDB: true,
serviceWorkers: true,
webSQL: true
};
clearCacheCheckbox.checked = settings.cache;
clearHistoryCheckbox.checked = settings.history;
clearCookiesCheckbox.checked = settings.cookies;
clearDownloadsCheckbox.checked = settings.downloads;
clearFormDataCheckbox.checked = settings.formData;
clearLocalStorageCheckbox.checked = settings.localStorage;
clearIndexedDBCheckbox.checked = settings.indexedDB;
clearServiceWorkersCheckbox.checked = settings.serviceWorkers;
clearWebSQLCheckbox.checked = settings.webSQL;
});
}
saveSettingsButton.addEventListener('click', function() {
const settings = {
cache: clearCacheCheckbox.checked,
history: clearHistoryCheckbox.checked,
cookies: clearCookiesCheckbox.checked,
downloads: clearDownloadsCheckbox.checked,
formData: clearFormDataCheckbox.checked,
localStorage: clearLocalStorageCheckbox.checked,
indexedDB: clearIndexedDBCheckbox.checked,
serviceWorkers: clearServiceWorkersCheckbox.checked,
webSQL: clearWebSQLCheckbox.checked
};
chrome.storage.local.set({ settings: settings }, function() {
alert(chrome.i18n.getMessage('settingsSaved'));
});
});
updateUI();
loadSettings();
});
Paso 9: Agregar Textos para options.js
Añade los textos necesarios a los archivos de localización.
locales/en/messages.json
{
"title": {
"message": "ClearSlate",
"description": "Título de la extensión"
},
"description": {
"message": "Automatically clears your browsing data when you close your browser.",
"description": "Descripción de la extensión"
},
"donateButton": {
"message": "Donate",
"description": "Texto del botón de donación"
},
"whitelistLabel": {
"message": "Whitelist",
"description": "Etiqueta de la lista blanca"
},
"addWhitelistButton": {
"message": "Add to Whitelist",
"description": "Texto del botón para añadir a la lista blanca"
},
"clearWhitelistButton": {
"message": "Clear Whitelist",
"description": "Texto del botón para limpiar la lista blanca"
},
"optionsTitle": {
"message": "ClearSlate Settings",
"description": "Título de las opciones"
},
"clearCacheLabel": {
"message": "Clear Cache",
"description": "Etiqueta para borrar caché"
},
"clearHistoryLabel": {
"message": "Clear History",
"description": "Etiqueta para borrar historial"
},
"clearCookiesLabel": {
"message": "Clear Cookies",
"description": "Etiqueta para borrar cookies"
},
"clearDownloadsLabel": {
"message": "Clear Downloads",
"description": "Etiqueta para borrar descargas"
},
"clearFormDataLabel": {
"message": "Clear Form Data",
"description": "Etiqueta para borrar datos de formularios"
},
"clearLocalStorageLabel": {
"message": "Clear Local Storage",
"description": "Etiqueta para borrar almacenamiento local"
},
"clearIndexedDBLabel": {
"message": "Clear IndexedDB",
"description": "Etiqueta para borrar IndexedDB"
},
"clearServiceWorkersLabel": {
"message": "Clear Service Workers",
"description": "Etiqueta para borrar service workers"
},
"clearWebSQLLabel": {
"message": "Clear WebSQL",
"description": "Etiqueta para borrar WebSQL"
},
"saveSettingsButton": {
"message": "Save Settings",
"description": "Texto del botón para guardar configuración"
},
"settingsSaved": {
"message": "Settings saved successfully!",
"description": "Mensaje de configuración guardada"
}
}
locales/es/messages.json
{
"title": {
"message": "ClearSlate",
"description": "Título de la extensión"
},
"description": {
"message": "Borra automáticamente tus datos de navegación cuando cierras tu navegador.",
"description": "Descripción de la extensión"
},
"donateButton": {
"message": "Donar",
"description": "Texto del botón de donación"
},
"whitelistLabel": {
"message": "Lista Blanca",
"description": "Etiqueta de la lista blanca"
},
"addWhitelistButton": {
"message": "Añadir a Lista Blanca",
"description": "Texto del botón para añadir a la lista blanca"
},
"clearWhitelistButton": {
"message": "Limpiar Lista Blanca",
"description": "Texto del botón para limpiar la lista blanca"
},
"optionsTitle": {
"message": "Configuración de ClearSlate",
"description": "Título de las opciones"
},
"clearCacheLabel": {
"message": "Borrar Caché",
"description": "Etiqueta para borrar caché"
},
"clearHistoryLabel": {
"message": "Borrar Historial",
"description": "Etiqueta para borrar historial"
},
"clearCookiesLabel": {
"message": "Borrar Cookies",
"description": "Etiqueta para borrar cookies"
},
"clearDownloadsLabel": {
"message": "Borrar Descargas",
"description": "Etiqueta para borrar descargas"
},
"clearFormDataLabel": {
"message": "Borrar Datos de Formularios",
"description": "Etiqueta para borrar datos de formularios"
},
"clearLocalStorageLabel": {
"message": "Borrar Almacenamiento Local",
"description": "Etiqueta para borrar almacenamiento local"
},
"clearIndexedDBLabel": {
"message": "Borrar IndexedDB",
"description": "Etiqueta para borrar IndexedDB"
},
"clearServiceWorkersLabel": {
"message": "Borrar Service Workers",
"description": "Etiqueta para borrar service workers"
},
"clearWebSQLLabel": {
"message": "Borrar WebSQL",
"description": "Etiqueta para borrar WebSQL"
},
"saveSettingsButton": {
"message": "Guardar Configuración",
"description": "Texto del botón para guardar configuración"
},
"settingsSaved": {
"message": "Configuración guardada correctamente.",
"description": "Mensaje de configuración guardada"
}
}
locales/de/messages.json
{
"title": {
"message": "ClearSlate",
"description": "Titel der Erweiterung"
},
"description": {
"message": "Löscht automatisch Ihre Browsedaten, wenn Sie Ihren Browser schließen.",
"description": "Beschreibung der Erweiterung"
},
"donateButton": {
"message": "Spenden",
"description": "Text für den Spendenknopf"
},
"whitelistLabel": {
"message": "Weißeliste",
"description": "Bezeichnung der Weißeliste"
},
"addWhitelistButton": {
"message": "Zur Weißeliste hinzufügen",
"description": "Text für den Knopf, um zur Weißeliste hinzuzufügen"
},
"clearWhitelistButton": {
"message": "Weißeliste leeren",
"description": "Text für den Knopf, um die Weißeliste zu leeren"
},
"optionsTitle": {
"message": "ClearSlate-Einstellungen",
"description": "Titel der Optionen"
},
"clearCacheLabel": {
"message": "Cache löschen",
"description": "Bezeichnung zum Löschen des Caches"
},
"clearHistoryLabel": {
"message": "Verlauf löschen",
"description": "Bezeichnung zum Löschen des Verlaufs"
},
"clearCookiesLabel": {
"message": "Cookies löschen",
"description": "Bezeichnung zum Löschen der Cookies"
},
"clearDownloadsLabel": {
"message": "Downloads löschen",
"description": "Bezeichnung zum Löschen der Downloads"
},
"clearFormDataLabel": {
"message": "Formulardaten löschen",
"description": "Bezeichnung zum Löschen der Formulardaten"
},
"clearLocalStorageLabel": {
"message": "Lokalen Speicher löschen",
"description": "Bezeichnung zum Löschen des lokalen Speichers"
},
"clearIndexedDBLabel": {
"message": "IndexedDB löschen",
"description": "Bezeichnung zum Löschen von IndexedDB"
},
"clearServiceWorkersLabel": {
"message": "Service Workers löschen",
"description": "Bezeichnung zum Löschen der Service Workers"
},
"clearWebSQLLabel": {
"message": "WebSQL löschen",
"description": "Bezeichnung zum Löschen von WebSQL"
},
"saveSettingsButton": {
"message": "Einstellungen speichern",
"description": "Text für den Knopf, um die Einstellungen zu speichern"
},
"settingsSaved": {
"message": "Einstellungen erfolgreich gespeichert!",
"description": "Nachricht für gespeicherte Einstellungen"
}
}
locales/it/messages.json
{
"title": {
"message": "ClearSlate",
"description": "Titolo dell'estensione"
},
"description": {
"message": "Cancella automaticamente i tuoi dati di navigazione quando chiudi il browser.",
"description": "Descrizione dell'estensione"
},
"donateButton": {
"message": "Donare",
"description": "Testo per il pulsante di donazione"
},
"whitelistLabel": {
"message": "Lista Bianca",
"description": "Etichetta della lista bianca"
},
"addWhitelistButton": {
"message": "Aggiungi alla Lista Bianca",
"description": "Testo per il pulsante per aggiungere alla lista bianca"
},
"clearWhitelistButton": {
"message": "Pulisci Lista Bianca",
"description": "Testo per il pulsante per pulire la lista bianca"
},
"optionsTitle": {
"message": "Impostazioni di ClearSlate",
"description": "Titolo delle opzioni"
},
"clearCacheLabel": {
"message": "Cancella Cache",
"description": "Etichetta per cancellare la cache"
},
"clearHistoryLabel": {
"message": "Cancella Cronologia",
"description": "Etichetta per cancellare la cronologia"
},
"clearCookiesLabel": {
"message": "Cancella Cookie",
"description": "Etichetta per cancellare i cookie"
},
"clearDownloadsLabel": {
"message": "Cancella Download",
"description": "Etichetta per cancellare i download"
},
"clearFormDataLabel": {
"message": "Cancella Dati del Modulo",
"description": "Etichetta per cancellare i dati del modulo"
},
"clearLocalStorageLabel": {
"message": "Cancella Archiviazione Locale",
"description": "Etichetta per cancellare l'archiviazione locale"
},
"clearIndexedDBLabel": {
"message": "Cancella IndexedDB",
"description": "Etichetta per cancellare IndexedDB"
},
"clearServiceWorkersLabel": {
"message": "Cancella Service Workers",
"description": "Etichetta per cancellare i service workers"
},
"clearWebSQLLabel": {
"message": "Cancella WebSQL",
"description": "Etichetta per cancellare WebSQL"
},
"saveSettingsButton": {
"message": "Salva Impostazioni",
"description": "Testo per il pulsante per salvare le impostazioni"
},
"settingsSaved": {
"message": "Impostazioni salvate con successo!",
"description": "Messaggio per impostazioni salvate"
}
}
Paso 10: Agregar Iconos
Añade iconos de diferentes tamaños en la carpeta icons. Puedes usar cualquier editor de imágenes para crear estos iconos.
Paso 11: Cargar la Extensión en Chrome
- Abre Chrome y ve a
chrome://extensions/.
- Activa “Modo de desarrollador” en la esquina superior derecha.
- Haz clic en “Cargar desempaquetado” y selecciona tu carpeta de proyecto.
Paso 12: Probar la Extensión
Prueba todas las funcionalidades para asegurarte de que funcionan como se espera. Verifica que el cambio de idioma funciona correctamente y que puedes añadir y eliminar páginas de la lista blanca.
Esta estructura y código te proporcionan una base sólida para tu extensión de Chrome ClearSlate. Puedes seguir refinando y mejorando la interfaz y la funcionalidad según sea necesario.
