¿Cómo cambiar las imágenes de un producto Hesense?
Para cambiar las imágenes de productos en...
El componente “Banner Texto” es una sección de diseño simple pero efectiva que se utiliza para resaltar un mensaje importante o destacado en una interfaz digital. Está estructurado de la siguiente manera:
1. Título: El título es un texto principal que sirve para captar la atención del usuario y comunicar el mensaje clave de manera concisa y llamativa. Debe ser breve pero impactante, utilizando un tamaño de fuente más grande o un estilo de texto distintivo para destacarse en el banner.
2. Párrafo:El párrafo proporciona información adicional o detalles complementarios al mensaje expresado en el título. Puede ser un texto descriptivo que amplíe el contexto o los detalles sobre el mensaje principal. Es importante mantener el párrafo breve y relevante para mantener la atención del usuario.
Este tipo de banner es ideal para situaciones en las que se necesita comunicar un mensaje directo y claro sin distracciones visuales. Al centrarse en el texto, este componente es especialmente útil para anuncios importantes, mensajes de bienvenida, alertas o cualquier otro contenido que requiera una presentación clara y concisa en la interfaz digital.
Campos Personalizados
Banner Text
banner-text
Layout/Group
Title
banner-text__title
Basic/Text Area
Paragraph
banner-text__paragraph
Content/Wysiwyg Editor
Archivos Usados
1.
banner-text.php
PHP
components/banner-text.php
Component
1.
banner-text.php
PHP
components/banner-text.php
Component
<?php
$class_name = 'banner-text';
$banner_text = get_field($class_name);
if ($banner_text): ?>
<section class=" <?php echo $class_name ?> p-4 my-5 transition-scroll">
<?php while (have_rows($class_name)):
the_row();
$title = get_sub_field($class_name . '__title');
$paragraph = get_sub_field($class_name . '__paragraph');
?>
<div class="container">
<div class="ps-lg-5">
<div class="<?php echo $class_name ?>__content px-3">
<h3 class="<?php echo $class_name ?>__title co-blue mb-3">
<?php if ($title):
echo $title;
endif ?>
</h3>
<div class="<?php echo $class_name ?>__paragraph co-black pb-5">
<p>
<?php if ($paragraph):
echo $paragraph;
endif ?>
</p>
</div>
</div>
</div>
</div>
</div>
</section>
<?php endwhile; ?>
<?php endif ?>
2.
_banner-text.scss
SCSS
frontend/scss/theme/components/_banner-text.scss
Styles
2.
_banner-text.scss
SCSS
frontend/scss/theme/components/_banner-text.scss
Styles
.banner-text{
&__title {
text-align: center;
}
ul {
list-style-type: disc;
padding: 0 0 0 30px;
}
}
Anexos
Artículos relacionados
Crear despligue automatico con Github
Ingresar a la cuenta de Github en la que fue...