☰

¿Cómo obtener una vista previa en vivo de un sitio web de WordPress usando Adobe Brackets?

tag-icon • tag-icon wordpress brackets
¿Cómo obtener una vista previa en vivo de un sitio web de WordPress usando Adobe Brackets?

Soportes de Adobetiene una función de vista previa en vivo que me permite ver una página web HTML mientras trabajo en los archivos .css y .html.

Ahora estoy empezando a trabajar en un sitio web de WordPress que incluye archivos , .htmly .css. ¿Cómo puedo obtener una vista previa en vivo de un sitio web de WordPress usando Brackets?.js.php

Respuesta1

¡Creo que encontré una solución a esto!

Puede configurar una URL base de vista previa en vivo en la configuración de su proyecto. Cuando Brackets intenta obtener una vista previa de la página, cargará el nombre del archivo y la ruta en su proyecto del archivo actual, agregado al final de esa URL base.

El problema con WordPress es que la ruta y el nombre del archivo php en el que está trabajando en su proyecto rara vez están relacionados de alguna manera con la URL a la que accederá para ejecutar ese código y ver su página de plantilla.

Entonces, ¿qué hacemos si queremos que nuestro servidor muestre una página diferente a la que solicitó el navegador? ¡Reescritura de URL!

Configuré mi URL base entre paréntesis http://server.dev/theme/y luego creé un .htaccessarchivo para Apache en mi servidor de desarrollo. He aquí un ejemplo:

<IfModule mod_rewrite.c>
    RewriteEngine On
    RewriteRule theme/archive.php "/?m=201510"
    RewriteRule theme/ "/"
    RewriteRule theme/header.php "/"
    RewriteRule theme/footer.php "/"
    RewriteRule theme/page.php "/?page_id=16080"
    RewriteRule theme/search.php "/?s=asdf"
    RewriteRule theme/sidebar.php "/"
    RewriteRule theme/single.php "/?p=16247"
</IfModule>

Como puede ver, debe elegir algunas solicitudes de página arbitrarias para algunos de los archivos que editará.

Sin duda, hay muchos otros problemas con el flujo de trabajo y la actualización, al menos en las pruebas en Brackets 1.5, pero esto resuelve un gran problema al usar Live Preview de Brackets para WordPress.

Respuesta2

Túpoderuse Live Preview con su propio backend (como un servidor de WordPress), pero viene con ciertas advertencias:

  • Necesita un servidor que se ejecute localmente y apunte a la misma carpeta que tiene abierta para editar entre paréntesis.
  • La actualización de HTML en vivo está deshabilitada, aunque aún obtienes actualización de CSS en vivo (y resaltado del selector). Los corchetes recurren a una simple "recarga en vivo" cuando editas HTML, PHP u otros archivos.

La documentación tiene información más detallada:https://github.com/adobe/brackets/wiki/How-to-Use-Brackets#lp-custom-server.

Respuesta3

Ojalá pudieras, sin embargo, la función de vista previa en vivo de Brackets parece basarse en un flujo de trabajo estático. No hay soporte alguno para obtener una vista previa de ningún idioma dinámico y, hasta donde yo sé, tampoco hay planes para agregarlo.

También es una pena porque hace que la aplicación sea completamente inútil para mí. :-/

información relacionada