Si ha estado en un tema de WordPress, puede ser familiarizado con algunas de estas etiquetas de plantilla, como la the_title muestra el título de la publicación, the_author el nombre del autor de la publicación y el enlace de la publicación.
Cómo crear etiquetas personalizadas de plantillas de WordPress
Crear un tema de WordPress es muy fácil con las etiquetas de plantilla. Puedes agregar el_título () para mostrar la publicación. WordPress sigue evolucionando. Cada nuevo lanzamiento a menudo introduce algunas nuevas etiquetas de plantillas. Tanto es así como se mantiene al día con todas estas etiquetas de plantilla, antiguas o nuevas, puede ser un gran desafío. Echa un vistazo a estas 20 etiquetas de plantilla que podrías haber pasado por alto.
Capital p
WordPress , como por su guía y estándar, tiene que ser escrito con el capital de WordPress es un no; La forma correcta es deletrearlo como WordPress.
La capital "P" es un tema con tanta importancia en la medida en que Matt Mullenweg (fundador de WordPress) lo incluyó en su resolución en 2009. La función capital_p_dangit() se presenta como parte de la iniciativa.
Desde : 3.0.0
// Using it straightforwardly$footer_text = get_theme_mod( "footer_text", "" );
$footer_text = captial_p_dangit( $footer_text ); // Any WordPress text is turned with capital P.
// Or, using it in a WordPress Filter.
add_filter( "the_excerpt", function( $text ) {
return captial_p_dangit( $text );
} );Logotipo personalizado
En WordPress 4.5, introdujo la capacidad de cargar un logotipo para temas a través del Personalizador. Esta nueva función requiere compatibilidad con el tema: alentar add_theme_support( 'site-logo' ), el logotipo aparece en el Personalizador.
Esta característica conduce a la utilización de algunas nuevas etiquetas de plantilla que pueden manejar la salida de imagen del logotipo en temas, a saber: has_custom_logo(), get_custom_logo(), y the_custom_logo()...
Desde : 4.5.0
// 1. Output includes the image logo and the link back to home.
the_custom_logo();
// 2. Get the custom logo output "string".
$logo = get_custom_logo();
// 3. Conditional
if ( has_custom_logo() ) {
$logo = get_custom_logo();
}
// 4. Using the 'get_custom_logo' to wrap the logo with a div;
add_filter( "get_custom_logo", function( $html ) {
return '
'. $html .'
';
} );URL de imagen en miniatura
WordPress tiene una utilidad nativa integrada desde hace mucho tiempo para agregar una imagen en miniatura o una imagen destacada. La etiqueta de plantilla, the_post_thumbnail(), . muestra la etiqueta de imagen junto con sus atributos.
Pero, ¿qué sucede si desea mostrar la miniatura de la imagen como fondo a través de CSS? Utilice la etiqueta de plantilla, get_the_post_thumbnail_url().
Desde : 4.4.0
Ejemplo :
<?php echo get_the_post_thumbnail_url(); // e.g. "https://example.com/path/to/image/thumbnail.webp"?><div class="image-thumbnail" style="background-image; url(<?php echo get_the_post_thumbnail_url() ?>)"></div>Generar número aleatorio
Esta etiqueta de plantilla le dará un número aleatorio basado en un rango específico. WordPress está utilizando esta función internamente para generar una contraseña aleatoria. Probablemente pueda usarlo para generar un número de cupón al azar para su sitio WooCommerce.
Desde : 2.6.2
Ejemplo :
// Generate a number from 1 to 200$rand_number = wp_rand( 1, 200 ); // output will not be below 0 or 201 above.Comentarios Paginación
La mayoría de los Temas están actualmente utilizando el the_comments_navigation() tipo de enlace de navegación "Siguiente" y "Anterior". Si desea mostrar una navegación numerada (paginación), reemplace la etiqueta he_comments_pagination() en su lugar.
Tenga en cuenta que la etiqueta de plantilla solo está disponible en WordPress 4.4.0 hacia arriba. Asegúrese de ejecutar una comprobación antes de implementarla.
Desde : 4.4.0
Ejemplo :
<?php
// Replace the `the_comments_navigation()`
if ( function_exists( 'the_comments_pagination' ) ) {
the_comments_pagination();
} else {
the_comments_navigation();
}
<ol class="comment-list">
<?php
wp_list_comments( array(
'style' => 'ol',
'short_ping' => true,
'avatar_size' => 42,
) );
?>
</ol>
<!-- .comment-list -->URL de acortamiento
Esta etiqueta de plantilla acortará la longitud de una url. Y una URL tan larga no entrará en una nueva línea dentro del contenido del cuerpo. Hay 2 opciones que puede tomar: agregar overflow-wrap: break-word; su CSS o recortar la longitud de la URL con la url_shorten() etiqueta de plantilla.
Desde : 1.2.0
Ejemplo :
$link = get_the_permalink();$url_text = url_shorten( $link ); // e.g. www.hongkiat.com/blog/css...echo '<a href="'. $link .'">'. $url_text .'</a>';Añadir secuencias de comandos en línea
Siempre hemos utilizado wp_enqueue_script para registrar, cargar un script y sus dependencias. Sin embargo, cargar una secuencia de comandos interna no fue tan sencillo hasta que wp_add_inline_script se introdujo esta Etiqueta de plantilla .
Agregar un script en línea requiere un script en cola conocido al que se adjuntará. Este controlador se pasa como el primer parámetro de la secuencia de comandos similar a la función wp_localize_script(). El segundo parámetro debe pasar el contenido del script. Los terceros parámetros especifican si el inline debe mostrarse 'antes' o 'después'.
Desde : 4.5.0
Ejemplo :
function enqueue_script() { wp_enqueue_script( 'twentysixteen-script', get_template_directory_uri() . '/js/functions.js', array( 'jquery' ), '20160412', true );wp_add_inline_script( 'twentysixteen-script', 'window.hkdc = {}', 'before' );
}
add_action( 'wp_enqueue_scripts', 'enqueue_script' );// Output:// <script type='text/jаvascript'>window.hkdc = {}</script>// <script type='text/jаvascript' src='https://local.wordpress.dev/wp-content/themes/twentysixteen/js/functions.js?ver=20160412'></script>
Lenguaje desplegable
La etiqueta de plantilla wp_dropdown_languages mostrará una opción HTML que muestra una lista de idiomas en su sitio de WordPress.
Encontrará esta etiqueta de plantilla útil si necesita localizar su sitio web. Puede usarlo para mostrar sus opciones de idioma en la pantalla del Editor de usuario o en la parte delantera de su sitio para permitir a los usuarios seleccionar su preferencia de idioma.
Desde : 4.0.0
Ejemplo :
wp_dropdown_languages( array(
'id' => 'lang_options',
'name' => 'lang_options',
'languages' => get_available_languages(),
'translations' => array( 'id_ID', 'ja' ), // Indonesia, and Japan
'selected' => 'en_US',
'show_available_translations' => false,
)
);Obtener la URL de la imagen de avatar
Como su nombre indica, esta etiqueta de plantilla get_avatar_url() recuperará la ruta de la imagen del avatar del usuario. Te permite mostrar y moldear el avatar de la forma que quieras, en lugar de mostrarlo simplemente a través de la etiqueta de imagen HTML.
Desde : 4.2.0
Ejemplo :
$avatar = get_avatar_url( 'admin@domain.com' );<div class="avatar-url" style="background-image: url(<?php echo $avatar; ?>)"></div>Obtener tema
Esta función recupera un objeto que contiene información del tema actualmente activo. Esta información incluye el tema Slug, Name, Version, Text Domain, Author, etc.
En el siguiente fragmento de código, lo usamos para recuperar la versión y pasarla como la versión de script.
Desde : 3.4.0
Ejemplo :
$theme = wp_get_theme();define( 'THEME_SLUG', $theme->template ); //twentysixteendefine( 'THEME_NAME', $theme->get( 'Name' ) ); // Twenty Sixteendefine( 'THEME_VERSION', $theme->get( 'Version' ) ); //1.2function load_scripts() {wp_enqueue_script( 'script-ie', $templateuri .'js/ie.js', array( "jquery" ), THEME_VERSION );wp_script_add_data( 'script-ie', 'conditional', 'lt IE 9' );}add_action( 'wp_enqueue_scripts', 'load_scripts' );
Comentarios