Como debe ser un header.php en wordpress?

  • Autor Autor eic2010
  • Fecha de inicio Fecha de inicio
E

eic2010

Beta
¡Usuario con pocos negocios! ¡Utiliza siempre saldo de Forobeta!
Hola he leido por todos lados y he visto varios códigos de un header.php yo quisiera saber si lo que tengo esta bien y es html5? o le falta tags, meta descripción? porque la realidad estoy haciendo un proyecto sin plugnis y quisiera un codigo algo simple en donde se se entienda cual es su imagen destacada de cada entrada, su titulo y descripción . desde ya muchas gracias.


HTML:
<!DOCTYPE html>
<html <?php language_attributes(); ?>>
 <head>
   <meta charset="utf-8"/>
	
   <title><?php is_front_page() ? bloginfo('description') : wp_title(''); ?></title>
   <meta charset="<?php bloginfo( 'charset' ); ?>">
   <meta name="viewport" content="width=device-width, initial-scale=1.0">
	 <meta property="og:image" content="<?php if (function_exists('wp_get_attachment_thumb_url')) {echo wp_get_attachment_thumb_url(get_post_thumbnail_id($post->ID)); }?>" />
   <link rel="stylesheet" href="<?php bloginfo('stylesheet_url'); ?>">
   <?php wp_head(); ?>
 </head>
 
Básicamente esta bien, le faltan los tags para facebook, solo estas poniendo el de imagen, faltarian títulos, descripción, etc.

Saludos
 
Básicamente está bien, como dice el otro usuario, faltan detalles de SEO, pero está bien
 
Muchas gracias por responder y como seria el código para los títulos y descripción, porque he visto varios y nose cual pude ser el mas compatible.
 
Recuerda que toda etiqueta META debe terminar en /> al igual que las etiquetas de imagen y demás etiquetas que no tengan cierre de tag por defecto.

<meta ..... />
<img ..... />
 
Última edición:
y si inserto este código me servirá igual ? porque al compartir por whatsapp no me muestra imagen ni descripción ni titulo

HTML:
<meta property="og:title" content="title" /> 
<meta property="og:description" content="description" /> 
<meta property="og:image" content="thumbnail_image" />

- - - Actualizado - - -

haber acabo de generar este header.php esta bien? o necesito insertar open-graph en functions.php es que tanto leer me marie jejeje

HTML:
<!DOCTYPE html>
<html <?php language_attributes(); ?>>
 <head>
   <meta charset="utf-8"/>
	
   <title><?php is_front_page() ? bloginfo('description') : wp_title(''); ?></title>
   <meta charset="<?php bloginfo( 'charset' ); ?>">
   <meta name="viewport" content="width=device-width, initial-scale=1.0">
	 
	 <meta property="og:type" content="article" />
	 <meta property="og:url" content="<?php the_permalink() ?>"/>
	 <meta property="og:title" content="<?php single_post_title(''); ?>" /> 
     <meta property="og:description" content=" descripcion de mi pagina" /> 
	 <meta property="og:image" content="<?php if (function_exists('wp_get_attachment_thumb_url')) {echo wp_get_attachment_thumb_url(get_post_thumbnail_id($post->ID)); }?>" />
	 
	  <?php wp_head(); ?>
 </head>
 
esta bien ese codigo, es de gran ayuda tambien para otras personas tomando en cuenta los comentarios de los anteriores usuarios, espero lo mejores y te ayude suerte
 
Acá encontré este código para open graph pero quiero poner el código de Descripción e Imagen en functions.php pero no se como llamarlo desde el header??? si alguien me puede ayudar

PHP:
<!-- Open Graph data -->
     <meta property="og:type" content="article" />
	 <meta property="og:url" content="<?php the_permalink() ?>"/>
	 <meta property="og:title" content="<?php single_post_title(''); ?>" /> 
	 <meta property="og:image" content="<?php if (function_exists('wp_get_attachment_thumb_url')) {echo wp_get_attachment_thumb_url(get_post_thumbnail_id($post->ID)); }?>" />
	
	  <?php if (have_posts()):while(have_posts()):the_post();endwhile;endif;?>
<?php if (is_single()) { ?> 
    <meta property="og:description" content="<?php echo strip_tags(get_the_excerpt($post->ID)); ?>" />	
<?php } else { ?> 
    <meta property="og:description" content="<?php bloginfo('description'); ?>" />
<?php } ?>
	 
	 <!-- Twitter Card data -->
<meta name="twitter:card" value="summary" />
<meta name="twitter:url" value="<?php the_permalink() ?>" />
<meta name="twitter:title" value="<?php single_post_title(''); ?>" />
<meta name="twitter:image" value="<?php if (function_exists('wp_get_attachment_thumb_url')) {echo wp_get_attachment_thumb_url(get_post_thumbnail_id($post->ID)); }?>" />
<meta name="twitter:site" value="@mitwitter" />
<meta name="twitter:creator" value="@mitwiiter" /> 
	  <?php if (have_posts()):while(have_posts()):the_post();endwhile;endif;?>
<?php if (is_single()) { ?> 
    <meta name="twitter:description" value="<?php echo strip_tags(get_the_excerpt($post->ID)); ?>" />	
<?php } else { ?> 
    <meta name="twitter:description" value="<?php bloginfo('description'); ?>" />
<?php } ?>
 
Acá encontré este código para open graph pero quiero poner el código de Descripción e Imagen en functions.php pero no se como llamarlo desde el header??? si alguien me puede ayudar

PHP:
<!-- Open Graph data -->
     <meta property="og:type" content="article" />
	 <meta property="og:url" content="<?php the_permalink() ?>"/>
	 <meta property="og:title" content="<?php single_post_title(''); ?>" /> 
	 <meta property="og:image" content="<?php if (function_exists('wp_get_attachment_thumb_url')) {echo wp_get_attachment_thumb_url(get_post_thumbnail_id($post->ID)); }?>" />
	
	  <?php if (have_posts()):while(have_posts()):the_post();endwhile;endif;?>
<?php if (is_single()) { ?> 
    <meta property="og:description" content="<?php echo strip_tags(get_the_excerpt($post->ID)); ?>" />	
<?php } else { ?> 
    <meta property="og:description" content="<?php bloginfo('description'); ?>" />
<?php } ?>
	 
	 <!-- Twitter Card data -->
<meta name="twitter:card" value="summary" />
<meta name="twitter:url" value="<?php the_permalink() ?>" />
<meta name="twitter:title" value="<?php single_post_title(''); ?>" />
<meta name="twitter:image" value="<?php if (function_exists('wp_get_attachment_thumb_url')) {echo wp_get_attachment_thumb_url(get_post_thumbnail_id($post->ID)); }?>" />
<meta name="twitter:site" value="@mitwitter" />
<meta name="twitter:creator" value="@mitwiiter" /> 
	  <?php if (have_posts()):while(have_posts()):the_post();endwhile;endif;?>
<?php if (is_single()) { ?> 
    <meta name="twitter:description" value="<?php echo strip_tags(get_the_excerpt($post->ID)); ?>" />	
<?php } else { ?> 
    <meta name="twitter:description" value="<?php bloginfo('description'); ?>" />
<?php } ?>

Ese codigo es PHP se coloca directamente en el header.php
Si quieres hacer llamadas tienes que crear funciones.
 
Muchas gracias por responder. Entonces esto es codigo php


PHP:
 <?php if (have_posts()):while(have_posts()):the_post();endwhile;endif;?>
<?php if (is_single()) { ?> 
    <meta property="og:description" content="<?php echo strip_tags(get_the_excerpt($post->ID)); ?>" />    
<?php } else { ?> 
    <meta property="og:description" content="<?php bloginfo('description'); ?>" />
<?php } ?>


y si lo quiero llamar desde funciones debo crear una función pero con un código diferente no?
 
Muchas gracias por responder. Entonces esto es codigo php


PHP:
 <?php if (have_posts()):while(have_posts()):the_post();endwhile;endif;?>
<?php if (is_single()) { ?> 
    <meta property="og:description" content="<?php echo strip_tags(get_the_excerpt($post->ID)); ?>" />    
<?php } else { ?> 
    <meta property="og:description" content="<?php bloginfo('description'); ?>" />
<?php } ?>


y si lo quiero llamar desde funciones debo crear una función pero con un código diferente no?

Si, es un codigo diferente.
 
Acabo de reemplazar uno de los código para quien le puede servir

código actual

PHP:
<meta property="og:image" content="<?php if (function_exists('wp_get_attachment_thumb_url')) {echo wp_get_attachment_thumb_url(get_post_thumbnail_id($post->ID)); }?>" />


Remplazar por este simple código

PHP:
<meta property="og:image" content="<?php the_post_thumbnail_url('full'); ?>" />

ojo aquí poner según la necesidad en mi caso es full pero puede ser:

the_post_thumbnail_url ('thumbnail'); // Miniatura (por defecto 150px x 150px max)
the_post_thumbnail_url ('medium'); // Resolución media (por defecto 300px x 300px max)
the_post_thumbnail_url ('large'); // Resolución grande (por defecto 640px x 640px max)
the_post_thumbnail_url ('full'); // Resolución completa (tamaño original subido)


Ahora a seguir buscando para cambiar el código php de Descripción que igual funciona pero si se puede ahorrar texto mejor.
 
Atrás
Arriba