Cómo editar su sitio web en un navegador …¡Y luego guárdalo!

todos hemos estado allí:

mirando tu sitio web y obsesionándonos con algunas pequeñas cosas que simplemente no parecen «correctas».

tal vez sea el texto, la fuente, el espaciado, los colores o algo más.

de cualquier manera, te gustaría simplemente hacer una edición rápida y pulsar Guardar cuando todo se ve perfecto.

la buena noticia es que los navegadores modernos (como Chrome, Firefox y Safari) ofrecen un par de formas de previsualizar cambios simples en cualquier página web. Sí, cualquier página web. ¡Incluso los que no son tuyos!,

esto significa que puede modificar el HTML y CSS (también conocido como código fuente) directamente en su navegador.

tenga en cuenta que esto solo modifica la versión local en su computadora y en realidad no reescribe nada en el servidor. Es sólo una vista previa.

pero espera, ¡hay más!

ahora hay una manera de hacer ediciones a su sitio web utilizando las herramientas de desarrollador de su navegador que se pueden guardar permanentemente en el servidor, así que siga leyendo!

Aquí está el proceso paso a paso para editar una página web utilizando Google Chrome.,

cómo editar un sitio web utilizando herramientas para desarrolladores

  • abra cualquier página web con Chrome y pase el mouse sobre el objeto que desea editar (es decir, texto, botones o imágenes).
  • haga clic con el botón derecho en el objeto y seleccione «Inspeccionar» en el menú contextual.Las herramientas para desarrolladores se abrirán en la mitad inferior de la pantalla y el elemento seleccionado se resaltará dentro de la interfaz, también conocida como DOM.
  • haga Doble clic en el objeto seleccionado y cambiará al modo de edición., Puede reemplazar los atributos de texto o estilo (es decir: colores, fuentes, espaciado) y luego hacer clic fuera del DOM para aplicar los cambios.
  • Use el atajo «find» para ayudarlo a buscar atributos de texto o estilo específicos. («CMD + F «en Mac o» CTRL + F»en PC)

edite el texto de cualquier sitio web utilizando nuestro práctico bookmarklet

  • resalte el texto en negrita a continuación:
    javascript:document.cuerpo.contentEditable = ‘true’; documento.designMode = ‘on’; void 0
  • arrastre el texto resaltado a la barra de marcadores.,
  • haga clic en el icono cada vez que desee editar texto en una página!

Ahora que usted sabe cómo modificar cualquier sitio web, vamos a volver a lo que es más importante.

Cómo editar su sitio web y guardar los cambios

Esto no podría ser más sencillo. Si su sitio web está construido y alojado con PageCloud, puede usar las herramientas de desarrollador de su navegador para realizar ediciones permanentes en cualquiera de sus páginas web.

usando las herramientas de desarrollador con PageCloud:

  • inicie sesión en PageCloud.,
  • vaya a la página de su sitio web que desea modificar.
  • haga clic en el símbolo ‘Editar página’ en la esquina inferior derecha. Si no puedes verlo, actualiza la página. («CMD + R» en Mac o «CTRL + R» en PC).
  • Una vez cargado el editor, siga estos pasos.
  • pulse Guardar en el editor o utilice el acceso directo: («CMD + S» en Mac o «CTRL + S» en PC).

fácil ¿correcto?

¿Qué tal algunas noticias aún mejores? Puede omitir las herramientas para desarrolladores y simplemente hacer cambios directamente en el editor.,

PageCloud le permite personalizar completamente sus páginas sin tener que entrar en el código fuente. Simplemente haga clic y edite usando la paleta. Si nunca has escrito Código, esta será una interfaz mucho más fácil de usar!

echa un vistazo a cómo construir un sitio web profesional para obtener más consejos sobre cómo crear un sitio web con PageCloud

Si eres un desarrollador y quieres llevar tu sitio al siguiente nivel, puedes acceder al editor de JavaScript utilizando el acceso directo «J + S» mientras inicias sesión en el editor de sitios web de PageCloud.

Nunca había oído hablar de PageCloud?,

Pruébelo gratis hoy y cree un sitio web personalizado que le ofrezca total libertad para hacer todos los cambios que desee. Regístrese para una prueba gratuita y comience con PageCloud!

Share

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *