Modificar un tema de forma correcta: El archivo functions.php

Clase 21 de 52 • Curso de Creación de Temas y Plugins en WordPress

Resumen

Para que seamos capaces de incluir nuevas acciones dentro de nuestro sitio, es necesario que usemos el archivo de functions.php. Con este vamos a crear nuevas funcionalidades que aparecerán en nuestro sitio. En este video te enseño a crear un alert usando JS que se puede disparar en el momento en que nosotros decidamos.
Para esto vamos a usar wp_enqueue_script.

Vicente

student•

El profesor va demasiado rápido cambiando de un archivo a otro, de un listado a otro, de una vista a otra… Tengo bastante dificultad para seguirlo y no soy novato en WordPress. Creo que si remarcara un poco cuando cambia de escenario ayudaría bastante a la comprensión que en realidad es de lo que se trata.

Blanca Segura Garcia

student•

Bueno, pero ahí está la ventaja de la clase “en video”. Podemos retroceder, avanzar, detener … Esto me ayuda bastante a ponerle la velocidad al profe. 😉

Jahn Bautista Guzman Escobar

student•

vsoriano: le añado algo mas a tu comentario. Definitivamente este curso de Wordpress no está diseñado para personas como tu y yo que somos novatos, y vengo a darme cuenta de ello en este video. Es inútil seguir, si no tenemos claros conceptos básicos de html, programación, javascript, incluso me dijeron que deberia aprender Linux. Por mi parte entonces aqui renuncio porque voy a perder mi tiempo. Yo crei que Wordpress era más intuitivo, pero aquí dejo entonces.

Juan Diego Silva Garcia

student•

¿Qué son exactamente los hooks de WordPress?
Hook es un termino genérico en WordPress, que se usa como referencia en lugares estratégicos dentro del core para poder inyectar código propio y agregar comportamientos o cambiar el funcionamiento por defecto de WordPress.

Un hook puede ser declarado en dos lugares, dependiendo del tipo de desarrollo que estés haciendo, function.php si estás trabajando con un tema o tema hijo, o directamente en un plugin.

En WordPress existen dos tipos de hooks: Acciones (Actions) y Filtros (Filters).

Action Hooks
Una acción te permite ejecutar tus propias funciones en un lugar específico dentro de la línea de tiempo de ejecución de WordPress, Plugin o Tema para que puedas agregar nuevas funcionalidades o personalizaciones.

O, dicho de modo muy simple, “Cuando llegues a este punto haz esto”.

Filter Hooks
Los filtros son funciones a las cuales WordPress pasa información en un cierto punto de ejecución, de este modo un filtro te permite manipular textos y contenidos antes de que sean utilizados. Por ejemplo, modificar el título de un artículo antes de ser mostrado en pantalla.

Al igual que las acciones, los filtros te permiten ejecutar tus propias funciones, con la gran diferencia de que el propósito de un filtro es únicamente modificar información.

O, dicho de modo simple, “Dame esta información y cámbiala por esta otra.”

Referencia: https://platzi.com/blog/hooks-wordpress/

Oscar Stevens Cuartas Bejarano

student•

vacano

Juan Javier Cazares Carrion

student•

Gracias, me meti en los comentarios justo con esa duda de los Hooks 😃

María Fernanda Arbelaez

student•

Este es el código que se usa para cargar el alert desde functions.php

function alert_js(){
	wp_enqueue_script( 'alert_js', get_template_directory_uri().'/js/alert.js', array('jquery'), false, false );
};
add_action( 'wp_enqueue_scripts', 'alert_js' );

Jhon Fredy Beltrán León

student•

aun asi no me carga el archivo 😒

María Fernanda Arbelaez

student•

si compartes el código te puedo ayudar a ver donde esta el error

Yossijaki Jorge Astilleros Chávez

student•

Clases muy básicas. Estos cursos no sirven para un desarrollador que se dedica profesionalmente a esto, en un ambiente de producción real, este curso no serviría ya que no se utilizan los temas predeterminados de WP, siempre se busca un tema que se adapte a las necesidades del cliente y se modifica sobre esos requerimientos. Debido a ello (y si el curso profundizase un poco más) se darían cuenta de que es casi obligatorio realizar el encolamiento (enqueue) de estilos para que el tema que se tomó para el desarrollo del sitio web del cliente no pierda su apariencia, los temas que vienen por defecto en WP no sirven para enseñar a realizar temas Child ya que éstos no necesitan la creación de ninguna función en el functions.php para que se visualicen correctamente. Ojalá pudieran ser un poco más cuidadosos en esto, ya que yo pague mi membresía para poder mejorar mis habilidades profesionales, no para venir a ver clases a medias que puedo encontrar leyendo un poco la documentación oficial.

Félix Andersson

student•

Pues quizá le sirva a alguien como yo que tengo 0 experiencia con WordPress me viene bien un empujoncito para comenzar a agarrarle el rollo, aunque sí tengo el objetivo de manejar WordPress a un nivel profesional, supongo debo aprender por mi cuenta si Platzi no me ayudará con eso... Sinceramente yo entro a la carrera de WordPress con la expectativa de que me enseñen algo aplicable a la práctica profesional al menos, la expectativa de salir sabiendo más o menos como crear un producto/sitio-web con esta herramienta

Jenny Aguilar

student•

Te recomiendo que le des una mirada al Curso Práctico de Wordpress, lo habilitaron la semana que terminó. Toca los temas de los register y enqueue. Además es la antesala al Curso Profesional de Wordpress que se habilita el 14 de febrero. Puede que esos cursos se orienten más a tus expectativas. Espero te anime.

Alejandro Villegas

student•

Bueno quiero comentar que para mi si me ha servido hasta este punto el curso, si quizas el profe va un poco rapido pero es verdad para eso es el video lo podemos repetir y adelantar o atrazar cuando queramos, que se necesitan conocimientos previos pues si, wordpress es muy facil solo deben tener conocimientos basicos previos como CSS, HTML, PHP y un poco de JS y My SQL, pero creo que la mayoria pensaba que era intuitivo como manejar su cms por el backend pues no es asi deben programar un poco no es mucho porque en el codex esta todo y ya hay muchas funciones que estan hechas para hacerles la vida facil, no se desanimen sigan intentandolo aprendan este y mas cursos de programación si de verdad les gusta programar, sino no van avanzar. Saludos.

Ricardo Celis

teacher•

de acuerdo con tu mensaje Aleku, sólo agregaría que aqúi mismo pueden encontrar los cursos de php, html y css y sin duda con eso el contenido se vuelve más sencillo =), saludos!

Jessica Tatiana Camacho

student•

El problema es que este Profesor se salta partes importantes de lo que hace, por eso nos perdemos…

por ejemplo,

add_action( 'wp_enqueue_scripts', 'alert_js' );

No queda claro:
que es un action?
por que wp_enqueue_scriptS en vez de wp_enqueue_script

para los que no saben ingles
que es hook? (no queda bien explicado)
que es enqueque?

Eso de mirar la documentación en medio del vídeo, no cuela

Jose Ignacio Hernandez Villafuerte

student•

Si estoy de acuerdo contigo, si se salta cosas y ya no sabes donde esta.
Terminare el curso y aprendere en youtube wordpress

Juan Miguel Jimenez

student•

Es así, de hecho pienso que este articulo https://platzi.com/blog/hooks-wordpress/ debería ser parte de este curso, ahí se contestan tus dudas.

Jonathan Macalupu Reyes

student•

Ejercicio de la clase: agregar una alerta cuando abrimos la web.

Crearemos una nueva carpeta llamada “js”
Ahora, creamos un archivo dentro de la carpeta alert.js y copiamos el siguiente código:

jQuery ( document).ready(function(){
alert("Esto es un alert");
});

Esto hace que tengamos una nueva función, pero el problema es que no se ejecutará a menos que lo llamemos desde functions.php
Dentro de functions.php, haremos la implementación usando wp_enqueue_script, que es una función que carga un script en un momento dado en nuestro sistema.
Creamos la función dentro de function.php

function alert_js() {
wp_enqueue_script('alert_js', get_template_directory_uri().'/js/alert.js', array('jquery'), false, false);
};

Sin embargo, esto no ejecutará el código, lo que se tiene que hacer es un add_action para que funcione. Ya que con ello llamamos a la acción. Simplemente, colocamos debajo de nuestra función las siguientes líneas:

add_action('wp_enqueue_scripts', 'alert_js');

Luego vamos a la página principal y se ejecutará el mensaje de alerta. Recuerda que este mensaje se mostrará cuando se cargue cada página.

Jorge Lopez

student•

Pensé que era novato, incluso lo corro x1.5 para no aburrirme. Es necesario tener conocimientos previos claro, lo mejor que pueden hacer es leer, nadie le va a dar más de lo que está en hooks de wordpress. No se desanimen que a veces “nunca” usarás esta clase a veces solo te quedarás usando plugins y “no necesitarás” de esto. Pero ya vienen los pluggins sigan adelante.

Young Sin Lim

student•

no se ustedes pero a mi me parece realmente molesto no poder ver el código que va escribiendo porque lo tapa el frame donde esta el instructor

Efraín Sastré

student•

Sí, tuve que venir alosc omentarios a ver cual era el código.

Irving Meyer

student•

WordPress, a diferencia de otros gestores de contenido, utiliza una arquitectura basada en eventos y procedimientos. Si quieres desarrollar tanto temas como plugins en este CMS, es esencial que aprendas a utilizar el sistema de hooks o ganchos.

Los ganchos o hooks en WordPress son puntos concretos y estratégicos dentro del core de WordPress que permiten añadir funcionalidades o modificar un comportamiento. Cuando la secuencia de carga llegue a ese punto concreto, se ejecuta la función que has “enganchado”.

De esta manera, podrás modificar el funcionamiento del código de WordPress sin ni siquiera tocarlo.

Jose L. Figueroa

student•

Excellente aporte!!! Muchas gracias!!!

Irving Meyer

student•

Solo para agregar y recordar, q el codigo q tu agregar, por lo general va en tu archivo functions.php de tu tema. Asi enganchas tu codigo, justo a la parte que hace referencia tu gancho, que estan en core de wordpress. Asi q si se actualiza tu wordpress, tu codigo q esta en el functions.php siempre estara enganchado a esa parte.

Daniel Alejandro Romero Chavez

student•

Veo que muchas personas comentan atacando al profesor a mi me resulta realmente incomodo esto pues se quejan de no entender por culpa de Rafa pero al ver sus perfiles no tienen ningún curso aprobado y escasos puntos que se podría traducir en que ni siquiera le han dado un vistazo a los cursos que son requisitos de este (claro habrán los que digan que ya tenían el conocimiento) , Hace mas de un año que están las Rutas de Aprendizaje en Platzi el no ver los pre requisitos es una completa irresponsabilidad de cada uno aqui mismo con su suscripción tienen git, html css js php etc,otra cosa muy diferente es que quieran ir por lo fácil y plasman su frustración aquí con Rafa, compañeros hay que aprender a reconocer cuando el error es propio o de alguien mas.

Yo le recomendaría al team platzi poner mas énfasis en señalar que un curso es avanzado , intermedio o básico , e indicar las tecnologías que son NECESARIAS para llevar el curso sin estas frustraciones

Daniel Vaca

student•

Correcto, el gran problema es que al inicio del curso no se indica que conocimientos previos se necesitan, creo que es algo que debería estar en todos los cursos para que así no se lleven malas experiencias.

Pero también hay que reconocer que el profe a veces salta de un lado a otro y no hay la explicación adecuada lo que conlleva a confusiones. Yo ya he realizado 23 cursos de Platzi, incluido todo lo necesario para este curso, pero aún así me cuesta a veces seguirle el ritmo. Se nota la diferencia con otros cursos.

Juan Bernardo Vázquez Gómez

student•

El curso de wordpress 2015 sigo recurriendo a el para comprender temas actuales de wordpress, en lo personal deja mucho que desear este Curso de Wordpress, pensé que realmente sería “Profesional”.

Fernando David Soto Betin

student•

Me anoto a tu comentario, por ahí inicie el curso de wp 2015, era mas estructurado, veo que este carece de orden…el profe seguro que sabe. …

Fernando Ontiveros

student•

https://platzi.com/clases/wordpress2016/

Jonathan Macalupu Reyes

student•

Haciendo un análisis de casi TODOS los usuarios que se quejan veo que no tienen cursos aprobados como el de introducción a PHP, Fundamentos de Base de Datos o de Git y Github que ofrece Platzi para la carrera de WordPress. Y recomiendo que antes que vean este curso lo puedan llevar.

No sé si eso ya venía desde hace un año, pero en lo que he visto (a partir de este año 2018), ya hay una linea de carrera para poder entender este curso.

Sí, sé que es un poco complicado, pero también recordemos que en todo sitio que tu llevas un curso, siempre va a quedar investigar más si quieres volverte un experto. Eso hace la diferencia de alguien, que obviamente, se le llama experto a uno que no.

Por otra parte, es importante tener la documentación si quieres profundizar en algo. Por lo que veo, nos dan las nociones básicas para ir intuyendo.

Si, efectivamente me ha tocado repasar una y otra vez, porque a veces “no se aprende a la primera”, además que reforzamos y se queda en nuestra memoria de largo plazo. (vídeo recomendado: https://www.youtube.com/watch?v=khXfXYOLfzU)

Por último, sentir que basta un curso para aprender todo, es mentirte a ti mismo. Siempre lee, aprende y siempre practica y mucho.

Y por último, cómete un snicker y lleva los cursos previos a este. ¿mejor?

Jesús Yael Ortega Aguilar

student•

Leo muchas quejas que me parecen injustas. Este curso está diseñado desde la perspectiva de desarrollo, evidentemente necesitan conocimientos previos de diseño web, bases de datos y Linux (para montar los sitios y administrarlos desde consola).

WordPress es muy fácil de usar desde su interfaz gráfica, pueden usarlo y personalizarlo a gran detalle sin necesidad de código, lo cual desde mi punto de vista, es completamente válido, sin embargo, no es el objetivo de este curso.

Francisco Ruperto Castro Mariona

student•

Creo que el problema esta desde el nombre del curso, porque solo dice "Curso de temas y Plugins en WP", para mi que de deberia de llamar "Curso de Desarrollo en Wp o algo asi,

Daniel Hidalgo

student•

No estoy de acuerdo con las quejas que he leído de otros estudiantes. El curso está muy bien y muy completo, ya es responsabilidad de cada uno indagar y prepararse en otras áreas/cursos. Lo importante es tener bien fijado tu objetivo final y plantearte que conocimientos necesitas para lograrlo. Si quieren un curso básico de “como usar/administrar wordpress” lo pueden encontrar en youtube y gratis.

José Pach Delgado

student•

No es necesario escribir tanto jaja.

$(function(){
// Write something.
});

Carlos Enrique Ramírez Flores

student•

SI PERO EN WP debe inicar como lo hizo el profe,

o de esta forma

(function ($, root, undefined) {
	$(function () {
		
	});
	
})(jQuery, this);

Juan Alexander Rodríguez Pérez

student•

¿Por qué va cambiando tanto de plantillas?, se presta para mucha confusión.

David Toca

student•

Es por razones pedagogicas, pero nos sirve mucho tu feedback para tener este tipo de cosas en cuenta para proximos cursos.

Juan Alexander Rodríguez Pérez

student•

Entiendo la idea del Rafa de mostrar los cambios entre una y otra plantilla para ver sus diferencias, pero considero aún más importante seguir una misma línea teniendo que la base no cambia. Gracias por tomar mi observación para futuros cursos!

Wilson Fernando Antury Torres

student•

En el archivo functions.php es donde se agrega toda la funcionalidad del sistema.

Alexander Rojas

student•

Lo que noto es que hay mucha confusión con respecto al nivel de conocimiento necesario para enfrentar un desarrollo en wordpress.
Es irresponsable pensar que podrás crear un website rico en diseño y contenido sin tener una base en html, en css y en javascript. Y a eso súmenle tener un conocimiento mínimo de cómo funciona php que es el lenguaje en el cual se sostiene wordpress.

Al mismo tiempo, como wordpress se maneja con una estructura de directorios y archivos, es sumamente importante tener, por lo menos, un conocimiento básico del funcionamiento de un servidor de tal forma que puedan sacar provecho de todo el potencial de wordpress.

Jose Reig Martínez

student•

Archivo alert.js con código javascript sin usar jQuery: window.onload = ()=> { alert("Esto es un alert!!"); };

Para que no os liéis con $() o jQuery()... :-)

Modificar un tema de forma correcta: El archivo functions.php

Introducción al curso

¡Actualizamos este curso!

¿Qué podemos hacer con WordPress?

¿Debería crear un sitio desde cero o usar un template de WordPress?

¿Por qué aprender WordPress?

Introducción a WordPress y WordPress.org

Conociendo WordPress

WordPress como un blog

WordPress como un CMS

WordPress como un framework

WordPress en el futuro

Repasando WordPress

¿Qué debes hacer antes de comenzar?

Instalar WordPress en un hosting con Softaculous

Instalar WordPress en un servidor con acceso SSH

Instalar WordPress en un servidor con acceso FTP

Instalar WordPress en un servidor con WP-cli

Instalar WordPress en local

Proyecto - Instalación Inicial

Temas en WordPress

Instalar un tema en WordPress

Modificar un tema de forma correcta: La estructura de archivos

Modificar un tema de forma correcta: Cómo crear plantillas específicas

Modificar un tema de forma correcta: Los template parts

Modificar un tema de forma correcta: El archivo functions.php

Utilizar temas hijos y aplicación al proyecto

Gestión de usuarios

Gestión de usuarios básica

Restricción de contenidos

Creación de nuevos roles de usuario - aplicado al proyecto

Maquetadores visuales

Usando Divi como maquetador visual

Aplicar Visual composer en maquetación visual

Usar Gutenberg como maquetador visual

Utilizar WordPress como CMS o como Framework

Custom Post Types - CPT de viajes adaptable a nuestro proyecto

Custom Fields

Formatear tu CPT para mostrarlo en Frontend

Aprender a utilizar la REST API de WordPress

Creación de plugins en WordPress

Plugins básicos que deberíamos utilizar

Jetpack

ManageWP

Plugins de caché

Cookie Law Info

Really Simple SSL

Yoast SEO

Updraft Plus

Cómo crear un plugin

Proyecto - darle diseño y contenido a nuestro sitio

Proyecto - despublicar entradas con Post Expirator y cierre

Contenido Bonus

Seguridad en WordPress

Convierte tu instalación local en un entorno de testing con distintas versiones de PHP

WooCommerce

Instalación de WooCommerce

Configuración básica de WooCommerce

Configuraciones de compra y correos electrónicos en WooCommerce

Crear productos para tienda virtual

Proceso de venta y Pasarelas de Pago

Productos variables

¿Qué es Sensei?