Desde Discovery Formación queremos mostrarte Como editar contenido de una página web en el navegador.
Cuando visitamos una página web tenemos acceso a una serie de herramientas dentro del propio navegador, que nos permitirán ver el código fuente de la misma. Podremos desde crear una simple broma (noticia viral), hasta poder investigar la estructura de la página (de cara a SEO por ejemplo).
Tenemos dos maneras de acceder al código de la web visitada, en este tutorial asumiremos que estamos usando el navegador Chrome.
Ver código fuente completo
Hacemos click derecho en cualquier parte de la página y vamos a ver código fuente
Donde podremos ver el código fuente al completo
Si queremos acceder o buscar algún término en concreto podemos usar el buscador de palabras mediante “CONTROL + F”
Lo cual nos permitirá localizar elementos dentro del código de manera muy cómoda.
Ver código de un elemento en concreto
Hacemos click derecho sobre el elemento que nos interese (por ejemplo, un título), e iremos a la opción “Inspeccionar”
Esto nos abrirá el editor de código del navegador
En la parte izquierda podemos acceder al código HTML (que mostrará la estructura de la web, así como el tipo de elemento).
El elemento aparecerá marcado en azul y ahora podremos hacer click derecho y elegir la opción “edit as html”, lo que nos permitirá modificar el texto del elemento original.
Si cerramos el editor, podemos visualizar el nuevo contenido en la página
Si refrescamos el navegador, se volverá a cargar el contenido original.
Mediante el editor del navegador, también podemos acceder a las propiedades de formato (CSS), donde podemos editar propiedades o incluso añadir nuevas propiedades para realizar pruebas.
Cursos relacionados:
Creación de páginas web con wordpress
