Oxygen Builder para equipos y agencias: ¿cómo colaboramos?

Oxygen Builder es una herramienta increíblemente poderosa, pero cuando se trata de la colaboración del equipo en la creación del sitio web, las cosas pueden volverse un poco difíciles. Oficialmente, el equipo detrás del generador de página recomienda insistentemente que un solo usuario edite una vez. Desafortunadamente, para las principales agencias de proyectos, esto es imposible y puede asustar a algunos para usar esta herramienta.

En nuestra opinión, las ventajas superan con creces estas desventajas y hemos encontrado varias formas de resolver estas limitaciones. En este artículo, discutiremos cómo nuestro equipo colabora al crear sitios web con Oxygen Builder. En el último año, hicimos la transición a crear el 100% de todos los sitios y proyectos de nuestras agencias en oxígeno, obteniendo una comprensión bastante decente de lo mejor.
Actualización de abril de 2022: ahora usamos el complemento de colaboración DPLugins, que resuelve el problema de editar a los muchos usuarios en Oxygen Builder. Lea nuestra reseña aquí. En primer lugar, comprende los límites del constructor antes de comenzar a tener en cuenta la colaboración con Oxygen Builder, es importante comprender las limitaciones y por qué es exactamente difícil para más usuarios crear efectivamente un sitio web con oxígeno.
En primer lugar, debe leer este artículo publicado por el equipo de Oxygen, que especifica exactamente por qué existe el bloqueo de edición (el mecanismo que hace que un solo usuario edite una vez). Aquí están las cosas importantes:
“Debido a cómo el oxígeno ahorra estilos globales, clases y configuraciones, la edición con más usuarios o más pestañas con oxígeno está muy desanimado. Le recomendamos que use una sola pestaña cuando trabaje con oxígeno para evitar problemas en los que una pestaña guarda datos más antiguos que el otro, lo que lleva a sobrescribir nuevos cambios. El mismo escenario puede ocurrir cuando dos o más usuarios trabajan en oxígeno al mismo tiempo ”. Esencialmente, todo se almacena en un lugar central. Las pestañas no se hablan entre sí, por lo que si un desarrollador agrega una clase personalizada o un CSS personalizado en la hoja de estilo global, y otro desarrollador no lo hace, incluso si el primero salva, si el segundo ahorra después, las clases y los estilos estar sobrescrito y perdido. No es bueno para la colaboración. Si tiene que trabajar en el equipo, es importante comprender por qué esto funciona, por lo que puede evitar fácilmente este problema. Nuevamente, las dos cosas que se sobrescribirán: 1) Las clases personalizadas agregadas y 2) CSS agregados a la hoja de estilo global. Mientras haya un solo usuario en una página/plantilla guardada, la estructura se guardará, así como cualquier estilos establecido para la identificación individual estará bien. Pero si agrega cursos (importante, porque esto ahorra mucho tiempo), se pueden sobrescribir. Si no tiene que editar todo a la vez, no. Pero si esto es esencial para su empresa o proyecto, pruebe algunas de las técnicas que se analizan a continuación.
Editar de todos modos (o deshabilitar esto) Lo primero que debe recordar es que, desde un punto de vista técnico, puede sobrescribir el bloque de edición, lo que hacemos. No hay configuración para activar, simplemente haga clic en la edición de enlace de todos modos. Esto significa que técnicamente todo nuestro equipo puede inicializar técnicamente al constructor a la vez, pero consideraría leer más sobre cómo lo hacemos. Todavía tenemos que considerar los problemas de anulación aquí. Una cosa interesante a tener en cuenta es que con el paquete de hidrógeno (uno de nuestros principales suplementos para oxígeno, lo usamos todos los días), puede desactivar la función de “edición de bloqueo”, esconder “Editar de todos modos “juntos. Esto es solo estéticamente agradable, pero realmente no afecta el flujo de trabajo.
Use un marco El marco es una mentalidad, que debe tenerse en cuenta durante todo el proceso de diseño y creación de un sitio web en oxígeno. Un marco es una colección de clases de CSS que trabajan juntas para ayudarlo a estructurar su sitio de manera consistente. El marco está muy extendido en la industria del diseño web. Por ejemplo, hay bootstrap, viento de cola y muchos más.

Tailwind CSS (recuerde el código real aquí. Las clases en este marco se ven como “Text-LG”). Con una actualización reciente de cuchillo suizo, puede cargar en clases de construcción, puede llamar a la hoja de estilo de cuadro y puede usar prácticamente cualquier cosa Tienes una lista de clases.
Para nosotros, utilizamos un marco de oxígeno específico llamado CSS de núcleo. Está incluido en Oxyninja Core, que es uno de nuestros complementos favoritos debido a este marco. Aquí está la propuesta de venta, del sitio: “Hacer un sitio coherente perfecto nunca ha sido tan fácil en combinación entre las clases de servicios públicos básicos y el constructor de oxígeno. ¡Las columnas de la cuadrícula CSS, las tarjetas, la tipografía, el tamaño y el espaciado, los colores y más ya están configurados! ”Con el marco, podemos aplicar fácilmente la fuente, el relleno y más, sin tener que agregar nuevas clases de CSS y mantener la consistencia sin necesidad de un centro central. Guía de estilo digital. Debido a que las clases se instalan en el sitio desde el comienzo del desarrollo, no hay necesidad de agregar nuevas clases, lo que significa que nada se sobrescribe.


Escriba CSS fuera del fabricante como agencia, nos gusta usar CSS para crear interacciones únicas y efectos de desplazamiento. Por lo tanto, generalmente tenemos una gran cantidad de CSS personalizados que cada uno de nuestros desarrolladores escribe solos. Sería bueno agregar a la hoja de estilo global si solo hubiera un usuario en el sitio web a la vez, pero generalmente más desarrolladores funcionan, por lo que necesitamos una forma de evitar el problema de anulación.
Para hacer esto, simplemente escribimos CSS en un complemento de terceros llamado Advanced Scripts. Es creado por el mismo desarrollador detrás del paquete de hidrógeno y es uno de nuestros complementos favoritos. Cada desarrollador tiene su propia hoja de estilo que escribe CSS. En el rescate, los estilos se aplican a nivel mundial en el sitio. Al final del proyecto, todos los estilos se combinan en una sola hoja de estilo principal. Constantemente hay muchos casos en los que debemos agregar clases CSS específicas para los elementos individuales en el edificio. Cuando se trabaja en equipo, esto es arriesgado debido a los problemas en los que las cosas se sobrescriben. Para hacerlo bien y no perder ningún trabajo, todos colaboramos con Slack si tiene un solo desarrollador en todos los estilos necesarios a la vez. Esta es quizás la mayor molestia con este constructor, pero si todos los datos se administran correctamente.

Debido a que todos los CS asociados con las clases están en hojas de estilo, todo lo que tenemos que hacer es agregar las clases y los estilos se aplicarán en consecuencia.
Experimentamos aún más conceptos. Por ejemplo, podemos crear un depósito de GitHub que contenga una hoja de estilo CSS central y podemos usar la función Live Share para escribir estilos juntos. Luego podemos usar scripts avanzados y estáticos para entregar estilos en nuestro sitio. También adoptamos recientemente la carga de bloque de la clase que viene con un cuchillo suizo. ¿Haces cosas diferentes que dan como resultado un flujo de trabajo colaborativo y mejor en oxígeno? ¡Cuéntanos aquí en los comentarios!

Suscribir y distribuir
Si le gustó este contenido, suscríbase al resumen mensual de noticias de WordPress, inspiración para sitios web, ofertas exclusivas y artículos interesantes.No enviamos spam y nunca venderemos o distribuiremos su correo electrónico.

Copyright statement: Unless otherwise noted, this article is Collected from the Internet, please keep the source of the article when reprinting.

Check Also

gkOVSBm5B8SgiXmo

Shopify vs WooCommerce – ¿Cuál es la mejor plataforma?(Comparación)

Shopify vs WooCommerce

Leave a Reply

Your email address will not be published. Required fields are marked *