Canviar la imatge de la capçalera del Wordpress en funció de la categoria

De wikijoan
Salta a la navegació Salta a la cerca

Introducció

Volem personalitzar el Wordpress quan accedir a la url de la categoria descens (o qualsevol altra cosa).

Solució

Categoria descens.png

La url de 'descens' és:

El tema que tinc instal·lat és: twentyten

i la url de la imatge del tema és:

vull que quan la categoria sigui 'bicis/descens', la imatge del header sigui concave.jpg

Taula wp_options:

option_id
option_name
option_value
autoload
select * from wp_options where option_value like '%path.jpg%';

No retorna res perquè mai s'ha modificat, tenim la imatge del header per defecte.

select * from wp_options where option_name like '%twentyten%';

160 | theme_mods_twentyten | a:4:{i:0;b:0;s:18:"nav_menu_locations";a:0:{}s:18:"custom_css_post_id";i:-1;s:16:"background_color";s:6:"ffaaaa";} | yes

Des de la zona d'administració, canvio a concave.jpg i torno a canviar a path.jpg. Ara sí que tenim aquests valors en la taula wp_options:

select * from wp_options where option_name like '%twentyten%';

|160 | theme_mods_twentyten | a:6:{i:0;b:0;s:18:"nav_menu_locations";a:0:{}s:18:"custom_css_post_id";i:-1;s:16:"background_color";s:6:"ffaaaa";s:12:"header_image";s:81:"http://localhost/wordpress/wp-content/themes/twentyten/images/headers/concave.jpg";s:17:"header_image_data";a:3:{s:3:"url";s:81:"http://localhost/wordpress/wp-content/themes/twentyten/images/headers/concave.jpg";s:13:"thumbnail_url";s:91:"http://localhost/wordpress/wp-content/themes/twentyten/images/headers/concave-thumbnail.jpg";s:11:"description";s:6:"Concau";}} | yes

|160 | theme_mods_twentyten | a:6:{i:0;b:0;s:18:"nav_menu_locations";a:0:{}s:18:"custom_css_post_id";i:-1;s:16:"background_color";s:6:"ffaaaa";s:12:"header_image";s:78:"http://localhost/wordpress/wp-content/themes/twentyten/images/headers/path.jpg";s:17:"header_image_data";a:3:{s:3:"url";s:78:"http://localhost/wordpress/wp-content/themes/twentyten/images/headers/path.jpg";s:13:"thumbnail_url";s:88:"http://localhost/wordpress/wp-content/themes/twentyten/images/headers/path-thumbnail.jpg";s:11:"description";s:5:"Camí";}}  | yes

Ara es tracta de veure en quin moment de la programació PHP es decideix pintar el valor de la imatge de la capçalera.

$ cd M09_IAW_2021/UF2/wordpress/
$ find . -type f -print | xargs egrep -i header_image > /home/joan/hola.txt

A la última línia tenim:

./wp-content/themes/twentyten/header.php:					<img src="<?php header_image(); ?>" width="<?php echo esc_attr( $header_image_width ); ?>" height="<?php echo esc_attr( $header_image_height ); ?>" alt="" />

i això està en la línia 106-107 del themes/twentyten/header.php.

I el que hem de fer és un if per saber si estic dins d'una categoria concreta, per tal de què hi hagi la imatge del tema personalitzada. Així:

					<?php //echo($_SERVER['REQUEST_URI']); ?>
					<?php if (strpos($_SERVER['REQUEST_URI'], 'bicis/descens/') > 0) { ?>
					<img src="http://localhost/wordpress/wp-content/themes/twentyten/images/headers/concave.jpg" width="<?php echo esc_attr( $header_image_width ); ?>" height="<?php echo esc_attr( $header_image_height ); ?>" alt="" />
					<?php } else { ?>
					<img src="<?php header_image(); ?>" width="<?php echo esc_attr( $header_image_width ); ?>" height="<?php echo esc_attr( $header_image_height ); ?>" alt="" />
					<?php } ?>
					
					<!-- <img src="<?php header_image(); ?>" width="<?php echo esc_attr( $header_image_width ); ?>" height="<?php echo esc_attr( $header_image_height ); ?>" alt="" /> -->

creat per Joan Quintana Compte, maig 2021