Skip to content
Documentación

Manual Técnico appServiserAdmin

Documentación Técnica del Archivo navbar.php en la Carpeta appServiserAdmin/views/layouts

Español

Propósito del Archivo

El archivo navbar.php es un componente de vista en una aplicación web construida con el framework Yii2. Su propósito principal es proporcionar la barra de navegación (navbar) de la aplicación, que permite a los usuarios acceder a diferentes secciones y funcionalidades de la aplicación de manera fácil y rápida. Este archivo se incluye en las páginas para mantener una consistencia en el diseño y la navegación.

Definición de la Carpeta

  • Carpeta layouts: Esta carpeta contiene los archivos de diseño (layouts) de la aplicación. Los layouts son plantillas que definen la estructura general de las páginas de la aplicación y permiten reutilizar el mismo diseño en múltiples vistas.

Funciones del Archivo

  1. Estructura de Navegación: El archivo define la estructura HTML y los elementos que se mostrarán en la barra de navegación. Esto puede incluir enlaces a diferentes secciones de la aplicación, como el panel de control, la gestión de usuarios, y otras funcionalidades.
  2. Interactividad: Puede incluir scripts JavaScript para manejar la interactividad de la barra de navegación, como la apertura y cierre de menús desplegables.
  3. Estilos y Scripts: Se pueden incluir archivos CSS y JavaScript específicos para la barra de navegación, mejorando la interfaz de usuario y la experiencia de usuario.

English

Technical Documentation of the File navbar.php

Purpose of the File

The navbar.php file is a view component in a web application built with the Yii2 framework. Its main purpose is to provide the navigation bar (navbar) of the application, allowing users to easily and quickly access different sections and functionalities of the application. This file is included in pages to maintain consistency in design and navigation.

Definition of the Folder

  • Folder layouts: This folder contains the layout files of the application. Layouts are templates that define the overall structure of the application’s pages and allow for the reuse of the same design across multiple views.

Functions of the File

  1. Navigation Structure: The file defines the HTML structure and elements that will be displayed in the navigation bar. This can include links to different sections of the application, such as the dashboard, user management, and other functionalities.
  2. Interactivity: It may include JavaScript scripts to handle the interactivity of the navigation bar, such as opening and closing dropdown menus.
  3. Styles and Scripts: Specific CSS and JavaScript files can be included for the navigation bar, enhancing the user interface and user experience.

Structure of the File

The file could be structured as follows:

<nav class="navbar navbar-expand-lg navbar-light bg-light">
    <div class="container">
        <a class="navbar-brand" href="<?= Yii::$app->homeUrl ?>"><?= Html::encode(Yii::$app->name) ?></a>
        <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarNav" aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
            <span class="navbar-toggler-icon"></span>
        </button>
        <div class="collapse navbar-collapse" id="navbarNav">
            <ul class="navbar-nav">
                <li class="nav-item">
                    <?= Html::a(Yii::t('app', 'Home'), ['site/index'], ['class' => 'nav-link']) ?>
                </li>
                <li class="nav-item">
                    <?= Html::a(Yii::t('app', 'About'), ['site/about'], ['class' => 'nav-link']) ?>
                </li>
                <li class="nav-item">
                    <?= Html::a(Yii::t('app', 'Contact'), ['site/contact'], ['class' => 'nav-link']) ?>
                </li>
                <!-- Agregar más enlaces según sea necesario -->
            </ul>
        </div>
    </div>
</nav>


<?php
// Registro de archivos JS y CSS (si es necesario)
$this->registerCssFile('path/to/custom.css');
?>


<?php
// Script adicional (si es necesario)
$this->registerJs("
$(document).ready(function() {
    // Aquí se pueden agregar scripts adicionales para la barra de navegación
});
");
?>