Está claro que hay sitios web de todo tipo y de todos los diseños. Entre ellos, una variedad incontable presencian distintas particularidades en materia visual, que probablemente te hayan inspirado en editarlas como si de un documento de Word se tratasen. Por lo que, si te gustaría convertir tu navegador en una especie de editor de páginas, estoy seguro que esto te va a interesar.
Para los que llevamos muchos años navegando por Internet es normal que lo sepamos de antemano, pero si no llega a ser tu caso pues aquí te lo explico en tres simples pasos, probado y adaptado a los navegadores web más usados. Cabe aclarar que esto no se trata de ningún hack ni nada por el estilo. Únicamente afecta al lado del cliente, implicando que cuando recargues volverás a ver la versión original.
Paso a paso
Antes que nada, no te olvides de dirigirte al sitio que quieres editar.
- Copia el siguiente código y pégalo en la barra de direcciones: document.body.contentEditable = true; document.designMode = 'on'; void 0
- Agrégale la frase javascript: al comienzo de lo que pegaste. Debe quedar de la siguiente manera:
javascript:document.body.contentEditable = true; document.designMode = 'on'; void 0 - Presiona enter.
Si hiciste todo correctamente, deberías poder interactuar con los objetos. Técnicamente hablando, lo que hace este script son dos cosas: la primera que la etiqueta body del HTML junto con sus elementos sean editables, y la segunda habilitar el modo de diseño, lo que nos permite manipular los objetos gráficamente con la propiedad anterior. Por último, se le indica que la función devuelva un resultado indefinido, evitando que nos salten errores.
¿Y para desactivarlo?
Existe una forma muy práctica de deshabilitarlo sin tener que reiniciar el sitio y no perder los cambios que hayamos realizado. Es tan simple como repetir el procedimiento anterior, pero en el primer paso, utilizando el siguiente código:
document.body.contentEditable = false; document.designMode = 'off'; void 0
No hay comentarios: