Plantilla 1 con Bitrix. Soluciones listas para usar. Donde hay dos, hay tres

La plantilla define el diseño. elementos funcionales, visualización de páginas y estilo artístico. El general apariencia sitio.

Por lo general, se usa un diseño para todas las páginas, pero 1C Bitrix le permite usar varias opciones de diseño simultáneamente.

Con las herramientas integradas, puede configurar sus propias plantillas para todas las secciones e incluso páginas. También puede establecer varias condiciones para mostrar un circuito en particular. La configuración se realiza a través del panel de administración.

Las plantillas de página se almacenan en la carpeta "plantillas" del mismo nombre. EN editor visual Simplemente seleccione la opción requerida de la lista y complétela con los datos necesarios. Una característica de las plantillas es la separación de la lógica de la presentación.

¿Quién necesita plantillas y por qué?

El sistema Bitrix le permite crear y utilizar plantillas prediseñadas, aplicándolas a los espacios de trabajo.

Esta es una solución práctica y eficaz cuando se trabaja con páginas de varios componentes con una estructura compleja, por ejemplo cuando se trabaja con una tienda en línea o un portal de noticias.

Ventajas de una plantilla correctamente seleccionada:

  • Primera impresión. El diseño del sitio web deja claro en qué se especializa la empresa y crea una impresión favorable.
  • Memorabilidad. El sitio está asociado con una empresa específica y sigue siendo reconocible.
  • Integridad. La plantilla debe estar escrita hasta el más mínimo detalle, presentando una imagen armoniosa.
  • Funcionalidad. El atractivo se combina con la usabilidad y la practicidad.
Creación independiente de una plantilla para 1C Bitrix.

La estructura de la plantilla 1C Bitrix es una colección de archivos y carpetas. El directorio principal contiene la descripción y información general para la sección administrativa. A veces también se asignan allí algunas funciones adicionales.

El área de trabajo de la plantilla se utiliza para colocar el contenido principal y la necesidad de división se debe a la estructura. Se designa como área_de_trabajo y se escribe en el formulario de edición, actuando como separador de espacios.

Las secciones principales del sitio también se presentan en forma de directorios correspondientes. La base de la plantilla 1C Bitrix son los archivos de encabezado y pie de página. Contienen código, extensiones de llamada, CSS y otras funciones.

El contenido dinámico se incluye en la plantilla con directivas de Bitrix Framework. Aquí puede configurar inserciones PHP que llaman a componentes especiales de Bitrix.

Primero, se configuran el título, los íconos, las hojas de estilo en cascada, las etiquetas y otros parámetros básicos. Después de eso, es necesario determinar la ubicación de la parte administrativa. Es mejor colocar todas las imágenes de trabajo en una carpeta específica.

La lista numerada con un menú se reemplaza llamando al componente Bitrix para crear y editar elementos. La mayoría de los demás elementos estándar también se crean como componentes.

Para colocar la extensión requerida, el código para llamarla se inserta en un lugar preseleccionado de la página. Inicialmente, se encuentra en la documentación del usuario o en la pestaña del editor visual.

Otro aspecto importante son los archivos CSS de la plantilla. Inicialmente son tres: el principal y dos auxiliares para el diseño del contenido. Pero esta distinción es muy arbitraria, porque todos los elementos están estrechamente interconectados.

¿Cómo instalar una plantilla?

La instalación de la plantilla terminada se realiza de acuerdo con el siguiente esquema:

  • En la sección de plantillas del panel de administración, debes seleccionar el botón “agregar”;
  • El formulario de creación es estándar: especifica ID, título y descripción;
  • Al trabajar con html, es importante separar claramente los elementos relacionados con el diseño y el contenido;
  • La directiva work_area se inserta en el campo de edición, donde se copia la plantilla;
  • Si tienes CSS, debes ir a la pestaña de estilos, donde se inserta el código;
  • Puede guardar el resultado y evaluar el trabajo resultante.
  • La parte final es la indicación de todas las variables Bitrix que están escritas en el archivo de encabezado. Es importante recordar editar las rutas en CSS y guardar los resultados intermedios. Después de esto, puede aplicar la plantilla al sitio seleccionándola de la lista correspondiente en la configuración del producto.

    conclusiones

    Las plantillas 1C Bitrix son bastante prácticas y funcionales. Su uso simplificará y acelerará significativamente el desarrollo del proyecto. Puede comprar plantillas listas para usar en el sitio web de la empresa.

    En este artículo veremos todas las características de crear una plantilla para Bitrix desde cero. No importa si tienes un diseño ya hecho o simplemente eres un perfeccionista que simplemente le deja escribir algo él mismo sin intermediarios :)

    ¿Qué archivos se necesitan para crear una plantilla?

    La apariencia de su sitio (o presentación del sitio) siempre se almacena en una carpeta separada. En 1C-Bitrix, la ruta a la plantilla pasa por la carpeta bitrix, que contiene una carpeta de plantillas y ya contiene una lista de todas nuestras plantillas.

    Ruta a las plantillas: /bitrix/templates/

    Puedes crear una plantilla de 3 maneras:

  • se puede copiar plantilla preparada y en base a ello, cambiarlo a tu medida
  • puedes crear una plantilla vacía a través del panel de administración
  • puedes crear una carpeta vacía y llenarla gradualmente con archivos y carpetas
  • Como comprenderás, la tercera opción es la más dura :) Vayamos al panel de administración, Administración > Configuración > Configuración del producto > Sitios web > Plantillas de sitios web > Agregar plantilla.
    enlace sobre el sitio: /bitrix/admin/template_admin.php?lang=ru

    El ID de la plantilla es esencialmente el nombre de la carpeta en la que se ubicará; la llamaré desarrollo. Rellena el resto de campos de la forma más cómoda posible, no son muy importantes ahora mismo. Agregue el siguiente código al código de la plantilla:

    #ÁREA DE TRABAJO#

    — escribimos esta línea para que el archivo no pueda ser llamado directamente desde el navegador y no comience a ejecutarse;
    — mostrar el título actual de la página;
    — mostrar palabras clave, descripción y todos los scripts;
    — muestra el panel para administradores.

    Después de guardar la plantilla, mi archivo descripción.php se ve así:

    Genial, deberíamos tener 5 archivos en la raíz, el resto debería estar este momento no usaremos:

    • descripción.php,
    • encabezado.php,
    • pie de página.php,
    • estilos.css,
    • plantilla_estilos.css

    La parte del código que está antes de #WORK_AREA# finalmente se escribe en header.php. Adivina qué parte está escrita en footer.php :) (la que sigue). El área de trabajo en sí es contenido dinámico (no siempre es tan dinámico), que se encuentra, por ejemplo, en la carpeta /contacts/ o /about/ en el archivo index.php. El archivo en sí suele comenzar con la inclusión del encabezado y terminar con la inclusión del pie de página:

    Envíale un mensaje de texto

    Hasta ahora todo parece lógico.

    Carpetas 1C-Bitrix y estructura de la nueva plantilla.

    Hay varias recomendaciones en la documentación que personalmente no me gustan mucho. Primero, les gusta nombrar la carpeta de imágenes imágenes en lugar de la abreviada img. Y, por supuesto, lo entiendo todo, pero cuando escribes estilos, de todos modos necesitas hacer referencia a las imágenes, ¿por qué escribir 2 veces más? :) En segundo lugar, se recomendó almacenar las áreas incluidas en la carpeta include_areas. ¿Por qué no crear inc? En tercer lugar, ¿por qué necesitamos 2 archivos con estilos? Si quiero poner todo en un archivo separado y conectarlo más tarde según sea necesario, estos estilos se almacenarán en la plantilla del componente o en la carpeta CSS de la plantilla.

    En resumen, nuestra estructura de plantilla correcta es:

    Incluir_áreas imágenes componentes js

    Para ser un poco rebelde:

    Inc img componentes js

    En principio nadie te limita, son sólo recomendaciones.

    Y ahora llegamos sin problemas al primer problema: el código rígido. Hardcode es cuando en lugar de valores dinámicos, por ejemplo Nombre de dominio, usar entrada de texto. La mayoría de los desarrolladores novatos no conocen la constante SITE_ TEMPLATE_PATH, que almacena la ruta a la plantilla actual como un valor; en nuestro caso es /bitrix/templates/development (sin la barra diagonal, tenga en cuenta). Y por lo tanto, cuando incluyas tus scripts o áreas incluidas, para la carpeta debes escribir:



    
    Arriba