git.admin/roi-theme
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Migración completa a Clean Architecture con componentes funcionales

Browse Source 
- Reorganización de estructura: Admin/, Public/, Shared/, Schemas/
- 12 componentes migrados: TopNotificationBar, Navbar, CtaLetsTalk, Hero,
  FeaturedImage, TableOfContents, CtaBoxSidebar, SocialShare, CtaPost,
  RelatedPost, ContactForm, Footer
- Panel de administración con tabs Bootstrap 5 funcionales
- Schemas JSON para configuración de componentes
- Renderers dinámicos con CSSGeneratorService (cero CSS hardcodeado)
- FormBuilders para UI admin con Design System consistente
- Fix: Bootstrap JS cargado en header para tabs funcionales
- Fix: buildTextInput maneja valores mixed (bool/string)
- Eliminación de estructura legacy (src/, admin/, assets/css/componente-*)

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
FrankZamora
2025-11-25 21:20:06 -06:00
parent 90de6df77c
commit 0846a3bf03
224 changed files with 21670 additions and 17816 deletions
Download Patch File Download Diff File Expand all files Collapse all files

266
single.php
View File

@@ -14,34 +14,12 @@ get_header();
<?php while (have_posts()) : the_post(); ?>
<!-- Hero Section (Template líneas 141-167) -->
<div class="container-fluid py-5 mb-4 hero-title">
<div class="container">
<!-- Category Badges -->
<div class="mb-3 d-flex justify-content-center">
<div class="d-flex gap-2 flex-wrap justify-content-center">
<?php
$categories = get_the_category();
if (!empty($categories)) {
foreach ($categories as $category) {
if ($category->name !== 'Uncategorized' && $category->name !== 'Sin categoría') {
?>
<a href="<?php echo esc_url(get_category_link($category->term_id)); ?>" class="category-badge category-badge-hero">
<i class="bi bi-folder-fill me-1"></i>
<?php echo esc_html($category->name); ?>
</a>
<?php
}
}
}
?>
</div>
</div>
<!-- Post Title -->
<h1 class="display-5 fw-bold text-center"><?php the_title(); ?></h1>
</div>
</div>
<!-- Hero Section - Componente dinámico -->
<?php
if (function_exists('roi_render_component')) {
echo roi_render_component('hero');
}
?>
<!-- Main Content Grid (Template líneas 169-1020) -->
<div class="container">
@@ -50,12 +28,12 @@ get_header();
<!-- Main Content Column (col-lg-9) -->
<div class="col-lg-9">
<!-- Featured Image -->
<?php if (has_post_thumbnail()) : ?>
<div class="featured-image-container my-4">
<?php the_post_thumbnail('full', array('class' => 'img-fluid', 'loading' => 'lazy')); ?>
</div>
<?php endif; ?>
<!-- Featured Image - Componente dinámico -->
<?php
if (function_exists('roi_render_component')) {
echo roi_render_component('featured-image');
}
?>
<!-- Post Content -->
<article class="post-content">
@@ -69,132 +47,45 @@ get_header();
?>
</article>
<!-- Share Buttons (Template líneas 786-810) -->
<div class="my-5 py-4 border-top">
<p class="mb-3 text-muted"><?php esc_html_e('Compartir:', 'roi-theme'); ?></p>
<div class="d-flex gap-2 flex-wrap share-buttons">
<a href="https://www.facebook.com/sharer/sharer.php?u=<?php echo urlencode(get_permalink()); ?>"
class="btn btn-outline-primary btn-sm"
target="_blank"
rel="noopener noreferrer"
aria-label="Compartir en Facebook">
<i class="bi bi-facebook"></i>
</a>
<a href="#"
class="btn btn-outline-danger btn-sm"
onclick="alert('Instagram no permite compartir enlaces directamente. Puedes tomar una captura de pantalla o copiar el enlace para compartirlo manualmente.'); return false;"
aria-label="Compartir en Instagram">
<i class="bi bi-instagram"></i>
</a>
<a href="https://www.linkedin.com/sharing/share-offsite/?url=<?php echo urlencode(get_permalink()); ?>"
class="btn btn-outline-info btn-sm"
target="_blank"
rel="noopener noreferrer"
aria-label="Compartir en LinkedIn">
<i class="bi bi-linkedin"></i>
</a>
<a href="https://api.whatsapp.com/send?text=<?php echo urlencode(get_the_title() . ' - ' . get_permalink()); ?>"
class="btn btn-outline-success btn-sm"
target="_blank"
rel="noopener noreferrer"
aria-label="Compartir en WhatsApp">
<i class="bi bi-whatsapp"></i>
</a>
<a href="https://twitter.com/intent/tweet?url=<?php echo urlencode(get_permalink()); ?>&text=<?php echo urlencode(get_the_title()); ?>"
class="btn btn-outline-dark btn-sm"
target="_blank"
rel="noopener noreferrer"
aria-label="Compartir en X">
<i class="bi bi-twitter-x"></i>
</a>
<a href="mailto:?subject=<?php echo urlencode(get_the_title()); ?>&body=<?php echo urlencode(get_permalink()); ?>"
class="btn btn-outline-secondary btn-sm"
aria-label="Compartir por Email">
<i class="bi bi-envelope"></i>
</a>
</div>
</div>
<!-- Share Buttons - Componente dinámico -->
<?php
if (function_exists('roi_render_component')) {
echo roi_render_component('social-share');
}
?>
<!-- CTA A/B Testing -->
<?php roi_display_cta(); ?>
<!-- CTA Post - Componente dinámico -->
<?php
if (function_exists('roi_render_component')) {
echo roi_render_component('cta-post');
}
?>
<!-- Related Posts (Template líneas 843-981) -->
<div class="my-5 related-posts">
<h2 class="h3 mb-4"><?php esc_html_e('Descubre Más Contenido', 'roi-theme'); ?></h2>
<div class="row g-4">
<?php
// Query para related posts
$related_args = array(
'post_type' => 'post',
'posts_per_page' => 12,
'post__not_in' => array(get_the_ID()),
'orderby' => 'rand',
'no_found_rows' => true,
);
$related_query = new WP_Query($related_args);
if ($related_query->have_posts()) :
while ($related_query->have_posts()) : $related_query->the_post();
?>
<div class="col-md-4">
<a href="<?php the_permalink(); ?>" class="text-decoration-none">
<div class="card h-100 shadow-sm">
<div class="card-body d-flex align-items-center justify-content-center p-4">
<h5 class="card-title h6 mb-0 text-center"><?php the_title(); ?></h5>
</div>
</div>
</a>
</div>
<?php
endwhile;
wp_reset_postdata();
endif;
?>
</div>
<!-- Pagination (Template líneas 957-980) -->
<nav aria-label="<?php esc_attr_e('Navegación de posts relacionados', 'roi-theme'); ?>" class="mt-4">
<ul class="pagination justify-content-center">
<li class="page-item">
<a class="page-link" href="#" aria-label="<?php esc_attr_e('Inicio', 'roi-theme'); ?>">
<?php esc_html_e('Inicio', 'roi-theme'); ?>
</a>
</li>
<li class="page-item active" aria-current="page">
<a class="page-link" href="#">1</a>
</li>
<li class="page-item"><a class="page-link" href="#">2</a></li>
<li class="page-item"><a class="page-link" href="#">3</a></li>
<li class="page-item"><a class="page-link" href="#">4</a></li>
<li class="page-item"><a class="page-link" href="#">5</a></li>
<li class="page-item">
<a class="page-link" href="#"><?php esc_html_e('Ver más', 'roi-theme'); ?></a>
</li>
<li class="page-item">
<a class="page-link" href="#" aria-label="<?php esc_attr_e('Fin', 'roi-theme'); ?>">
<?php esc_html_e('Fin', 'roi-theme'); ?>
</a>
</li>
</ul>
</nav>
</div><!-- .related-posts -->
<!-- Related Posts - Componente dinámico -->
<?php
if (function_exists('roi_render_component')) {
echo roi_render_component('related-post');
}
?>
</div><!-- .col-lg-9 -->
<!-- Sidebar Column (col-lg-3) -->
<div class="col-lg-3">
<div class="sidebar-sticky">
<?php get_template_part('template-parts/content', 'toc'); ?>
<!-- Table of Contents - Componente dinámico -->
<?php
if (function_exists('roi_render_component')) {
echo roi_render_component('table-of-contents');
}
?>
<!-- CTA Box Sidebar -->
<div class="cta-box-sidebar">
<h5 class="cta-box-title">¿Listo para potenciar tus proyectos?</h5>
<p class="cta-box-text">Accede a nuestra biblioteca completa de APUs y herramientas profesionales.</p>
<button class="btn btn-cta-box w-100" data-bs-toggle="modal" data-bs-target="#contactModal">
Solicitar Información
</button>
</div>
<!-- CTA Box Sidebar - Componente dinámico -->
<?php
if (function_exists('roi_render_component')) {
echo roi_render_component('cta-box-sidebar');
}
?>
</div>
</div>
@@ -203,73 +94,12 @@ get_header();
<?php endwhile; ?>
<!-- Contact Form Section (Template líneas 1026-1090) -->
<section class="py-5 mt-5 bg-secondary bg-opacity-25">
<div class="container">
<div class="row justify-content-center">
<div class="col-lg-10">
<div class="row">
<!-- Columna izquierda: Info de contacto -->
<div class="col-lg-5 mb-4 mb-lg-0">
<h2 class="h3 mb-3"><?php esc_html_e('¿Tienes alguna pregunta?', 'roi-theme'); ?></h2>
<p class="mb-4"><?php esc_html_e('Completa el formulario y nuestro equipo te responderá en menos de 24 horas.', 'roi-theme'); ?></p>
<div class="contact-info">
<div class="d-flex align-items-start mb-3">
<i class="bi bi-telephone-fill me-3 fs-5" style="color: #FF8600;"></i>
<div>
<h6 class="mb-1"><?php esc_html_e('Teléfono', 'roi-theme'); ?></h6>
<p class="mb-0 text-muted">+52 55 1234 5678</p>
</div>
</div>
<div class="d-flex align-items-start mb-3">
<i class="bi bi-envelope-fill me-3 fs-5" style="color: #FF8600;"></i>
<div>
<h6 class="mb-1"><?php esc_html_e('Email', 'roi-theme'); ?></h6>
<p class="mb-0 text-muted">contacto@apumexico.com</p>
</div>
</div>
<div class="d-flex align-items-start">
<i class="bi bi-geo-alt-fill me-3 fs-5" style="color: #FF8600;"></i>
<div>
<h6 class="mb-1"><?php esc_html_e('Ubicación', 'roi-theme'); ?></h6>
<p class="mb-0 text-muted">Ciudad de México, México</p>
</div>
</div>
</div>
</div>
<!-- Columna derecha: Formulario -->
<div class="col-lg-7">
<form id="footerContactForm">
<div class="row g-3">
<div class="col-md-6">
<input type="text" class="form-control" id="footerFullName" name="fullName" placeholder="<?php esc_attr_e('Nombre completo *', 'roi-theme'); ?>" required>
</div>
<div class="col-md-6">
<input type="text" class="form-control" id="footerCompany" name="company" placeholder="<?php esc_attr_e('Empresa', 'roi-theme'); ?>">
</div>
<div class="col-md-6">
<input type="tel" class="form-control" id="footerWhatsapp" name="whatsapp" placeholder="<?php esc_attr_e('WhatsApp *', 'roi-theme'); ?>" required>
</div>
<div class="col-md-6">
<input type="email" class="form-control" id="footerEmail" name="email" placeholder="<?php esc_attr_e('Correo electrónico *', 'roi-theme'); ?>" required>
</div>
<div class="col-12">
<textarea class="form-control" id="footerComments" name="comments" rows="4" placeholder="<?php esc_attr_e('¿En qué podemos ayudarte?', 'roi-theme'); ?>"></textarea>
</div>
<div class="col-12">
<button type="submit" class="btn btn-contact-submit w-100">
<i class="bi bi-send-fill me-2"></i><?php esc_html_e('Enviar Mensaje', 'roi-theme'); ?>
</button>
</div>
<div id="footerFormMessage" class="col-12 mt-2 alert" style="display: none;"></div>
</div>
</form>
</div>
</div>
</div>
</div>
</div>
</section>
<!-- Contact Form Section - Componente dinámico -->
<?php
if (function_exists('roi_render_component')) {
echo roi_render_component('contact-form');
}
?>
<?php
get_footer();