Manejo de librerías

No funciona el Background ya rerere…vise el codigo, el código de Style.css esta bien, su apoyo por favor.

<?php

function init_template(){
    add_theme_support('post-thumbnails');
    add_theme_support('title-tag');
}

add_action('after_setup_theme','init_template');

function assets(){
    wp_register_style('bootstrap','https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/css/bootstrap.min.css','','4.5.0','all');
    wp_register_style('montserrat','https://fonts.googleapis.com/css2?family=Montserrat&display=swap','','1.0','all');

    wp_enqueue_style('estilos',get_stylesheet_uri(), array('bootstrap','montserrat'),'1.0','all');    
    
}

add_action('wp_enqueue_scripts','assets');

Buenas noches, tuve el mismo problema al momento de hacer el código para los estilos, no cargaba el color del background, lo solucione así:

function assets(){ 
    
    wp_enqueue_style( 'bootstrap' , 'https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css', '', '4.5.3', 'all' );
    wp_enqueue_style( 'montserrat' , 'https://fonts.googleapis.com/css2?family=Montserrat&display=swap', '', '1.0', 'all' );
    wp_enqueue_style( 'estilo', get_template_directory_uri() . '/style.css' );

}

add_action( 'wp_enqueue_scripts', 'assets' );

No se a que se debe exactamente, un amigo me ayudo, quizás puede ser por cuestión de versiones de PHP.

Antes pensaba que Wordpress es solo temas que no se pueden editar, peor crear y veo que hay muchas posibilidades incluyendo crear aplicaciones backend!!! Muy bueno y espero lo que se viene… Saludos.

Este es mi codigo y me funciona

<?php 

function init_template(){
    add_theme_support('post-thumbnails');
    add_theme_support('title-tag');
}
add_action('after_setup_theme', 'init_template'); 

function assets(){
    wp_register_style('bootstrap', 'https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css', '', '4.4.1', 'all');
    wp_register_style('montserrat', 'https://fonts.googleapis.com/css2?family=Roboto&display=swap', '', '1.0', 'all');
    
    wp_enqueue_style('styles', get_stylesheet_uri(), array('bootstrap', 'montserrat'), '1.0', 'all');
}

add_action('wp_enqueue_scripts', 'assets');

Dejo el codigo de bootstrap por si alguien lo necesita

https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css

Chicos asi funciona con las nuevas version de bootstrap

function assets(){
    wp_register_style('bootstrap','https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css','','5.0.0','all');
    wp_register_style('montserrat','https://fonts.googleapis.com/css2?family=Montserrat&display=swap','','1.0','all');

    wp_enqueue_style('estilos',get_stylesheet_uri(), array('bootstrap','montserrat'),'1.0','all'); 
    
    // wp_register_script('popper','https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js" integrity="sha384-ygbV9kiqUc6oa4msXn9868pTtWMgiQaeYH7/t7LECLbyPA2x65Kgf80OJFdroafW','','5.0.0',true);

    wp_enqueue_script('bootstrap','https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js','','5.0.0',true);

    //para traer mis propios scrips
    wp_enqueue_script('custom',get_template_directory_uri().'/assets/js/custom.js','','1.0',true);
    
}

add_action('wp_enqueue_scripts','assets');

function sidebar(){
    register_sidebar(
        array(
            'name' => 'Pie de pagina',
            'id' => 'footer',
            'description' => 'Zona de Widgets para pie de pagina',
            'before_title' => '<p>',
            'after_title' => '</p>',
            'before_widget' => '<div id="%1$s" class= "%2$s">',
            'after_widget'  => '</div>',
        )    
        );
    
}

add_action('widgets_init', 'sidebar');

Tengo exactamente el mismo codigo del profe, pero al modificar el .css con color background no me sale nada. por favor alguien ayude.

Esto me encanta, la verdad creí que sabía usar wordpress, pero hoy he aprendido que no sabía un carajo
Vamos por más 😃

Aquí esta el link a la fuenta Monserrat:

https://fonts.googleapis.com/css2?family=Montserrat&display=swap

Sos un groso Cristian, me pareció muy copado poder usar bootstrap. Ademas no entendía muy bien lo del uso de hooks y librerías pero cada ves me queda más claro.

Como están amigos?

21 de Julio del 2023
Con las ultimas actualizaciones, así funciona:

<?php 

function init_template(){

    add_theme_support('post-thumbnails');
    add_theme_support('title-tag');

}


add_action('after_setup_theme','init_template');

function assets(){
 
    wp_register_style( 'bootstrap', 'https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css', '', '5.3.0', 'all' );
    wp_register_style( 'montserrat', 'https://fonts.googleapis.com/css2?family=Montserrat&display=swap', '', '1.0','all' );

    wp_enqueue_style( 'estilos', get_stylesheet_uri(  ), array('bootstrap','montserrat'), '1.0', 'all');
 
  
}

add_action('wp_enqueue_scripts','assets');

Espero les sirva!

<<?php

function init_template(){

    add_theme_support('post-thumbnails');
    add_theme_support('title-tag');
}



add_action('after_setup_theme', 'init_template');

function assets(){
    wp_register_style('bootstrap', 'https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css', '', '5.4.1', 'all');
    wp_register_style('monserrat', 'https://fonts.googleapis.com/css2?family=Montserrat&display=swap', '', '1.0','all');

    wp_enqueue_style('estilos', get_stylesheet_uri(), array('bootstrap','monserrat'), '1.0', 'all');
}

add_action( 'wp_enqueue_scripts', 'assets' );

?>>
``` No entiendo donde estoy mal, ya cheque y nada

Si alguien tuvo problemas con el css cuando actualiza el archivo y las páginas, yo lo solucioné así:

wp_enqueue_style('bootstrap', '1.0', 'all');
wp_enqueue_style('montserrat', '1.0', 'all');
wp_enqueue_style('estilos', get_stylesheet_uri(), array(), time() );

la función time() hace que el archivo .css siempre se cargue, así no se almacena el css en caché.

Este curso se merece una actualización

Parece que el sitio de Google Fonts se actualizó y ahora las fuentes se bajan en un zip, pero se puede regresar a la versión anterior del sitio dando en la opción Return to classic site para que se pueda seleccionar el enlace de la fuente.

el primer parámetros de add_action, es un string cuyo nombre es random?, o es un nombre propio de wordpress?

Nunca me habían explicado todo desde el inicio de WP @Cristian Ramanzin super la clase!!! En verdad me está sorprendiendo mucho el curso.

No conocia esto de wordpres.
Pero en la practica, nos vamos a estar dedidando a crear temas? Ya hay infinidad de temas hechos que solo hacen falta de pequeñas modificaciones. Personalmente no lo veo conveniente ponerse a crear un tema. Pero el saber como están creados es lo mejor!

Wowwww, no sabia que se podia utilizar junto con Bootstrap. Genial

He visto que muchos compañeros han tenido problemas en que no les carga la pagina o les genera errores… lo que yo hice fue literal transcribir el mismo codigo que el profe escribia, no importa si las url de montserrat y butstral sean distintas…

Les dejo el codigo tal cual como el profe lo tiene para que les pueda funcionar:

function assets(){
 
    wp_register_style( "bootstrap", "https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css", " ", "4.4.1","all" );
    wp_register_style( "montserrat", "https://fonts.googleapis.com/css?family=Montserrat&display=swap", " ", "1.0", "all");

    wp_enqueue_style( "estilos", get_stylesheet_uri(), array("bootstrap", "montserrat"), "1.0", "all" );
}

add_action("wp_enqueue_scripts", "assets");

Si alguno tuvo problema con el color de fondo en Wordpress 6.0 aquí dejo mi aporte.

function assets(){
    //Nombre identificador, Direccion de alojamiento del archivo, Dependencias, Version, En que parte del documento queremos que se cargue (header, footer)
    wp_register_style('bootstrap', 'https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/css/bootstrap.min.css','', '5.1.3', 'all');
    wp_register_style('montserrat', 'https://fonts.googleapis.com/css2?family=Montserrat&display=swap', '', '1.0', 'all');
    wp_enqueue_style('style', get_stylesheet_uri(), array('bootstrap', 'montserrat'), '1.0', 'all');
}
add_action('wp_enqueue_scripts', 'assets');

Estuve haciendo pruebas y encontré los siguientes errores por el que cual muchos tenemos problemas

1. me fijé que por alguna razón se guarda caché y al ejecutar un plugin de caché se soluciona. Esto se puede comprobar usando var_dump(url_css) y se notará que está la primera versión de style.css solo con el comentario de configuración y no está el nuevo código css
2. El wp_enqueue_style() es muy estricto con la información que se le pasa, hay que revisar que los nombres que van en el array sean los mismos que declaramos anteriormente, si falla una letra , se detendrá la carga del archivo
3. En alguna ocasiones no funciona el código get_stylesheet_uri(), no logré revisar por donde llega este error, en este caso se puede usar como alternativa get_template_directory_uri() . '/style.css' es otra manera de llamar al archivo.

Hola, no podia cambiar el background.
La solución en mi caso fue borrar la cache/historial del navegador, despues de rievisar el código muy bien jaja.
https://www.hostinger.mx/tutoriales/cache-wordpress

REsumen del capitulo en Notion
https://n9.cl/pxqft

Por si alguien No quiere usar bootstrap y le gusta más la idea de usar CSS personalizado les dejo este link: https://www.gestionatuweb.net/como-anadir-un-archivo-css-a-tu-tema-de-wordpress/

Si le ponen el tema un nombre diferente al del profesor en el archivo style.css también deben modificarlo en la linea 2

Hola, no me actualiza el color ¿alguna sugerencia?

Creando nuestros temas en WP!

a pesar de necesitar conocimientos previos para obtener mejores resultados, he comprendido lo que nos has explicado, de verdad gracias por ser tan claro y tan preciso

ayñ por que uri?? jajaja

amigos les recomiendo el uso de plug ins

Subestimaba a WordPress, pense que era como Wix, veo ahora que me equivoco no sabia que se podian personalizar los temas y aniadir funciones extras con PHP.
Espero ver el final del proyecto

banda asi funciona con la ultima version de bootstrap

<?php 
function init_template(){
    add_theme_support('post-thumbnails');
    add_theme_support('title-tag');

}

add_action('after_setup_theme','init_template');

function assets() {
    wp_register_style('bootstrap','https://cdn.jsdelivr.net/npm/bootstrap@5.2.3/dist/css/bootstrap.min.css','','5.2.3','all');
    wp_register_style('montserrat','https://fonts.googleapis.com/css2?family=Montserrat&display=swap','','1.0','all');
    wp_enqueue_style('estilos', get_stylesheet_uri() , array('bootstrap','montserrat'),'1.0','all');
}

add_action('wp_enqueue_scripts','assets');
?>

Para los que no les genera el body de color negro, revisen el array

//Correcto
wp_enqueue_style('estilos',get_stylesheet_uri(), array('bootstrap','montserrat'),'1.0','all');

//Erroneo
wp_enqueue_style('estilos',get_stylesheet_uri(), array('bootstrap','montserrat'1.0','all'));

Recomendación: borrar caché y tener el tema activo para poder visualizar los cambios realizados.

Dejo aquí mi aporte para bootstrap 5.1.3 con fuente open-sans:

<?php

function init_template(){

add_theme_support('post-thumbnails');
add_theme_support('title-tag');

}

add_action(‘after_setup_theme’,‘init_template’);

function assets(){
wp_register_style(‘bootstrap’, ‘https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css’, ‘’, ‘5.1.3’, ‘all’);
wp_register_style(‘OpenSans’, ‘https://fonts.googleapis.com/css2?family=Roboto:wght@400;500;700;900&display=swap’, ‘’, ‘1.0’, ‘all’);

wp_enqueue_style('Estilos', get_stylesheet_uri(), array('bootstrap','OpenSans'), '1.0', 'all');

}

add_action(‘wp_enqueue_scripts’, ‘assets’);

?>

genial miuy bien explicado!

no sabia estos hooks y demas cosas que se pueden hacer en wordpress

Las funciones principales para añadir CSS u hojas de estilo al sistema de dependencias de WordPress son wp_register_style()
y wp_enqueue_style(). La primera registra el archivo de la hoja de estilos, la segunda lo pone en cola para ser añadido.

Se pueden manejar librerias dentro del archivo funcitons.php

Se usa la fución:

wp_register_style( string $handle, string|bool $src, string[] $deps = array(), string|bool|null $ver = false, string $media = ‘all’ )

Siendo:
$handle: El nombre que le damos al stylesheet para referenciarlo en el código. Debe ser unico.
$source: La URL de donde tomaremos la hoja de estilos (stylesheet).
$dependencias: (OPCIONAL) Un array de los ‘handle’ registrado de los que depende esta hoja de estilos
$version: (Opcional) Cadena que especifica el número de versión de la hoja de estilo. Default value: false
$media: Los medios(dispositivos) para los que se ha definido esta hoja de estilo. Default value: ‘all’

Aquí hay un Link a la documentación:
https://developer.wordpress.org/reference/functions/wp_register_style/

Estoy trabajando en Ubuntu con Chrome.
Hasta ahora todo iba bien, pero no veo el efecto del fondo negro.
Alguna sugerencia?
Gracias!

Hola! Al principio no me pintaba en negro la pantalla, así que revisé el código

y encontré este error con los paréntesis

Lo solucioné y ya me funciona. CONSEJO: revisar el código.
Saludos

De momento muy bueno el curso, mejor que el primero, vengo de trabajar con javascript a tope, pero el aprender php se me hace interesante hahahaha

No encuentro el error de mi código, pero no me funciona

<?php

function init_template(){

  add_theme_support('post-thumbnails');
  add_theme_support('title-tag');
}

  add_action('after_setup_theme','init_template');

  function asstes(){
    wp_register_style('Bootstrap','https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css','','4.4.1','all');
    wp_register_style('Quicksandbold700','https://fonts.googleapis.com/css2?family=Quicksand:wght@600;700&display=swap','','1.0','all');
    wp_enqueue_style('estilos', get_stylesheet_uri(), array('Bootstrap','Quicksandbold700'),'1.0','all');

  }

  add_action('wp_enqueue_scripts','assets');```

https://gwst.eu

https://gwst.eu

https://gwst.eu

https://gwst.eu

https://gwst.eu

Para solucionar el problema del style.css, agreguen la siguiente línea de código dentro de la función assets:

wp_enqueue_style( 'platzigifts-style', get_stylesheet_uri(), array(), wp_get_theme()->get( 'Version' ) );

hola, tengo un problemita, no funciona mi pagina en chrome, lo unico que aparece es el fondo negro lo demas no , no entiendo por que … help me 😃

Se debe estudiar esas librerias de wordpress para ver que parámetros se están enviando

Excelente!

Estoy un poco confundido.
Vamos a repetir clase.

Ayuda por favor, con mi código:

<?php

function init_template(){

add_theme_support('post-thumbnails');
add_theme_support( 'title-tag');

}

add_action(‘after_setup_theme’,‘init_template’);

function_assets(){
wp_register_style(‘bootstrap’,‘https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css’, ‘’,‘4.4.1’, ‘all’);
wp_register_style(‘montserrat’, ‘https://fonts.googleapis.com/css?family=Montserrat&display=swap’,’’,'1.0’, ‘all’);

wp_enqueue_style('estilos', get_stylesheet_uri(), array('bootstrap','montserrat'),'1.0', 'all');

}

add_action(‘wp_enqueue_scripts’,‘assets’);

Súper! el curso me enseña más acerca de Wordpress, gracias

//para manejo de librerías css
function assets()
{

	//nombre de css, source, dependencia, versión, en qué dispositivos se cargarán
	wp_register_style('bootstrap','https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/css/bootstrap.min.css','','4.5.0','all');

	wp_register_style('montserrat','https://fonts.googleapis.com/css2?family=Montserrat&display=swap','','1.0','all');

	
	wp_enqueue_style('estilos',get_stylesheet_uri(),array('bootstrap','montserrat'),'1.0','all');
}

add_action('wp_enqueue_scripts','assets');```

Acá esta mi código, tengo el mismo problema del background que no se pinta

<?php

function init_template(){
    add_theme_support('post-thumbnails');
    add_theme_support('title-tag');
}

add_action('after_setup_theme','init_template');

function assets(){

    wp_register_style( 'bootstrap', 'https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/css/bootstrap.min.css', '', '4.5.0', 'all' );
    wp_register_style( 'montserrat','https://fonts.googleapis.com/css2?family=Montserrat:wght@100&display=swap', '', '1.0', 'all' );
    
    wp_enqueue_style('estilos',get_stylesheet_uri(), array('bootstrap','montserrat'),'1.0','all');
}

add_action( 'wp_enqueue_scripts,', 'assets');

style.css

/*
Theme name: PlatziGifts
Version:1.0
Description: sitio para catálogo de platzi
Author: Ricardo Luis Diez Noria
Authon URI: https://github.com/rldiezn
License: GNU General Public Licence v2 or later
License: http://www.gnu.org/licenses/gpl-2.0.html

*/

body{
    background-color: black;
}

Espero alguien pueda ayudarme o que aparezca el profesor del curso al menos jejeje…

No me funcionaba el Background_color. Cambié la línea de codigo
wp_enqueue_style(‘estilos’,get_stylesheet_uri(), array(‘bootstrap’,‘montserrat’),‘1.0’,‘all’);
por
wp_enqueue_style( ‘estilo’, get_template_directory_uri() . ‘/style.css’ );
Quiero saber si tiene alguna afectación más adelante?

<?php 

function init_template(){
    add_theme_support('post-thumbnails');
    add_theme_support('title-tag');
}
add_action('after_setup_theme', 'init_template'); 

function assets(){
      
    wp_enqueue_style( 'bootstrap' , 'https://cdn.jsdelivr.net/npm/bootstrap@4.5.3/dist/css/bootstrap.min.css', '', '4.5.3', 'all' );
    wp_enqueue_style( 'montserrat' , 'https://fonts.googleapis.com/css2?family=Montserrat&display=swap', '', '1.0', 'all' );
    wp_enqueue_style( 'estilo', get_template_directory_uri() . '/style.css' );
    
    }
    
add_action( 'wp_enqueue_scripts', 'assets' );

En archivo functions.php seguir escribiendo:

function assets(){
    wp_register_style('bootstrap', 'https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css', '', '4.4.1', 'all'); /* 5 argumentos: la referencia, el enlace, dependencias, version, dispositivos  */
    wp_register_style('montserrat', 'https://fonts.googleapis.com/css2?family=Roboto&display=swap', '', '1.0', 'all'); /* nombre, enlace, dependencia, version, dispositivos */
    
    wp_enqueue_style('styles', get_stylesheet_uri(), array('bootstrap', 'montserrat'), '1.0', 'all');
}

add_action('wp_enqueue_scripts', 'assets');

Codigo entero functions.php:

<?php 

function init_template(){
    add_theme_support('post-thumbnails');
    add_theme_support('title-tag');
}
add_action('after_setup_theme', 'init_template'); 

function assets(){
    wp_register_style('bootstrap', 'https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css', '', '4.4.1', 'all');
    wp_register_style('montserrat', 'https://fonts.googleapis.com/css2?family=Roboto&display=swap', '', '1.0', 'all');
    
    wp_enqueue_style('styles', get_stylesheet_uri(), array('bootstrap', 'montserrat'), '1.0', 'all');
}

add_action('wp_enqueue_scripts', 'assets');

Si me sale el color Negro, pero el menu arriba no me sale. 😦

Lo que me he complicado haciendo el cambio de color en el background jajaja pero al aplicarlo se demora un poco en cambiar

Es normal esto?

Hola!!
Hice todo el código en function y no encuentro el error pero al mirar en la pantalla aparece error. Que debo hacer? Qué hice mal?

Gracias por la classe. Todo clarísimo.

https://gwst.eu

https://gwst.eu

https://gwst.eu

https://gwst.eu

https://gwst.eu

https://gwst.eu

https://gwst.eu

https://gwst.eu

https://gwst.eu

https://gwst.eu

https://gwst.eu

Manejo de librerías

// Manejo de dependencias para CSS en WP
function assets() {
    wp_register_style( 'bootstrap', 'https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css', '', '4.4.1', 'all' );
    wp_register_style( 'rubik', 'https://fonts.googleapis.com/css2?family=Rubik:ital,wght@0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap', '', '1.0', 'all' );
    wp_register_style( 'Frank Ruhl Libre', 'https://fonts.googleapis.com/css2?family=Frank+Ruhl+Libre:wght@300;400;500;700;900&display=swap', '', '1.0', 'all' );

    wp_enqueue_style( 'styles', get_stylesheet_uri(  ) , array( 'bootstrap', 'rubik', 'Frank Ruhl Libre' ), '1.0', 'all' );
}

// Para que se cargue cuando al inicio de la página
add_action( 'wp_enqueue_scripts', 'assets' );

No me queda el Background color y tengo bien la parte del style. Pero creo que algo no lo está dejando funcionar.

Mi código es este por si alguien tiene alguna recomendación.

function assets(){
    wp_register_style( 'bootstrap','https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css','','4.4.1','all');
    wp_register_style( 'raleway', 'https://fonts.googleapis.com/css2?family=Raleway:wght@100;300&display=swap','','1.0','all');
    wp_enqueue_style('estilos', get_stylesheet_uri(), array('bootstrap', 'raleway', '1.0','all'));
}
add_action('wp_enqueue_scripts', 'assets');```