10 dòng lệnh trong Template WordPress bạn chưa biết

0
324

Từ khi ra đời WordPress được các nhà thiết kế web đánh giá cao và sử dụng rộng rãi. Tuy nhiên còn có nhiều dòng lệnh Template WordPress mà bạn chưa biết sẽ được giới thiệu trong bài viết dưới đây.

 Template của WordPress

 

Nếu bạn đang thực hiện một dự án có sử dụng WordPress thì chắc hẳn bạn rất quen thuộc với các Template thể hiện các mẫu thông tin như title( tiêu đề bài viết), authorcho(thể hiện tên tác giả bài viết) và một số liên kết khác của bài viết. Dưới đây là 10 Template tốt nhất của WordPress mà bạn không thể bỏ qua.

1. Capital P

Matt Mullenweg( người sáng lập ra WordPress) đánh giá Capital P là một vấn đề quan trọng trong WordPress

Cấu trúc:

Từ Từ : 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 );

} );

2. Custom Logo

Đây là một tính năng mới trong WordPress được sử dụng để tải các biểu tượng cho các chủ đề. Nếu muốn thể hiện chủ đề rõ ràng nhất bạn  phải thêm add_theme_support ( ‘site-logo’ ) vào trong file php và logo sẽ xuất hiện trong Customizer.

Tính năng này đòi hỏi bạn phải sử dụng một số mẫu từ khóa thì bạn mới có thể xử lý ảnh trên logo của chủ đề. Cụ thể là has_custom_logo(), get_custom_logo(), và the_custom_logo().

Tính năng này sẽ dẫn đến việc sử dụng một vài mẫu khóa mới có thể xử lý đầu ra hình ảnh logo trên chủ đề, cụ thể là: has_custom_logo(), get_custom_logo(), và the_custom_logo().

Cấu trúc:

Từ : 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 ‘<div class=”site-logo”>’. $html .'</div>’;

} );

3. Thay đổi kích thước ảnh

 Template của WordPress

Trong WordPress kho bạn upload một hình ảnh lên thì ngoài kích thước ban đầu, WordPress có thể thêm một số hình ảnh thu nhỏ hay hình ảnh với kích thước trung bình bằng cách sử dụng hàm add_image_size.

Ví dụ: Bạn dùng hàm the_post_thumbnail() thể hiện hình ảnh và thuộc tính của nó. Nhưng khi bạn muốn hiển thị hình ảnh thu nhỏ thì bạn phải dùng hàm get_the_post_thumbnail_url().

Cấu trúc:

Từ : 4.4.0

<?php echo get_the_post_thumbnail_url(); // e.g. “http://example.com/path/to/image/thumbnail.jpg”?>

<div class=”image-thumbnail” style=”background-image; url(<?php echo get_the_post_thumbnail_url() ?>)”></div>

4. Tạo số ngẫu nhiên

Đây là một Template của WordPress sử dụng trong nội bộ để tạo ra một số ngẫu nhiên. Bạn có thể dùng nó để tạo ra số phiếu giảm giá ngẫu nhiên trên trang web thông qua plugin WooCommerce.

Cấu trúc:

Từ : 2.6.2

// Tạo một số 1-200

$ Rand_number = wp_rand (1, 200); // Sản lượng sẽ không được dưới 0 hoặc 201 ở trên.

5. Đánh số trang

Hầu hết các lập trình viên đang sử dụng cấu trúc the_comments_navigation() để điều hướng chỉ đường từ vị trí bắt đầu tới vị trí kết thúc. Nếu bạn muốn đánh số trang khi website dàn nội dung thì bạn dùng hàm the_comments_pagination()

Lưu ý: Các Template chỉ có sẵn trong WordPress 4.4.0 trở lên nênbạn cần phải kiểm tra trước khi thực hiện.

Cấu trúc:

Từ : 2.6.2

<?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 –>

6. Rút ngắn URL

Đây là một Template dùng để rút ngắn URL. Nếu một URL dài sẽ bạn sẽ rất khó nhớ và quan trọng là nộ dung và hình ảnh bạn muốn thể hiện sẽ bị rút ngắn lại.

Có hai cách để bạn rút ngắn URL:

Cách 1: thêm overflow-wrap hay break-word vào CSS

Cách 2: cắt theo chiều dài của URL bằng hàm: url_shorten()

Cấu trúc:

Từ : 1.2.0

$link = get_the_permalink();

$url_text = url_shorten( $link ); // e.g. www.hongkiat.com/blog/css…

echo ‘<a href=”‘. $link .'”>’. $url_text .'</a>’;

7. Thêm Inline Scripts

Sử dụng hàm wp_enqueue_script để đăng ký và tải một số nội dung nhưng phải tuân theo quy tắc nhất định.Khi bạn tải một thông tin nội bộ vẫn còn gặp một chút khó khăn, nhưng từ khi có mẫu wp_add_inline_script này thì việc này trở nên dễ dàng hơn rất nhiều.

Cấu trúc:

Từ : 4.5.0

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/javascript’>window.hkdc = {}</script>

// <script type=’text/javascript’ src=’http://local.wordpress.dev/wp-content/themes/twentysixteen/js/functions.js?ver=20160412′></script>

8. Dropdown Language

 Template của WordPress

Các Template với cấu trúc hàm wp_dropdown_languages sẽ tạo ra một tùy chọn HTML để hiển thị danh sách các ngôn ngữ trong WordPress như trong front-end, tài khoản quản trị cho phép người sử dụng tùy chọ ngôn ngữ của họ. Khi bạn muốn khoanh vùng trang web của mình thì mẫu này là một lựa chọn hoàn hảo của bạn.

Cấu trúc:

Từ : 4.0.0

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,

)

);

9. Lấy link từ avatar

Bạn có thể lấy đường link từ avatar của bạn bằng hàm get_avatar_url(). Nó cho phếp bạn hiển thị và định dạng avatar theo bất kỳ cách nào thay chỉ vì hiển thị chúng thông qua các thẻ hình ảnh HTML.

Cấu trúc:

Từ 4.2.0

$avatar = get_avatar_url( ‘admin@domain.com’ );

<div class=”avatar-url” style=”background-image: url(<?php echo $avatar; ?>)”>

</div>

10. Chọn giao diện

Sau khi đã làm xong các quy trình lấy tên miền và hosting thì việc làm quan trọng tiếp theo của bạn là tìm kiếm giao diện cho website đó. Đây là bộ mặt của một trang web hiển thị tất cả các nội dung mà bạn muốn thể hiện như: tên, Slug, Version, địa chỉ IP, tác giả…

Cấu trúc:

Từ : 3.4.0

$theme = wp_get_theme();

define( ‘THEME_SLUG’, $theme->template ); //twentysixteen

define( ‘THEME_NAME’, $theme->get( ‘Name’ ) ); // Twenty Sixteen

define( ‘THEME_VERSION’, $theme->get( ‘Version’ ) ); //1.2

function 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’ );

Đây là cấu trúc sử dụng nó để lấy một Version.

WordPress đang rất phát triển, mỗi phiên bản mới phát hành đều giới thiệu những mẫu Template mới. Việc giữ lại và sử dụng tất cả các mẫu từ khóa là việc không thể. Tuy nhiên những mẫu Template tốt vẫn được các nhà thiết kế web sử dụng cho dù có các mẫu Template mới.

Bạn có thể tìm hiểu thêm về:

12 Plugins quan trọng để phát triển WordPress

Trở thành chuyên gia thiết kế web với WordPress

Cảm ơn các bạn đã theo dõi bài viết!

[Total: 1    Average: 5/5]

LEAVE A REPLY

Please enter your comment!
Please enter your name here