Servipro

Post

Cómo integrar Bootstrap 4.6 en un tema de WordPress

Base de ConocimientoRecursosWordPress
#bootstrap#sinplugins#wordpress

Permite adjuntar / cargar a un determinado producto, cualquier tipo de archivo para los pedidos de un cliente.

El primer paso es descargar las librerías con los códigos fuentes de estilos y archivos JavaScript, directamente desde la página:

Descargar Bootstrap 4.6

Una vez descargada, se descomprime el archivo y las carpetas «css» y «js» se copian a la carpeta raíz del tema hijo ubicado en la siguiente ruta del servidor: /wp-content/themes/tema-hijo/.

Luego, ingresar el escritorio de WordPress con credenciales administrativas y desde la opción ‘Apariencia/Editor del Tema’ abrir el archivo functions.php y pegar el siguiente código.

 

// Bootstrap v4.6.0 (https://getbootstrap.com/)
// Agregar esta función luego de subir las carpetas CSS y JS
// de bootstrap dentro de la carpeta raíz del tema hijo

// Incluir Bootstrap css
function bootstrap_css() {
    wp_enqueue_style( 'bootstrap_css',
        get_stylesheet_directory_uri() . '/css/bootstrap.min.css',
        array(),
        '4.6.0'
    );
}
add_action( 'wp_enqueue_scripts', 'bootstrap_css');

// Incluir Bootstrap js
function bootstrap_js() {
   wp_enqueue_script( 'bootstrap_js',
      get_stylesheet_directory_uri() . '/js/bootstrap.min.js',
      array('jquery'),
      '4.6.0',
      true);
}
add_action( 'wp_enqueue_scripts', 'bootstrap_js');

 

Asegúrese de guardar los cambios y listo. Puede realizar una sencilla prueba creando una página nueva, agregar un elemento text-editor ó raw-html y pegar código que se muestra en el siguiente link para verificar si está funcionando.

Código Ejemplo

 

NOTA: Estas instrucciones aplican para la versión 4.6 de Bootstrap.