{"id":1281,"date":"2025-04-16T20:29:18","date_gmt":"2025-04-16T13:29:18","guid":{"rendered":"https:\/\/cuongnguyen.io.vn\/?p=1281"},"modified":"2025-04-16T20:29:18","modified_gmt":"2025-04-16T13:29:18","slug":"tu-dong-doi-ten-file-va-nen-anh-sang-webp-khi-upload-tren-wordpress","status":"publish","type":"post","link":"https:\/\/cuongnguyen.bat.io.vn\/index.php\/2025\/04\/16\/tu-dong-doi-ten-file-va-nen-anh-sang-webp-khi-upload-tren-wordpress\/","title":{"rendered":"T\u1ef1 \u0111\u1ed9ng \u0111\u1ed5i t\u00ean file v\u00e0 n\u00e9n \u1ea3nh sang webp khi upload tr\u00ean WordPress"},"content":{"rendered":"<h2 class=\"wp-block-heading\">Gi\u1edbi thi\u1ec7u<\/h2>\n<p>Khi v\u1eadn h\u00e0nh m\u1ed9t website WordPress, vi\u1ec7c t\u1ed1i \u01b0u h\u00ecnh \u1ea3nh l\u00e0 y\u1ebfu t\u1ed1 quan tr\u1ecdng \u0111\u1ec3 t\u0103ng t\u1ed1c \u0111\u1ed9 t\u1ea3i trang, c\u1ea3i thi\u1ec7n \u0111i\u1ec3m SEO v\u00e0 mang l\u1ea1i tr\u1ea3i nghi\u1ec7m ng\u01b0\u1eddi d\u00f9ng t\u1ed1t h\u01a1n. \u0110\u1ec3 gi\u1ea3i quy\u1ebft \u0111i\u1ec1u n\u00e0y, b\u1ea1n c\u00f3 th\u1ec3 s\u1eed d\u1ee5ng \u0111o\u1ea1n m\u00e3 PHP d\u01b0\u1edbi \u0111\u00e2y \u0111\u1ec3:<\/p>\n<ul class=\"wp-block-list\">\n<li>\u2705\u00a0<strong>T\u1ef1 \u0111\u1ed9ng n\u00e9n \u1ea3nh khi upload l\u00ean WordPress<\/strong><\/li>\n<li>\u2705\u00a0<strong>Chuy\u1ec3n \u0111\u1ed5i \u1ea3nh sang \u0111\u1ecbnh d\u1ea1ng WebP si\u00eau nh\u1eb9<\/strong><\/li>\n<li>\u2705\u00a0<strong>\u0110\u1ed5i t\u00ean file \u1ea3nh theo ti\u00eau \u0111\u1ec1 b\u00e0i vi\u1ebft<\/strong><\/li>\n<\/ul>\n<p>Kh\u00f4ng c\u1ea7n c\u00e0i th\u00eam plugin n\u00e0o n\u1eb7ng n\u1ec1 \u2014 ch\u1ec9 c\u1ea7n v\u00e0i d\u00f2ng code trong\u00a0<code>functions.php<\/code>, website c\u1ee7a b\u1ea1n s\u1ebd \u0111\u01b0\u1ee3c t\u1ed1i \u01b0u \u1ea3nh m\u1ea1nh m\u1ebd, chuy\u00ean nghi\u1ec7p v\u00e0 th\u00e2n thi\u1ec7n v\u1edbi SEO.<\/p>\n<hr class=\"wp-block-separator has-alpha-channel-opacity\" \/>\n<h2 class=\"wp-block-heading\"><span id=\"Loi_ich_cua_doan_ma\" class=\"ez-toc-section\"><\/span>L\u1ee3i \u00edch c\u1ee7a \u0111o\u1ea1n m\u00e3<\/h2>\n<ul class=\"wp-block-list\">\n<li><strong>T\u1ed1i \u01b0u h\u00f3a hi\u1ec7u su\u1ea5t website<\/strong>\u00a0nh\u1edd \u1ea3nh nh\u1eb9 h\u01a1n<\/li>\n<li><strong>Chuy\u1ec3n \u0111\u1ed5i \u1ea3nh sang WebP<\/strong>, nh\u1eb9 h\u01a1n JPEG\/PNG \u0111\u1ebfn 30-50%<\/li>\n<li><strong>\u0110\u1ed5i t\u00ean file \u1ea3nh t\u1ef1 \u0111\u1ed9ng<\/strong>\u00a0theo b\u00e0i vi\u1ebft, gi\u00fap qu\u1ea3n l\u00fd d\u1ec5 h\u01a1n v\u00e0 t\u0103ng kh\u1ea3 n\u0103ng hi\u1ec3n th\u1ecb tr\u00ean Google Image<\/li>\n<li><strong>T\u1ef1 \u0111\u1ed9ng resize \u1ea3nh l\u1edbn h\u01a1n 1920px<\/strong>, gi\u00fap tr\u00e1nh t\u1ea3i h\u00ecnh n\u1eb7ng kh\u00f4ng c\u1ea7n thi\u1ebft<\/li>\n<\/ul>\n<hr class=\"wp-block-separator has-alpha-channel-opacity\" \/>\n<h2 class=\"wp-block-heading\"><span id=\"Doan_ma_hoan_chinh\" class=\"ez-toc-section\"><\/span>\u0110o\u1ea1n m\u00e3 ho\u00e0n ch\u1ec9nh<\/h2>\n<p>B\u1ea1n ch\u1ec9 c\u1ea7n sao ch\u00e9p \u0111o\u1ea1n m\u00e3 sau v\u00e0o cu\u1ed1i file\u00a0<code>functions.php<\/code>\u00a0c\u1ee7a theme \u0111ang ho\u1ea1t \u0111\u1ed9ng (ho\u1eb7c child theme)<\/p>\n<div class=\"wp-block-kevinbatdorf-code-block-pro cbp-hl-loaded cbp-ff-loaded\" data-code-block-pro-font-family=\"Code-Pro-JetBrains-Mono\">\n<pre class=\"shiki slack-dark\" tabindex=\"0\"><code><span class=\"line\">\/* x\u1eed l\u00fd \u0111\u1ed5i t\u00ean file v\u00e0 n\u00e9n webp nh\u1eb9 h\u00ecnh, ph\u00e1t tri\u1ec3n b\u1edfi gizadata.vn *\/<\/span>\n\n<span class=\"line\">add_action('add_attachment', 'rename_uploaded_file');<\/span>\n<span class=\"line\">add_filter('wp_handle_upload_prefilter', 'custom_upload_filter');<\/span>\n\n<span class=\"line\">function rename_uploaded_file($attachment_id) {<\/span>\n<span class=\"line\">    $post_id = wp_get_post_parent_id($attachment_id);<\/span>\n<span class=\"line\">    if ($post_id) {<\/span>\n<span class=\"line\">        $post_title = get_the_title($post_id);<\/span>\n<span class=\"line\">        $post_title = substr($post_title, 0, 10);<\/span>\n<span class=\"line\">        $file = get_attached_file($attachment_id);<\/span>\n<span class=\"line\">        $path = pathinfo($file);<\/span>\n\n<span class=\"line\">        $new_filename = sanitize_file_name($post_title) . '_' . $path['filename'] . '_' . wp_generate_password(4, false) . '.' . $path['extension'];<\/span>\n<span class=\"line\">        $new_file = $path['dirname'] . '\/' . $new_filename;<\/span>\n\n<span class=\"line\">        rename($file, $new_file);<\/span>\n<span class=\"line\">        update_attached_file($attachment_id, $new_file);<\/span>\n<span class=\"line\">    }<\/span>\n<span class=\"line\">}<\/span>\n\n<span class=\"line\">function custom_upload_filter($file) {<\/span>\n<span class=\"line\">    add_filter('wp_handle_upload', 'custom_resize_compress_to_webp');<\/span>\n\n<span class=\"line\">    $post_id = $_REQUEST['post_id'] ?? 0;<\/span>\n<span class=\"line\">    $post_title = $post_id ? get_the_title($post_id) : 'image';<\/span>\n<span class=\"line\">    $post_title = substr($post_title, 0, 20);<\/span>\n<span class=\"line\">    $file['name'] = wp_unique_filename($file['upload_path'], sanitize_file_name($post_title) . '_' . $file['name']);<\/span>\n<span class=\"line\">    $file['name'] = pathinfo($file['name'], PATHINFO_FILENAME) . '_' . wp_generate_password(4, false) . '.' . pathinfo($file['name'], PATHINFO_EXTENSION);<\/span>\n<span class=\"line\">    return $file;<\/span>\n<span class=\"line\">}<\/span>\n\n<span class=\"line\">function custom_resize_compress_to_webp($upload) {<\/span>\n<span class=\"line\">    $file_path = $upload['file'];<\/span>\n<span class=\"line\">    $image_info = getimagesize($file_path);<\/span>\n\n<span class=\"line\">    if (!$image_info) return $upload;<\/span>\n\n<span class=\"line\">    $width = $image_info[0];<\/span>\n<span class=\"line\">    $mime = $image_info['mime'];<\/span>\n<span class=\"line\">    $max_width = 1920;<\/span>\n\n<span class=\"line\">    $editor = wp_get_image_editor($file_path);<\/span>\n<span class=\"line\">    if (is_wp_error($editor)) return $upload;<\/span>\n\n<span class=\"line\">    if ($width &gt; $max_width) {<\/span>\n<span class=\"line\">        $editor-&gt;resize($max_width, null);<\/span>\n<span class=\"line\">    }<\/span>\n\n<span class=\"line\">    $pathinfo = pathinfo($file_path);<\/span>\n<span class=\"line\">    $new_path = $pathinfo['dirname'] . '\/' . $pathinfo['filename'] . '.webp';<\/span>\n\n<span class=\"line\">    $saved = $editor-&gt;save($new_path, 'image\/webp');<\/span>\n\n<span class=\"line\">    if (!is_wp_error($saved)) {<\/span>\n<span class=\"line\">        unlink($file_path);<\/span>\n<span class=\"line\">        $upload['file'] = $new_path;<\/span>\n<span class=\"line\">        $upload['url'] = dirname($upload['url']) . '\/' . basename($new_path);<\/span>\n<span class=\"line\">        $upload['type'] = 'image\/webp';<\/span>\n<span class=\"line\">    }<\/span>\n\n<span class=\"line\">    return $upload;<\/span>\n<span class=\"line\">}<\/span><\/code><\/pre>\n<\/div>\n<h2 class=\"wp-block-heading\"><span id=\"Huong_dan_su_dung\" class=\"ez-toc-section\"><\/span>H\u01b0\u1edbng d\u1eabn s\u1eed d\u1ee5ng<\/h2>\n<ol class=\"wp-block-list\">\n<li>Truy c\u1eadp th\u01b0 m\u1ee5c theme:\u00a0<code>wp-content\/themes\/ten-theme-cua-ban\/<\/code><\/li>\n<li>M\u1edf file\u00a0<code>functions.php<\/code><\/li>\n<li>D\u00e1n \u0111o\u1ea1n m\u00e3 v\u00e0o cu\u1ed1i file<\/li>\n<li>L\u01b0u l\u1ea1i v\u00e0 th\u1eed upload \u1ea3nh m\u1edbi<\/li>\n<\/ol>\n<p>H\u00ecnh \u1ea3nh m\u1edbi s\u1ebd:<\/p>\n<ul class=\"wp-block-list\">\n<li>T\u1ef1 \u0111\u1ed9ng \u0111\u1ed5i t\u00ean theo ti\u00eau \u0111\u1ec1 b\u00e0i vi\u1ebft<\/li>\n<li>Resize n\u1ebfu v\u01b0\u1ee3t qu\u00e1 1920px<\/li>\n<li>Chuy\u1ec3n sang \u0111\u1ecbnh d\u1ea1ng\u00a0<code>.webp<\/code><\/li>\n<li>Gi\u1ea3m k\u00edch th\u01b0\u1edbc t\u1ed1i \u0111a m\u00e0 v\u1eabn gi\u1eef ch\u1ea5t l\u01b0\u1ee3ng \u1ed5n<\/li>\n<\/ul>\n","protected":false},"excerpt":{"rendered":"<p>Gi\u1edbi thi\u1ec7u Khi v\u1eadn h\u00e0nh m\u1ed9t website WordPress, vi\u1ec7c t\u1ed1i \u01b0u h\u00ecnh \u1ea3nh l\u00e0 y\u1ebfu t\u1ed1 quan tr\u1ecdng \u0111\u1ec3 t\u0103ng t\u1ed1c \u0111\u1ed9 t\u1ea3i trang, c\u1ea3i thi\u1ec7n \u0111i\u1ec3m SEO v\u00e0 mang l\u1ea1i tr\u1ea3i nghi\u1ec7m ng\u01b0\u1eddi d\u00f9ng t\u1ed1t h\u01a1n. \u0110\u1ec3 gi\u1ea3i quy\u1ebft \u0111i\u1ec1u n\u00e0y, b\u1ea1n c\u00f3 th\u1ec3 s\u1eed d\u1ee5ng \u0111o\u1ea1n m\u00e3 PHP d\u01b0\u1edbi \u0111\u00e2y \u0111\u1ec3: \u2705\u00a0T\u1ef1 \u0111\u1ed9ng [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":1282,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[9,11],"tags":[39],"class_list":["post-1281","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-chia-se","category-thiet-ke-website","tag-thiet-ke-website-wordpress"],"blocksy_meta":[],"_links":{"self":[{"href":"https:\/\/cuongnguyen.bat.io.vn\/index.php\/wp-json\/wp\/v2\/posts\/1281","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/cuongnguyen.bat.io.vn\/index.php\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/cuongnguyen.bat.io.vn\/index.php\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/cuongnguyen.bat.io.vn\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/cuongnguyen.bat.io.vn\/index.php\/wp-json\/wp\/v2\/comments?post=1281"}],"version-history":[{"count":0,"href":"https:\/\/cuongnguyen.bat.io.vn\/index.php\/wp-json\/wp\/v2\/posts\/1281\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/cuongnguyen.bat.io.vn\/index.php\/wp-json\/wp\/v2\/media\/1282"}],"wp:attachment":[{"href":"https:\/\/cuongnguyen.bat.io.vn\/index.php\/wp-json\/wp\/v2\/media?parent=1281"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/cuongnguyen.bat.io.vn\/index.php\/wp-json\/wp\/v2\/categories?post=1281"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/cuongnguyen.bat.io.vn\/index.php\/wp-json\/wp\/v2\/tags?post=1281"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}