Elementos y Etiquetas Dinamicas
Elementos personalizados de Bricks y etiquetas dinamicas para construir paginas con contenido flexible.
Elementos personalizados de Bricks
FlowKit incluye una coleccion de elementos personalizados que extienden las capacidades nativas de Bricks Builder. Cada elemento se comporta como un bloque mas dentro del editor visual, con sus propios controles de estilo y configuracion.
Activacion
Los elementos se activan de forma individual desde el panel Elementos en el area de administracion de FlowKit. Esto permite habilitar unicamente los que necesitas, evitando carga innecesaria de codigo.
Categorias
Los elementos disponibles se organizan en categorias segun su funcion:
- General — Elementos de proposito general: contenedores avanzados, separadores dinamicos, contadores, etc.
- WooCommerce — Elementos especificos para tiendas: precio del producto, boton de anadir al carrito, resenas, valoraciones, etc.
- Formularios — Campos y componentes para formularios personalizados dentro de Bricks Builder.
- Navegacion — Menus, migas de pan y elementos de navegacion adaptados al editor visual.
Etiquetas dinamicas
Las etiquetas dinamicas son marcadores de posicion que se reemplazan automaticamente por contenido real en el momento de renderizar la pagina. Se utilizan dentro de los campos de texto de Bricks Builder para mostrar informacion que cambia segun el contexto: producto actual, usuario conectado, estado del carrito, etc.
Sintaxis
Todas las etiquetas siguen el formato {nombre_etiqueta}. Se escriben directamente en cualquier campo de texto del editor de Bricks Builder y se resuelven en el frontend.
Ejemplos
| Etiqueta | Descripcion |
|---|---|
| {ft_product_price} | Precio del producto actual |
| {ft_account_total_orders} | Numero total de pedidos del cliente |
| {ft_account_endpoint_title} | Titulo del apartado actual de Mi Cuenta |
| {ft_cart_item_count} | Numero de productos en el carrito |
Activacion
Las etiquetas dinamicas se gestionan desde la pestana Etiquetas dinamicas dentro del panel de Elementos. Puedes activarlas de forma individual o habilitar todas a la vez con un solo clic.
Crear elementos personalizados
Puedes crear tus propios elementos de Bricks Builder dentro de FlowKit. Cada elemento es una clase PHP que extiende la clase base \Bricks\Element y se ubica en el directorio library/elements/.
Ubicacion
Todos los elementos personalizados residen en:
library/elements/tu-elemento.php
Estructura basica
Un elemento personalizado requiere como minimo las propiedades $name y $category, ademas del metodo render() donde se genera el HTML de salida.
class Tu_Elemento extends \Bricks\Element {
public $name = 'tu-elemento';
public $category = 'general';
public function get_label() {
return 'Tu Elemento';
}
public function render() {
echo '<div class="tu-elemento">';
// Tu codigo aqui
echo '</div>';
}
}
Deteccion automatica
Una vez creado el archivo en library/elements/, FlowKit lo detecta automaticamente y lo muestra en la lista de elementos disponibles dentro del panel de administracion. Desde ahi puedes activarlo o desactivarlo como cualquier otro elemento.
\Bricks\Element correctamente. Un error en la definicion impedira que Bricks Builder cargue el editor visual.
Migracion de etiquetas
A partir de la version 1.0.6, las etiquetas dinamicas siguen una convencion de nombres estandarizada. Los nombres antiguos usaban prefijos inconsistentes; los nuevos nombres son mas cortos, predecibles y estan agrupados por contexto.
Tabla de migracion
| Nombre anterior | Nombre nuevo |
|---|---|
| {ft_get_cart_item_count} | {ft_cart_item_count} |
| {ft_customer_total_orders} | {ft_account_total_orders} |
| {ft_woo_total_product_reviews} | {ft_review_total} |
| {ft_my_account_endpoint_title} | {ft_account_endpoint_title} |
Compatibilidad
Las etiquetas con nombres anteriores siguen funcionando con normalidad en el frontend. Sin embargo, no aparecen en el selector de datos dinamicos de Bricks Builder. Solo las etiquetas con los nombres nuevos se muestran en el panel.