Nota:

Adobe Muse ya no añadirá nuevas funciones y dejará de ofrecer asistencia técnica el 26 de marzo de 2020. Para obtener información detallada y asistencia, consulte Página de fin de servicio de Adobe Muse.

Al diseñar sitios web para los propietarios de sitios, una de las principales peticiones consiste en configurar un sistema para que puedan actualizar su propio contenido del sitio. También es muy útil tener una forma de realizar cambios sobre la marcha cuando se encuentra fuera de la estación de trabajo y desea realizar revisiones a un sitio.

Muse ahora incluye una función llamada In-Browser Editing, que le permite a usted, a los propietarios del sitio y a los miembros de su equipo cambiar el texto y el contenido de la imagen con la interfaz del administrador de Business Catalyst. Los editores con In-Browser Editing no necesitan instalar Adobe Muse.

In-Browser Editing también es fácil de usar. Las personas sin experiencia previa en diseño web pueden hacer cambios porque la edición se realiza en un navegador web, una vez que se les ha concedido acceso de edición.

Con este artículo, aprenderá cómo se puede configurar un sitio de Adobe Muse para activar In-Browser Editing a fin de que los usuarios invitados al sitio puedan actualizar un sitio de Adobe Muse. Obtendrá una descripción general de los pasos que se deben llevar a cabo para usar la interfaz de In-Browser Editing, para que pueda ayudar a otros a aprender cómo utilizarlo para realizar cambios. Y por último, verá cómo sincronizar el archivo .muse vuelve con la versión actual después de que los cambios se hayan aplicado al sito activo con la interfaz de In-Browser Editing.

¿Qué contenido se puede editar mediante In-Browser Editing?

Contenido ¿Editable? Seguir vínculos
Texto horizontal No
Marcos de imagen
Texto vertical No No
Imagen - Relleno de fondo (rectángulos, marcos de imagen y widgets) No No
Contadores de proyecciones de diapositivas No No
Botones de envío de formularios No No
Etiquetas de menú dinámicas (widgets de menú no configurados como Manual) No No
Elementos de página rasterizados (se incluyen imágenes con esquinas redondeadas, bordes biselados, resplandor interior o rotación aplicada, marcos de texto con fuentes del sistema, y marcos de texto rotados con efectos aplicados) No No
Texto con hipervínculos
Etiquetas de texto - Widgets de acordeón 
Etiquetas de texto - Widgets de panel en fichas
Etiquetas de texto - Widgets de menú manual

Botones - Widgets de proyecciones de diapositivas

 

Botones - Widgets de composición

Imágenes en miniatura de la proyección de diapositivas

Marcos de texto e imagen dentro de las áreas de "activación" de los widgets de composición

Configuración de edición en navegador

El proceso de configuración de la función de edición en navegador consta de dos partes. En primer lugar, hay que activar la configuración en Propiedades del sitio y publicar el sitio en los servidores de alojamiento de Adobe. A continuación, puede invitar a los nuevos usuarios al sitio, de manera que puedan iniciar sesión con cualquier navegador para realizar cambios.

Como se ha mencionado anteriormente, las imágenes de fondo no se pueden editar con In-Browser Editing. Si el sitio contiene imágenes que son esenciales para el diseño que no desea que el propietario del sitio cambie, asegúrese de que se añaden como imágenes de fondo antes de activar In-Browser Editing y conceder acceso de edición.

Nota:

Para utilizar In-Browser Editing, el sitio web de prueba o activo debe estar alojado en los servidores de alojamiento de Adobe Business Catalyst.

  1. Inicie Adobe Muse y abra el sitio que desea configurar.

    inbrowserediting
    Marque la casilla Activar In-Browser Editing en el cuadro de diálogo Propiedades del sitio.

  2. Seleccione Archivo > Propiedades del sitio. Haga clic en la ficha Avanzadas y compruebe que la opción Activar In-Browser Editing esté habilitada.

    Si no es así, habilite la casilla de verificación Activar In-Browser Editing.

  3. Haga clic en OK para cerrar el cuadro de diálogo Propiedades del sitio.

  4. Desde la barra de navegación superior de Adobe Muse, haga clic en Publicar > Business Catalyst.

    Publique el sitio mediante Business Catalyst.
    Publique el sitio mediante Business Catalyst.

    Seleccione las opciones que desee en el cuadro de diálogo Publicar y, a continuación, haga clic en Publicar para cargar todos los archivos del sitio al servidor de alojamiento de Adobe Business Catalyst.

    Nota:

    Se puede crear un nuevo sitio de prueba o cargar un sitio activo que utilice un nombre de dominio personalizado. In-Browser Editing funciona tanto para sitios de prueba como activos, siempre que éstos se alojen en el servidor web de Adobe.

  5. Una vez finalizada la operación de publicación, el cuadro de diálogo Publicar se actualiza para preguntarle si desea añadir un usuario de In-Browser Editing al sitio.

    Tiene que añadir usuarios de In-Browser Editing a su sitio web para que puedan editar su sitio activo. Utilizará la interfaz de usuarios Admin a fin de crear una cuenta para los usuarios, tras lo cual podrán iniciar sesión en su sitio y empezar a editarlo.

    fig02_ibe
    El cuadro de diálogo permite elegir entre hacer clic en un vínculo y hacer clic en OK.

  6. Puede hacer clic en el vínculo para añadir usuarios de In-Browser Editing o simplemente hacer clic en OK para cerrar el cuadro de diálogo.

    Para este ejemplo, haga clic en OK.

    Si hace clic en el vínculo para añadir usuarios de In-Browser Editing, verá la misma interfaz que se describe en el paso 9.

  7. En Adobe Muse, haga clic en el vínculo para añadir usuarios de In-Browser Editing descrito en el paso 5, o bien seleccione Archivo > Gestionar sitio de Business Catalyst.

    La interfaz de Business Catalyst del sitio se abrirá en una nueva ventana del navegador.

    Gestionar sitio de Business Catalyst
    Elija la opción para agregar nuevos usuarios a In-Browser Editing.

    Nota:

    También puede hacer clic en el botón Administrar una vez que haya publicado un sitio y, a continuación, invitar a un usuario Admin mientras realiza otras actualizaciones para administrar el sitio.

  8. En la interfaz de usuario de Business Catalyst, en el panel de navegación izquierdo, haga clic en Configuración del sitio > Usuarios Admin.

  9. Haga clic en Invitar usuario Admin.

    fig04_ibe
    Invite un nuevo usuario Admin en la interfaz de usuarios Admin para el sitio.

    La sección de usuarios Admin se actualiza con una nueva interfaz.

  10. En los campos que aparecen, introduzca la dirección de correo electrónico del nuevo usuario, el nombre y el apellido. Opcionalmente, puede introducir su número de teléfono móvil. Configure el menú de funciones de usuario para los usuarios.

    fig05_ibe
    Introduzca el nombre y la dirección de correo electrónico de la persona en los campos correspondientes.

  11. Haga clic en Invitar para añadir el nuevo usuario a su sitio de Adobe Muse.

    Nota:

    Después de enviar la información, el sistema envía automáticamente la información de inicio de sesión a la persona que ha invitado en un mensaje de correo electrónico. Recibirá el correo electrónico y, a continuación, hará clic en el vínculo para configurar la contraseña única que elija. Una vez que han creado una contraseña para su cuenta, pueden iniciar sesión en la función de edición del sitio con cualquier navegador web.

Actualización de un sitio con In-Browser Editing

Esta sección enumera los pasos que cualquier usuario puede seguir para actualizar un sitio de Adobe Muse, una vez que se les ha concedido acceso. Si desea enviarles una copia de los pasos, puede descargar estas instrucciones.

  1. Abra un navegador y escriba una de las opciones siguientes:

    • mi-sitio.businesscatalyst.com/admin (sitio de prueba)
    • mi-sitio.com/admin (sitio activo)
  2. Introduzca la dirección de correo electrónico y la contraseña para iniciar sesión en Business Catalyst.

    Habrá recibido los detalles de inicio de sesión en su correo electrónico.

    fig06_ibe
    Utilice cualquier navegador para iniciar sesión en su cuenta del sitio.

  3. Haga clic en el botón Editar para ver su sitio en la interfaz de edición.

    fig07_ibe
    Comience a editar el sitio haciendo clic en el botón Editar.

    La página de inicio del sitio se carga en la interfaz de In-Browser Editing.

Edición de texto mediante In-Browser Editing

Cuando se realizan cambios en un sitio, recuerde que está trabajando en una ventana del navegador. Es importante que se publiquen los cambios que se realicen antes de abandonar la página actual o cerrar la ventana del navegador, a menos que cambie de idea y decida descartar los cambios.

Siga estos pasos para editar el contenido del texto en su sitio:

  1. Cuando inicie sesión en su sitio web con Business Catalyst, podrá ver una superposición azul alrededor del texto. Seleccione o elimine el texto, y comience a escribir su contenido.

    Edición de texto mediante In-Browser Editing
    Seleccione el texto que desea editar y comience a escribir su actualización.

    Cuando coloca el cursor sobre el texto en un cuadro de texto, In-Browser Editing muestra el formato que se ha aplicado al texto. De forma predeterminada, el mismo formato se aplicará a cualquier texto que escriba en el cuadro de texto.

    Formato de texto en In-Browser Editing
    Vea el formato que se muestra cuando coloca el cursor sobre el texto.

  2. Si no está satisfecho con los cambios y desea volver al texto original, haga clic en el icono Deshacer situado en la parte superior de la página.

     

    Haga clic en Deshacer para volver al original.
    Haga clic en el icono Deshacer para volver al texto original.

  3. Cuando haya terminado de editar el texto, haga clic en Publicar.

    fig11_ibe
    Haga clic en el botón Publicar para introducir los cambios y activarlos.

    Los cambios que realice en la interfaz de edición no se aplican al sitio web activo hasta que haga clic en el botón Publicar en la parte superior de la página. Si decide no realizar cambios, cierre la ventana del navegador.

Edición de imágenes que se colocan o pegan en una página

Mediante In-Browser Editing, puede editar algunas de las imágenes del sitio, siempre y cuando se inserten como imágenes en primer plano. Si las imágenes de este sitio se establecen como una imagen de fondo, no se pueden editar. Si encuentra imágenes no editables que desea cambiar, póngase en contacto con la persona que ha diseñado el sitio.

  1. Haga doble clic en la imagen que desee editar.

    Verá un botón Editar imagen situado junto a la imagen.

    Edite imágenes mediante In-Browser Editing
    Al pasar sobre una imagen editable, se muestra el botón Editar imagen.

  2. Haga clic en Editar imagen.

    Aparece un mensaje emergente, que contiene todos los activos que se utilizan en el proyecto. Elija una imagen de los activos existentes, o bien cargue una nueva imagen desde el equipo mediante el botón Cargar foto.

    Edite una imagen mediante In-Browser Editing
    Utilice la interfaz Editar imagen para cambiar la imagen existente por una nueva.

    Si elige la opción Cargar foto, la imagen seleccionada en el equipo se cargará en el sitio automáticamente.

    El archivo seleccionado se cargará a los mismos servidores web que alojan el sitio web.

  3. Si lo desea, puede introducir una descripción en el campo de información de imagen. Esta práctica es la más recomendable, ya que ayuda a mejorar la optimización de motores de búsqueda y también ayuda a que el sitio sea más accesible.

  4. Realice una de las siguientes acciones:

    • Haga clic en la marca para guardar los cambios.
    • Haga clic en el símbolo de la cruz para cancelar la actualización.

    Cuando reemplace una imagen, la nueva imagen que seleccione se recortará para ajustarse si tiene una relación de aspecto diferente a la imagen original. Por este motivo, se recomienda que solo se sustituya una imagen existente por otra imagen de las mismas dimensiones o una imagen más grande con la misma relación de anchura y altura.

    Si planea cambiar una imagen concreta periódicamente, puede pedir a la persona que creó inicialmente el sitio cargar diferentes imágenes con el mismo tamaño, para que pueda elegir una imagen que ya exista en el sitio. Por ejemplo, el diseñador de la web podría cargar cuatro imágenes de las mismas dimensiones para primavera, verano, otoño o invierno. Con el transcurso del tiempo, podría elegir la opción De sitio y, a continuación, cambiar la imagen que refleje la temporada actual.

  5. Cuando haya terminado de realizar todos los cambios, haga clic en Publicar para activar los cambios.

Edición de imágenes que se colocan dentro de marcos de texto

Si una imagen de la página se pega dentro de un marco de texto, aún se puede editar.

  1. Seleccione el marco de texto. A continuación, seleccione la imagen dentro del marco de texto. 

El botón Editar imagen aparece junto a la imagen seleccionada.

Edite la imagen dentro de un cuadro de texto
Seleccione el cuadro de texto y, a continuación, seleccione la imagen dentro del cuadro de texto para hacer clic en Editar imagen.

  1. Haga clic en Editar imagen. Elija uno de los activos existentes, o bien haga clic en Cargar foto para cargar una nueva imagen desde el equipo.
  2. Cuando haya terminado de realizar todos los cambios, haga clic en Publicar para activar los cambios.

Edición de contenido compartido

Parte del contenido del sitio se puede añadir a la página maestra creada cuando se diseñó el sitio. Cuando los elementos se añaden a la página maestra, se muestran en las demás páginas del sitio que están vinculadas a dicha página maestra. Esto significa que si se cambia un elemento en una página, actualizará las demás instancias de dicho contenido.

Cuando se selecciona un elemento que está compartido para editarlo, el elemento se muestra en la ventana de editar imágenes compartidas.

fig16_ibe
Edite el contenido que se comparte en todas las páginas en la ventana de editar imágenes compartidas.

Tenga cuidado cuando aparezca esta ventana porque significa que otras páginas del sitio web también pueden actualizarse automáticamente al realizar cambios. Lo mejor es actuar con cautela, haciendo clic en Cancelar. Visite el sitio activo en una nueva ventana del navegador y revise las páginas para ver dónde aparece el elemento. Confirme que desea cambiar todas las iteraciones del elemento antes de volver a la interfaz de In-Browser Editing para actualizarlo.

Edición de hipervínculos

Para obtener más información sobre la edición de hipervínculos, consulte Edición de hipervínculos.

Seguimiento de vínculos de la página principal para editar otras páginas del sitio

La primera vez que inicie sesión en su cuenta, se presenta con una versión editable de la página principal del sitio. Una vez que haya terminado de realizar cambios en la página de inicio, puede visitar otras páginas vinculadas en el sitio que también puede editar.

  • Si los vínculos aparecen fuera de un marco de texto, simplemente haga clic en el vínculo para ir a la página vinculada en el sitio. Los vínculos externos (a las páginas web que no se encuentran en el sitio actual) no se cargarán en la interfaz de edición porque no puede utilizar In-Browser Editing para editar páginas en otros sitios web.
  • Si los vínculos aparecen dentro de marcos de texto, coloque el cursor sobre ellos para ver un botón. Haga clic en el botón para ir a la página web vinculada. Por ejemplo, haga clic en el botón de inicio para ir a la página de inicio de su sitio.
  • Si se aplica un vínculo a un marco de texto completo, haga clic en el marco completo para ver el botón que contiene el vínculo o la etiqueta de anclaje.
fig17_ibe
Haga clic en el botón para acceder a la página vinculada o a la ubicación de la etiqueta de anclaje.

Cuando haya terminado de editar cada página del sitio, asegúrese de hacer clic en Publicar si desea guardar los cambios. Cuando haya terminado de editar el sitio completo, cierre la ventana del navegador.

Previsualización de los cambios en In-Browser Editing

In-Browser Editing admite los diseños adaptables. Es decir, puede previsualizar directamente los cambios y el aspecto que tendrán en cada punto de rotura. Por otro lado, si ha utilizado diseños alternativos para su sitio, puede utilizar el menú desplegable y previsualizar los cambios para cada dispositivo.

Para previsualizar los cambios:

  1. Realice los cambios necesarios en el contenido de su sitio.

    Observe el punto de rotura a 1200 px, donde ha actualizado el contenido. Previsualice el cambio en este punto de rotura.

  2. En el menú desplegable, elija otros puntos de rotura y previsualice los cambios en cada punto de rotura.

  3. Si ha creado su sitio con diseños alternativos, elija el dispositivo en el menú desplegable y previsualice los cambios.

Sincronización de ediciones del archivo .Muse

Una vez que se produce la edición en navegador, su archivo local de .muse ya no tiene el mismo contenido que el sitio activo. En esta sección podrá obtener información acerca de cómo aprobar o rechazar los cambios que han realizado para actualizar el archivo .Muse y que coincida con el diseño del sitio actual.

  1. Inicie Muse y abra el archivo .muse del sitio.

    Aparecerá un mensaje de alerta, en el que se indicará que el sitio publicado ha cambiado.

    Además de ver un mensaje la primera vez que se abre un archivo .muse, también se muestra un mensaje cuando se comienza a publicar un archivo .muse que no está sincronizado con el sitio web activo, que le recuerda que revise los cambios antes de publicar el sitio nuevamente.

    Nota:

    En cualquier momento, también puede elegir Archivo > Sincronizar con el sitio de Adobe Business Catalyst para ver una interfaz que le permita revisar las diferencias entre el archivo .muse y el sitio activo.

  2. Haga clic en Revisar para revisar los cambios.

    Aparece la ventana Revisar y combinar cambios.

  3. Utilice la interfaz para revisar cada cambio. Los cambios realizados en cada edición se resaltan. El contenido nuevo se resalta en verde, y los elementos que se han eliminado están marcados en rojo, por lo que podrá ver de un vistazo lo que ha agregado o eliminado.

  4. Utilice las opciones del menú desplegable (No combinar o Combinar en Muse) para rechazar o aceptar el cambio específico o todos los cambios.

    fig20_ibe
    Utilice el menú de opciones para combinar o descartar los cambios.

    Nota: si no combina los cambios, sobrescribirá los cambios aplicados al sitio activo la próxima vez que publique el archivo .muse. Este comportamiento le ayuda a corregir errores tipográficos y otros problemas de sitio que pueden producirse cuando editan el sitio con In-Browser Editing.

  5. Para comparar la versión activa del sitio web del texto y las imágenes con el archivo local .muse, active y desactive la vista previa en la casilla de verificación de la página.

    fig21_ibe
    Oculte y muestre los cambios recientes en la vista Diseño, seleccionando y anulando la selección de la casilla de verificación Vista previa de la página.

    Una vez que haya terminado la sincronización y edición del archivo .muse, publíquelo para añadir los cambios a la página activa. El diseño actual del archivo .muse sobrescribe los elementos modificados marcados como No combinar al publicar de nuevo el sitio.

Guardado de iteraciones publicadas del sitio web

Puesto que otras personas pueden realizar cambios en el sitio activo mientras realiza cambios en el archivo .muse, se recomienda guardar copias del sitio después de sincronizar los cambios y publicar la versión más reciente.

Inmediatamente después de la publicación del sitio, elija Archivo > Guardar sitio como y guarde una copia de su archivo .muse. Si lo desea, puede incluir la fecha actual en el nombre de archivo al crear nuevas copias. Gracias a esta práctica, resulta más fácil encontrar el archivo .muse que ha publicado en una fecha concreta.

Por ejemplo, puede crear una carpeta que contenga la última copia de trabajo del archivo .muse y muchas otras versiones almacenadas previamente publicadas que contengan las iteraciones de diseño del sitio publicadas anteriormente. La lista de archivos de la carpeta puede tener el siguiente aspecto:

my-site.muse

my-site_2013-1-4.muse

my-site_2013-2-23.muse

my-site_2013-4-7.muse

Además de facilitar la recuperación de los diseños de sitio anteriores, esta práctica ayuda a Muse a determinar con precisión qué cambios (si los hay) se han realizado en el sitio web mediante In-Browser Editing. Al guardar las versiones de copia de seguridad de un sitio, resulta también más fácil comprobar si el archivo actual .muse y su sitio web activo todavía se encuentran en sincronización.

Esta obra está autorizada con arreglo a la licencia de Reconocimiento-NoComercial-CompartirIgual 3.0 Unported de Creative Commons.  Los términos de Creative Commons no cubren las publicaciones en Twitter™ y Facebook.

Avisos legales   |   Política de privacidad en línea