php - personalizado - personalizar menu wordpress css

Agrega css personalizado a una plantilla de página en wordpress

Question

Hola, necesito ayuda con la creación de un archivo css personalizado para mi plantilla de página. Hay muchos temas por ahí con respecto a este problema, pero con cada hilo que leo, obtengo más información y más confusión.

Creé un tema secundario para el tema de los veinticuatro y agregué una plantilla de página. ¿Cómo puedo agregar CSS personalizado a esta plantilla. Descubrí que este código agregado a las funciones.php del tema infantil selecciona la clase apropiada con mi css. Pero ¿cómo y dónde pongo esta clase? Leí que tengo que agregar la clase a la etiqueta del cuerpo en el header.php pero no estoy seguro. ¿Es esta la manera correcta?

if (is_page_template( ''mytemplate.php'' )){
$classes[] = ''myclass'';
}

Answer 1

¿Qué tal esta solución?

<?php
function mypage_head() {
echo ''<link rel="stylesheet" type="text/css" href="''.get_bloginfo(''stylesheet_directory'').''/includes/mypage.css">''."/n"
}
add_action(''wp_head'', ''mypage_head'');
?>
<?php get_header(); ?>

Puede usar el gancho wp_head para agregar sus cosas personalizadas (Javascript, CSS ...) a su plantilla personalizada. Creo que esta forma es mejor porque todos los cambios se incluirán en su archivo de plantilla, por lo que no tiene que buscar en otro lugar.

Obtengo esta solución de: http://scratch99.com/wordpress/development/custom-page-template-external-css-file/ .

Answer 2

¿Que tal este?

 function my_custom_styles() {
wp_register_style( ''custom-styles'', get_template_directory_uri().''/lib/styles/custom-styles.css'' ) );
if ( is_home ) {
wp_enqueue_style( ''custom-styles'' );
}
}
add_action( ''wp_enqueue_scripts'', ''my_custom_styles'' );

He probado las tres respuestas desde aquí; y todos ellos funcionan muy bien. ¿Alguien sabe cuál es más rápido y mejor?

Answer 3

Use el condicional is_page_template() para cargar CSS de forma selectiva.

En la siguiente función, nos wp_enqueue_scripts a wp_enqueue_scripts y verificamos si estamos en la plantilla de página personalizada para determinar si se debe cargar CSS adicional.

Si el resultado es verdadero, cargaremos un archivo CSS titulado page-template.css desde una carpeta css/ dentro de su tema. Actualice la ruta para cargar el archivo correcto.

function wpse_enqueue_page_template_styles() {
if ( is_page_template( ''mytemplate.php'' ) ) {
wp_enqueue_style( ''page-template'', get_template_directory_uri() . ''/css/page-template.css'' );
}
}
add_action( ''wp_enqueue_scripts'', ''wpse_enqueue_page_template_styles'' );