Hola Rafael.

las etiquetas H1 se utilizan para título del contenido de una página web. Importante en este punto delimitar de forma clara la diferencia entre sitio web y página web: un título H1 debe hacer referencia a una página de tu sitio web, y no al sitio web en general.

No es bueno utilizar mas de una etiqueta H1 en cada página, mas bien no es nada recomendable de cara al seo, puedes utilizar otras como h2, h3, h4, etc....

Para añadir un texto lo puedes hacer con HTML :

Texto que quieras mostrar

Un saludo

Mmmmm, me parece que no se ha entendido bien:
Yo hasta ahora tengo, en cada página web, en primer lugar una imagen de cabecera, y después de esta el título, en h1 obviamente, y sin repetirse en el resto de la página.

Pero me gustaría que tuviera un aspecto "más elegante" y que el texto en h1 se integrara encima de la imagen, no después de ésta, en el borde inferior de la misma, aplicandole algo de estilo (cambiar tipografía, algo de transparencia,..) tal y como descrito en el texto inicial

Hola

Te refieres poner un texto encima de la imagen de por ejemplo este artículo?:
Contenido solo visible a usuarios registrados

He visto tu video, y efectivamente se puede realizar de forma sencilla, sin embargo para que sea sencilla la implementación de esto es muy importante tener una estructura HTML adecuada, en tu caso la imagen y el texto no estan en el mismo contenedor, esto dificulta mucho la implementación.

En resumen, si el theme que usas no genera una estructura HTML en donde la imagen y el título se encuentren ambos dentro del contenedor, lo veo complicado realizarlo.

Algo que podrías evaluar es hacer la estructura como parte del contenido de tu entrada, en este caso definirías la estructura para cada artículo, colocando manualmente la imagen y el título dentro de un mismo contenedor. Sin embargo tendrías que eliminar la imagen destacada de tu artículo ya que lo colocarás como parte del contenido y también el título tendrías que modificar tu theme para que no lo muestre, tal vez no valga la pena hacer estas modificaciones.

Saludos.

¿Seguro que no hay una solución más sencilla? Mira, indagando un poco más por internet, he dado con esta solución:

http://sientema-cp31.wordpresstemporal.com/viajar/fez-escapada/

Puedes ver ahora que la cabecera tiene el texto h1 encima. Éste es el código:

);height:425px;width:940px;margin-top:20px">

Escapada a Fez desde Tarifa y la Costa del Sol

Lo malo es que así la imagen no se adapta la ancho de la ventana (se queda fija).

Otra opción es esta:

);margin-top:20px">

Escapada a Fez desde Tarifa y la Costa del Sol

Pero entonces la imagen se adapta al texto, no se visualiza completa.

Hola

En el caso que indicas la imagen esta como fondo no como elemente img, es decir la estructura es otra y el código CSS también.

En tu código para que se vea correctametne en móvil elimina width:940px; del estilo en línea, es decir no definas un ancho.

Saludos.

si elimino al ancho éste, efectivamente, se adapta a la resolución de la pantalla pero el alto se mantiene fijo, es decir, no visualiza por completo la imagen, sino un trozo vertical, en virtud del ancho de la pantalla.

Y si elimino también el alto la imagen se adapta a la dimensiones del texto, es decir que se recorta en alto.

Con respecto a esto que me indicas:
"En el caso que indicas la imagen esta como fondo no como elemente img, es decir la estructura es otra y el código CSS también."
A ver, a mi me da igual la solución que se plantee. Yo lo que quiero es insertar una imagen, que se adapte a la resolución del dispoisitivo, y que encima de ésta haya un texto H1, en su borde inferior, y me da igual que código o elementos sea necesario utilizar, siempre que no sea necesario tener que instalar otro plugin en wordpress.

Gracias de antemano

Hola

Para que las modificiaciones que hagas sean los más simples posibles, mejor evita usar estilos inline, sólo usalos para la imagen que entiendo que cambiará de artículo en artículo, es decir usa el siguiente código HTML

Escapada a Fez desde Tarifa y la Costa del Sol

En este código he eliminado todo los estilos inline, salvo la imagen de fondo para el contenedor, y he creado dos clases, fondo-imagen y texto-imagen

Luego usa estas clases para definir los estilos, puedes agregtarlas al final de algún archivo CSS,
por ejemplo al final del archivo : wp-content/themes/tourpackage-v2-00/style-custom.css

.texto-imagen{
	color:white;
	padding:20px;
	line-height:40px
}

.fondo-imagen{
	background-repeat:no-repeat;
	background-size:100%;
	background-position:center center;
}

@media ( min-width:768px){
	.fondo-imagen{
		min-height:300px;
	}
}

Refresca tu navegador luego de agregar este código CSS y verifica :
Contenido solo visible a usuarios registrados

Saludos.