Làm thế nào để tạo child theme WordPress (Hướng dẫn dành cho người mới bắt đầu)

Lượt xem
Home

Bạn có định tạo child theme WordPress không? Sau khi bạn đã nắm vững cơ bản về WordPress, bạn có thể muốn tìm hiểu cách tùy chỉnh trang web WordPress của mình. Child theme (giao diện con) là một điểm khởi đầu tuyệt vời cho bất kỳ ai muốn tùy chỉnh các theme WordPress. Trong bài viết này, Vietnix sẽ hướng dẫn bạn cách tạo child theme WordPress một cách nhanh chóng và dễ dàng.

Trước khi bạn bắt đầu tạo child theme WordPress

Trước khi bạn bắt đầu tạo một child theme, bạn cần hiểu rằng bạn sẽ làm việc với code. Để đạt được mục tiêu của mình, bạn cần có kiến thức cơ bản về HTML CSS để hiểu và thực hiện những thay đổi cần thiết trong mã code.

Hiểu biết về PHP cũng sẽ có ích. Điều này ít nhất sẽ giúp bạn hiểu và biết rằng nên sao chép và dán đoạn code từ các nguồn khác và vị trí nào là hợp lý.

Vietnix khuyến nghị bạn nên thực hành trong môi trường phát triển cục bộ (local development environment). Bạn có thể chuyển một trang web WordPress đang hoạt động sang máy chủ cục bộ để thử nghiệm hoặc sử dụng nội dung giả định (dummy content) cho việc phát triển theme.

Cuối cùng, bạn cần quyết định chọn một parent theme (theme gốc đang sử dụng). Bạn nên chọn một parent theme có giao diện và tính năng tương tự với mục tiêu và mong muốn về trang web của bạn. Mục tiêu là làm ít thay đổi càng tốt, chính điều này sẽ giúp tiết kiệm thời gian đáng kể cho bạn đó nha.

Trong bài viết này, Vietnix sẽ sử dụng theme Twenty Twenty-One, là một trong những theme WordPress mặc định.

Tạo child theme WordPress đầu tiên của bạn

Bạn có thể tạo một child theme thủ công bằng cách tạo folder và các file cần thiết, hoặc dễ dàng tạo một child theme thông qua việc sử dụng một plugin child theme.

Việc sử dụng phương pháp thủ công sẽ giúp ích bạn khá nhiều trong việc biết, hiểu và quen với các file và folder đó. Điều này sẽ tiết kiệm khá nhiều thời gian của bạn khi sau này sửa lỗi hoặc thêm các đoạn code trong tương lai của bạn.

Tuy nhiên, nếu bạn gặp phải khó khăn trong việc tạo các file và folder như các thủ công thì bạn có thể sử dụng plugin để làm phương án thứ 2 nhé.

Dưới đây là 2 phương pháp để tạo child theme WordPress thông dụng, bạn có thể chọn phương pháp bạn mong muốn thông qua liên kết dưới đây để bỏ qua những đoạn không cần thiết nhé.

Phương pháp 1: Tạo child theme WordPress bằng code

Đầu tiên, bạn cần mở folder /wp-content/themes/ trong folder cài đặt WordPress và tạo một folder mới cho child theme của bạn.

Bạn có thể đặt tên folder này theo ý muốn. Trong hướng dẫn này, chúng ta sẽ đặt tên là “Vietnixdemo”.

Tạo một thư mục cho child theme - tạo WordPress child theme
Tạo một folder cho child theme

Tiếp theo, bạn cần tạo hai file đầu tiên cho child theme của bạn. Bắt đầu bằng cách mở một trình soạn thảo văn bản như Notepad.

Sau đó, bạn cần sao chép đoạn code sau vào tài liệu trống:

Theme Name:   WPB Child Theme
Theme URI:    https://www.vietnix.com/
Description:  A Twenty Twenty-One child theme
Author:       Vietnix
Author URI:   https://www.vietnix.com/
Template:     twentytwentyone
Version:      1.0.0
Text Domain:  twentytwentyonechild

Đoạn code này chứa thông tin về child theme, hãy thay đổi để phù hợp với nhu cầu của bạn. Tiếp theo, hãy lưu file này dưới dạng “style.css” trong folder child theme vừa tạo. Đây chính là bảng kiểu chính của child theme của bạn.

Công việc tiếp theo là tạo một file thứ hai để nhập hoặc enqueue (kích hoạt) các bảng kiểu từ parent theme. Để làm điều đó, hãy tạo một tài liệu mới trong trình soạn thảo văn bản của bạn và thêm code sau đây:

/* enqueue scripts and style from parent theme */
 
function twentytwentyone_styles() {
wp_enqueue_style( 'child-style', get_stylesheet_uri(),
array( 'twenty-twenty-one-style' ), wp_get_theme()->;get('Version') );
}
add_action( 'wp_enqueue_scripts', 'twentytwentyone_styles');

Đoạn code này sẽ hoạt động khi bạn sử dụng Twenty Twenty-One làm parent theme. Nếu bạn sử dụng một parent theme khác, bạn cần sử dụng code khác được mô tả trong Hướng dẫn theme WordPress.

Nếu bạn gặp khó khăn khi sửa đổi code cho một parent theme khác, bạn có thể sử dụng phương pháp plugin thay thế.

Bây giờ hãy lưu file này dưới dạng “functions.php” trong folder child theme. Chúng ta sẽ quay lại file này sau để thêm các chức năng cho child theme của bạn.

Lưu ý: Trước đây, parent theme được nhập vào bằng cách sử dụng lệnh @import trong style.css. Vietnix không khuyến nghị phương pháp này nữa vì nó sẽ làm tăng thời gian tải các bảng kiểu.

Bạn đã tạo một child theme rất cơ bản và khi bạn điều hướng đến Appearance > Themes, bạn sẽ thấy theme WPB Child Theme. Bạn cần nhấp vào nút “Activate” để bắt đầu sử dụng child theme trên trang web của bạn.

Nhấp vào nút Active
Nhấp vào nút Active

Nhưng do bạn chưa thay đổi bất cứ điều gì trong child theme, trang web của bạn sẽ sử dụng chức năng và giao diện của parent theme. Bây giờ bạn có thể tiếp tục sang phần tiếp theo, nơi bạn sẽ tùy chỉnh child theme của mình.

Hiện tại Vietnix đang tặng kèm bộ theme và plugin bản quyền cho khách hàng đăng ký các gói hosting tốc độ cao. Nếu bạn đang muốn đổi mới giao diện cho website WordPress của mình thì không nên bỏ qua phần quà này. Bộ quà tặng gồm nhiều công cụ hữu ích như Plugin WP Rocket, WP Smush Pro, WPML, iThemes Security Pro, Rank Math SEO Pro, Elementor Pro, theme từ MyThemeShop – Astra – Divi,… với tổng giá trị lên tới 26.000.000 VND. Liên hệ với Vietnix để được tư vấn chi tiết gói hosting theo nhu cầu sử dụng và nhận ngay phần quà cực giá trị trên.

Phương pháp 2: Tạo child theme WordPress bằng plugin

Child Theme Configurator là một plugin WordPress dễ sử dụng cho phép bạn tạo và tùy chỉnh child theme WordPress nhanh chóng mà không cần sử dụng code.

Điều đầu tiên bạn cần làm là cài đặt và kích hoạt plugin Child Theme Configurator. Để biết thêm chi tiết, hãy xem hướng dẫn từng bước của Vietnix về cách cài đặt plugin WordPress.

Sau khi kích hoạt, hãy điều hướng đến Tools > Child Themes trong bảng điều khiển WordPress của bạn.

Trong tab Parent/Child, bạn sẽ được yêu cầu chọn một parent theme từ menu dropdown. Chúng ta sẽ chọn theme Twenty Twenty-One.

Parent Theme
Chọn Parent Theme

Sau khi nhấp vào nút “Analyze”, plugin sẽ đảm bảo rằng theme phù hợp để sử dụng làm parent theme.

Twenty Twenty-One là OK.

Nhấp vào nút Analyze
Nhấp vào nút Analyze

Tiếp theo, bạn sẽ được yêu cầu đặt tên cho folder child theme bạn cần và chọn nơi lưu trữ các kiểu.

Chúng ta sẽ để lại các thiết lập mặc định.

Đặt tên thư mục cho child theme
Đặt tên folder cho child theme

Trong phần tiếp theo, bạn sẽ được yêu cầu chọn cách truy cập vào bảng kiểu của parent theme.

Một lần nữa, chúng ta sẽ sử dụng thiết lập mặc định.

Chọn cách truy cập biểu định kiểu parent theme
Chọn cách truy cập biểu định kiểu parent theme

Khi bạn đến Section 7, bạn cần nhấp vào nút được đánh dấu ‘Click to Edit Child Theme Attributes’.

Sau đó, bạn có thể điền vào các chi tiết cho child theme của bạn.

Nhấp để chỉnh sửa thuộc tính child theme
Nhấp để chỉnh sửa thuộc tính child theme

Khi tạo một child theme thủ công, bạn sẽ mất các menu và widget của parent theme. Child Theme Configurator có thể sao chép chúng từ parent theme sang child theme.

Đánh dấu hộp Section 8 nếu bạn muốn thực hiện điều này.

Nhấp vào nút để tạo Child Theme mới của bạn
Nhấp vào nút để tạo child theme mới của bạn

Cuối cùng, nhấp vào nút để tạo child theme mới của bạn. Plugin sẽ tạo một folder cho child theme của bạn và thêm các file style.css và functions.php bạn sẽ sử dụng để tùy chỉnh theme sau này.

Trước khi kích hoạt theme, bạn nên nhấp vào liên kết ở gần đầu màn hình để xem trước và đảm bảo nó trông tốt và không làm hỏng trang web của bạn.

Xem trước theme child trước khi kích hoạt
Xem trước theme child trước khi kích hoạt

Nếu mọi thứ hoạt động đúng, hãy nhấp vào nút ‘Activate & Publish’.

Bây giờ, child theme của bạn sẽ được kích hoạt.

Nhấp vào nút Activate & Publish
Nhấp vào nút Activate & Publish

Ở giai đoạn này, child theme sẽ trông và hoạt động chính xác như parent theme. Tiếp theo, chúng ta sẽ bắt đầu tùy chỉnh nó.

Tùy chỉnh child theme của bạn

Bây giờ chúng ta sẽ tùy chỉnh child theme để nó trông khác một chút so với parent theme. Chúng ta làm điều này bằng cách thêm code vào filestyle.css và điều này yêu cầu bạn có một chút hiểu biết về CSS.

Bạn có thể đơn giản hóa quá trình này bằng cách sao chép và sửa đổi code hiện có từ parent theme. Bạn có thể tìm code đó bằng cách sử dụng công cụ Inspect trong Google Chrome hoặc Firefox, hoặc sao chép trực tiếp từ file style.css của parent theme.

Phương pháp 1: Sao chép code từ Inspect trong Chrome hoặc Firefox

Cách dễ nhất để khám phá code CSS mà bạn cần chỉnh sửa là sử dụng các công cụ inspect đi kèm với Google Chrome và Firefox. Những công cụ này cho phép bạn nhìn vào code HTML và CSS phía sau bất kỳ phần tử nào trên trang web.

Ví dụ, nếu bạn muốn xem code CSS được sử dụng cho phần thân (body) của bài viết, bạn chỉ cần di chuột qua phần thân bài viết và nhấp chuột phải để chọn “Inspect”.

Nhấp chuột phải và chọn "Inspect"
Nhấp chuột phải và chọn “Inspect”

Điều này sẽ chia màn hình trình duyệt thành hai phần. Ở phía dưới màn hình, bạn sẽ thấy code HTML và CSS của trang web.

Tùy thuộc vào thiết lập trình duyệt của bạn, code HTML và CSS có thể hiển thị ở phía bên phải màn hình thay vì phía dưới.

Bạn sẽ thấy mã HTML và CSS của trang
Bạn sẽ thấy code HTML và CSS của trang

Khi bạn di chuột qua các dòng code HTML khác nhau, trình kiểm tra của Chrome sẽ làm nổi bật chúng trong cửa sổ trên cùng. Nó cũng sẽ hiển thị các quy tắc CSS liên quan đến phần tử đang được làm nổi bật.

Bạn có thể thử chỉnh sửa code CSS ngay tại đó để xem nó sẽ trông như thế nào. Hãy thử thay đổi màu nền của phần thân (body) thành #fdf8ef.

Thay đổi màu nền
Thay đổi màu nền

Bạn sẽ thấy màu nền trang web thay đổi, nhưng thay đổi này chỉ là tạm thời.

Để làm cho nó thay đổi vĩnh viễn, bạn cần sao chép quy tắc CSS này và dán vào file style.css của child theme của bạn.

body {
background-color: #fdf8ef;
}

Lưu các thay đổi bạn đã thực hiện vào file style.css và sau đó preview trang web của bạn.

Bạn có thể tiếp tục lặp lại quá trình này cho đến khi giao diện đúng theo mong muốn của bạn. Mọi thứ bạn muốn thử nghiệm thì bạn có thể sửa đổi code trong file này.

Dưới đây là toàn bộ stylesheet đã được tạo cho child theme, tham khảo nhé!

Theme Name:   WPB Child Theme
Theme URI:    https://www.vietnix.vn/
Description:  A Twenty Twenty-One child theme
Author:       Vietnix
Author URI:   https://www.vietnix.vn
Template:     twentytwentyone
Version:      1.0.0
Text Domain:  twentytwentyonechild
*/
 
.site-title {
color: #7d7b77;
}
.site-description {
color: #aba8a2;
}
body {
background-color: #fdf8ef;
color: #7d7b77;
}
.entry-footer {
color: #aba8a2;
}
.entry-title {
color: #aba8a2;
font-weight: bold;
}
.widget-area {
color: #7d7b77;
}

Phương pháp 2: Sao chép code từ file style.css của parent theme

Bạn cũng có thể sao chép một số code trực tiếp từ file style.css của chủ parent theme. Sau đó, bạn có thể dán nó vào file style.css của child theme và chỉnh sửa nó.

Điều đó đặc biệt hữu ích khi sử dụng Twenty Twenty-One làm parent theme vì nó sử dụng rộng rãi các biến CSS (CSS variables).

Ví dụ, khi chúng ta đã chỉnh sửa màu nền trang trên, code gốc như sau:

background-color: var(--global--color-background);

Ở đây, “–global–color-background” là một biến. Biến này có thể được sử dụng ở nhiều vị trí khác nhau trong toàn bộ theme. Để thay đổi màu sắc tại tất cả những vị trí đó cùng một lúc, bạn chỉ cần thay đổi giá trị của biến.

Bạn cần di chuyển đến folder /wp-content/themes/twentytwentyone trong folder cài đặt WordPress của bạn và sau đó mở file style.css bằng trình soạn thảo văn bản. Sau đó, bạn có thể tìm vị trí nơi “–global–color-background” được định nghĩa.

--global--color-background: var(--global--color-green);


Chúng ta phát hiện ra rằng biến này được định nghĩa bởi một biến khác!

Thực tế, trong phần :root của file style.css của parent theme, chúng ta tìm thấy một loạt biến màu đã được định nghĩa. Đây là bảng màu mà theme Twenty Twenty-One sử dụng.

:root {
--global--color-black: #000;
--global--color-dark-gray: #28303d;
--global--color-gray: #39414d;
--global--color-light-gray: #f0f0f0;
--global--color-green: #d1e4dd;
--global--color-blue: #d1dfe4;
--global--color-purple: #d1d1e4;
--global--color-red: #e4d1d1;
--global--color-orange: #e4dad1;
--global--color-yellow: #eeeadd;
--global--color-white: #fff;
}

Khi bạn đã chọn một bảng màu hoàn hảo cho trang web WordPress của mình, các biến này sẽ giúp bạn tùy chỉnh nhanh chóng child theme của mình.

Bạn chỉ cần sao chép code đó và dán vào file style.css của child theme. Sau đó, bạn cần thay thế code màu bằng những code màu mới mà bạn đã chọn cho bảng màu riêng của mình.

Những màu sắc đó sau đó sẽ tự động được sử dụng ở nhiều nơi trong child theme của bạn. Điều này không chỉ nhanh chóng mà còn làm cho màu sắc của theme của bạn thống nhất hơn.

Bạn cũng có thể làm điều tương tự với các biến khác. File style.css của Twenty Twenty-One liệt kê các biến cho các họ và cỡ chữ, tiêu đề, khoảng cách giữa dòng và nhiều hơn thế nữa. Bạn có thể sao chép bất kỳ trong số này vào file style.css mới của mình, nơi bạn có thể tùy chỉnh chúng.

Chỉnh sửa các file mẫu

Mỗi theme WordPress có một bố cục khác nhau. Ví dụ, theme Twenty Twenty-One có một tiêu đề, vòng lặp nội dung, Widgets chân trang và chân trang.

Twenty Twenty-One Theme Layout
Twenty Twenty-One Theme Layout

Mỗi phần được xử lý bởi một file khác nhau trong folder twentytwentyone. Những file này được gọi là các file mẫu.

Thường thì các file mẫu được đặt tên theo khu vực mà chúng được sử dụng. Ví dụ, khu vực chân trang thường được xử lý bởi file footer.php, và các khu vực tiêu đề và điều hướng được xử lý bởi file header.php.

Layout website phổ biến
Layout website phổ biến

Một số khu vực, như khu vực nội dung, có thể được xử lý bởi nhiều file gọi là các mẫu nội dung.

Nếu bạn muốn sửa đổi một file mẫu, bạn đầu tiên tìm file đó trong folder parent theme và sao chép nó vào folder child theme. Sau đó, bạn nên mở file đó bằng một trình soạn thảo văn bản và thực hiện các sửa đổi bạn muốn.

Trong hướng dẫn này, chúng ta sẽ sao chép file footer.php từ parent theme sang folder child theme. Khi bạn đã làm điều đó, bạn cần mở file bằng một trình soạn thảo văn bản đơn giản như Notepad.

Ví dụ, chúng ta sẽ loại bỏ liên kết ‘Proudly powered by WordPress’ khỏi khu vực footer và thêm thông báo bản quyền vào đó. Để làm điều đó, bạn nên xóa tất cả nội dung giữa các thẻ <div class= "powered-by">.

<div class="powered-by">
<?php
printf(
/* translators: %s: WordPress. */
esc_html__( 'Proudly powered by %s.', 'twentytwentyone' ),
'<a href="' . esc_url( __( 'https://wordpress.org/', 'twentytwentyone' ) ) . '">WordPress</a>'
);
?>
</div><!-- .powered-by -->

Sau đó, bạn cần dán code bạn tìm thấy bên dưới các thẻ đó trong ví dụ bên dưới.

<div class="powered-by">
<p>© Copyright <?php echo date("Y"); ?>. All rights reserved.</p>
</div><!-- .powered-by -->

Khi bạn lưu file và truy cập trang web WordPress của mình, bạn sẽ có thể xem thông báo bản quyền mới.

Thêm chức năng mới vào child theme của bạn

File functions.php trong một theme sử dụng code PHP để thêm tính năng hoặc thay đổi tính năng mặc định trên trang web WordPress. Nó hoạt động như một plugin cho trang web WordPress của bạn và sẽ tự động được kích hoạt cùng với theme hiện tại.

Bạn sẽ thấy rất nhiều hướng dẫn WordPress yêu cầu bạn sao chép và dán các đoạn code vào functions.php. Nhưng nếu bạn thêm code vào parent theme, nó sẽ bị ghi đè mỗi khi bạn cài đặt bản cập nhật mới cho theme.

Đó là lý do tại sao Vietnix đề xuất sử dụng một child theme khi thêm các đoạn code tùy chỉnh. Trong hướng dẫn này, Vietnix sẽ thêm một Widgets mới vào theme.

Chúng ta có thể làm điều đó bằng cách thêm đoạn code này vào file functions.php của child theme. Bạn cũng có thể sử dụng plugin để thêm code tùy chỉnh trong WordPress, điều đó có nghĩa là bạn sẽ không cần chỉnh sửa file functions:

<?php
// Register Sidebars
function custom_sidebars() {
 
$args = array(
'id'            => 'custom_sidebar',
'name'          => __( 'Custom Widget Area', 'text_domain' ),
'description'   => __( 'A custom widget area', 'text_domain' ),
'before_title'  => '<h3 class="widget-title">',
'after_title'   => '</h3>',
'before_widget' => '<aside id="%1$s" class="widget %2$s">',
'after_widget'  => '</aside>',
);
register_sidebar( $args );
 
}
add_action( 'widgets_init', 'custom_sidebars' );
?>


Sau khi bạn lưu file, bạn có thể truy cập trang Appearance > Widgets trong bảng điều khiển WordPress của bạn.

Ở đây, bạn sẽ thấy Widgets tùy chỉnh mới của bạn.

Custom Widget Area mới
Custom Widget Area mới

Bạn có thể tìm hiểu thêm về cách thêm Widgets trong hướng dẫn của Vietnix về cách thêm các Widgets và thanh bên động trong WordPress.

Còn rất nhiều tính năng khác bạn có thể thêm vào theme của mình bằng cách sử dụng các đoạn code tùy chỉnh. Hãy xem các mẹo vô cùng hữu ích khác cho file functions của WordPress.

Xử lý sự cố

Nếu bạn chưa bao giờ tạo child theme trước đây, có khả năng bạn sẽ mắc một số sai lầm. Đừng nản lòng quá nhanh. Bạn có thể xem 12 cách sửa lỗi WordPress của Vietnix để tìm cách khắc phục.

Các lỗi phổ biến nhất code bạn có thể gặp là lỗi cú pháp do một số thứ bạn bỏ sót trong mã. Bạn sẽ tìm được sự trợ giúp để giải quyết các vấn đề này trong hướng dẫn nhanh của Vietnix về cách tìm và sửa lỗi cú pháp trong WordPress.

Nếu có vấn đề gì xảy ra, bạn luôn có thể bắt đầu lại từ đầu. Ví dụ, nếu bạn tình cờ xóa phần gì đó mà theme của bạn yêu cầu, bạn có xóa file đó khỏi child theme của bạn và bắt đầu lại từ đầu một cách đễ dàng.

Lời kết

Vietnix hy vọng hướng dẫn này đã giúp bạn học cách tạo child theme trong WordPress. Bạn cũng có thể muốn tìm hiểu cách chọn trình tạo trang web tốt nhất hoặc xem danh sách các plugin WordPress cần thiết để phát triển trang web của bạn.

Chia sẻ lên

Theo dõi trên

Logo Google new

Đánh giá

5/5 - (51 bình chọn)

Hoàng Vui

Kết nối với mình qua

Icon Quote
Icon Quote
Đăng ký nhận tin
Để không bỏ sót bất kỳ tin tức hoặc chương trình khuyến mãi từ Vietnix

Bình luận

Chỉ số tăng trưởng

Điểm Desktop

100 (+39)

Điểm Mobile

100 (+67)

Core Web Vitals

Passed

Lĩnh vực

Ecommerce

Chỉ số tăng trưởng

Điểm Desktop

99 (+28)

Điểm Mobile

100 (+50)

Core Web Vitals

Passed

Lĩnh vực

SEO

Chỉ số tăng trưởng

Điểm Desktop

99 (+26)

Điểm Mobile

98 (+59)

Core Web Vitals

Passed

Lĩnh vực

Ecommerce

Chỉ số tăng trưởng

Điểm Desktop

100 (+8)

Điểm Mobile

98 (+35)

Core Web Vitals

Passed

Lĩnh vực

Giáo Dục

Chỉ số tăng trưởng

Điểm Desktop

100 (+61)

Điểm Mobile

100 (+61)

Core Web Vitals

Passed

Lĩnh vực

Giáo Dục

Võ Thiên Tòng

25 Tháng 2 lúc 21:09

·

Mình muốn gửi lời cảm ơn chân thành đến Team Vietnix, anh Hưng Nguyễn, anh Vietnix Trung, em Quốc Huy đã hỗ trợ tối ưu Page Speed Insight (PSI) cho website vanvoiminhhoa.vn của mình.
Biết đến anh Hưng đã lâu nhưng chưa có duyên sử dụng dịch vụ bên anh. Tình cờ thấy được bài Post của anh về việc hỗ trợ tối ưu PSI miễn phí chỉ với vài Slot, thấy AE cmt khá nhiều nên cũng không nghĩ tới lượt mình. Hôm sau đánh liều inbox 1 phen xem sao thì may mắn được đưa vào danh sách. Vài ngày sau được Team Vietnix liên hệ và hỗ trợ.
Kết quả đạt được:
• Điểm xanh lè xanh lét
• Tốc độ tải trang nhanh hơn hẳn
• Các chỉ số cũng được cải thiện đáng kể
• Và mình tin rằng với việc PSI được cải thiện cũng thúc đẩy những thứ khác đi lên theo!
Mình thực sự hài lòng với dịch vụ của Vietnix và muốn giới thiệu đến tất cả mọi người:
• Dịch vụ Wordpress Hosting: Tốc độ nhanh, ổn định, bảo mật cao, hỗ trợ kỹ thuật 24/7. (https://vietnix.vn/wordpress-hosting/)
• Dịch vụ Business Hosting: Dung lượng lớn, phù hợp cho website có lượng truy cập cao, tích hợp nhiều tính năng cao cấp. (https://vietnix.vn/business-hosting/)
Đặc biệt, Vietnix đang có chương trình ưu đãi:
• Giảm giá 20% trọn đời khi nhập code THIENTONG_PAGESPEED tại trang thanh toán (Chu kỳ 12 tháng trở lên)
• Tặng 1 lần tối ưu điểm Page Speed Insight cho 1 website
Cám ơn Vietnix một lần nữa!
#Vietnix #Vanvoiminhhoa #Pagespeedinsight
Trước khi tối ưu
Sau khi tối ưu
Thiện Nguyễn - CEO SEO Dạo

5 Tháng 3 lúc 16:21

·

CORE WEB VITAL YẾU TỐ XẾP HẠNG TÌM KIẾM SEO
Core Web Vitals là một tập hợp các chỉ số đo lường hiệu suất của trang web từ góc độ người dùng, được Google sử dụng để đánh giá trải nghiệm người dùng trên các trang web. Các chỉ số chính bao gồm:
– Largest contentful paint (LCP): Tốc độ render của page. Mục tiêu là dưới 2,5 giây.
– First input delay (FID): Tốc độ phản hồi của website với tương tác của người dùng. Mục tiêu là dưới 100ms.
– Cumulative Layout Shift (CLS): Độ ổn định của bố cục trang. Mục tiêu là dưới 0.1.
Tất cả các chỉ số này đo lường các khía cạnh quan trọng của trải nghiệm người dùng trên trang web. Google đã công bố rằng từ tháng 5 năm 2021, các Core Web Vitals sẽ được sử dụng làm một trong các yếu tố đánh giá trong việc xếp hạng trang web trên kết quả tìm kiếm. Do đó, hiểu và cải thiện các Core Web Vitals là rất quan trọng đối với SEO.
Tóm lại, Core Web Vitals không chỉ giúp cải thiện hiệu suất và xếp hạng trang web trên công cụ tìm kiếm, mà còn cải thiện trải nghiệm của người dùng khi họ truy cập và tương tác với trang website.
P/s: mình đang có gói hỗ trợ đặc biệt cho anh em tối ưu tốc độ bên VIETNIX:
– Giảm 20% lifetime dịch vụ Hosting Business và Hosting Wordpress chu kỳ 12 tháng trở lên.
– Tặng 1 lần tối ưu điểm Page Speed Insight cho 1 website.
Anh em có nhu cầu đăng ký qua bạn Vietnix Trung này nhé và nhập mã SEODAO_PAGESPEED để được ưu đãi nhé.😁
Trước khi tối ưu
Sau khi tối ưu SEO Dạo
Icharm review

5 Tháng 3 lúc 15:43

·

[Mình vừa được hỗ trợ tối ưu page speed website]
Trước khi được tối ưu, web của mình điểm rất thấp, đặc biệt là mobile chỉ có 39. Cơ duyên thế nào lúc lướt face lại va phải chương trình tối ưu pagespeed bên Vietnix.
Sau khi được Trần Hoàng Phúc và team Vietnix hỗ trợ nhiệt tình, điểm web vọt lên 98 99 (như hình bên dưới). Dùng thử web thì thấy quá là mượt, 10 điểm cho team Vietnix.
Nói thật thì mình thật sự ấn tượng về sự nhiệt huyết, tận tâm và rất chuyên nghiệp bên Vietnix.
Anh em có nhu cầu về hosting hay có vấn đề về website như:
1. Web load chậm
2. Khách rời web vì đợi tải nội dung, hình ảnh lâu
3. Hay tất tần tật mọi thứ về website
THÌ LIÊN HỆ NGAY VIETNIX NHÉ!
Và đừng quên dùng pass “ICHARM_PAGESPEED” để được giảm 20% trọn đời hosting business và wp hosting. Quả code này còn được tặng 1 lần tối ưu pagespeed nữa nhé, ưu đãi chắc cũng phải nhất nhì thị trường luôn.
Trước khi tối ưu
Sau khi tối ưu
Hoàng Nguyễn

29 Tháng 2 lúc 17:04

·

Xin chào mọi người! Vừa rồi mình có sử dụng dịch vụ tối ưu website, tăng tốc độ tải trang pagespeed của Vietnix kết quả trên cả tuyệt vời nên mình viết bài này để chia sẻ thông tin với các bạn.
Lý do mình chọn dịch vụ tối ưu tốc độ website của Vietnix:
✅ Đội ngũ chuyên gia giàu kinh nghiệm: Đã tối ưu thành công cho hàng nghìn website trong nhiều lĩnh vực khác nhau. Các bạn nhân viên rất thân thiện, nhiệt tình và chủ động trong quá trình làm việc để cập nhật tiến độ.
✅ Quy trình chuyên nghiệp:
– Kiểm tra và phân tích: Vietnix sử dụng các công cụ tiên tiến để kiểm tra và phân tích tốc độ website của bạn.
– Xác định nguyên nhân: Vietnix xác định nguyên nhân khiến website tải chậm và đưa ra giải pháp tối ưu phù hợp.
– Tối ưu hóa website: Vietnix áp dụng các kỹ thuật tối ưu tiên tiến nhất để tăng tốc độ tải trang.
– Báo cáo kết quả: Vietnix cung cấp báo cáo chi tiết về kết quả tối ưu hóa website.
Công nghệ tiên tiến: Vietnix sử dụng các công nghệ tối ưu mới nhất như LiteSpeed, LSCache, Memcached, Redis, v.v.
✅ Cam kết kết quả: Vietnix cam kết tăng tốc độ website của bạn lên tối thiểu 90%.
✅ Giá cả cạnh tranh: Vietnix cung cấp dịch vụ tối ưu tốc độ website với mức giá cạnh tranh nhất trên thị trường.
📣 Để đăng ký sử dụng dịch vụ tối ưu tốc độ website và các dịch vụ khác như hosting, vps, domain… các bạn có thể đăng ký tại https://portal.vietnix.vn/aff.php?aff=57 hoặc Inbox cho sếp Vietnix Trung nhé.
Các bạn có thể kiểm tra tốc độ trang của mình https://lasan.edu.vn hoặc một vài trang khác đã sử dụng dịch vụ của Vietnix như sau:
https://pagespeed.web.dev/…/https…/v8beqewyt2…
https://pagespeed.web.dev/…/https…/etiohjvtl4…
https://pagespeed.web.dev/…/https…/yczuqpw6d1…
https://pagespeed.web.dev/…/https…/xf9y65kuzk…
https://pagespeed.web.dev/…/https…/fdrsms15en…
https://pagespeed.web.dev/…/https…/s7p9cgzeri…
Trước khi tối ưu
Sau khi tối ưu
Dũng cá xinh

30 Tháng 1 lúc 19:09

·

[Đỉnh]
Em có dùng hosting, vps, cloud vps, cloud server, dedicated server của rất nhiều bên từ trong nước đến nước ngoài để hosting khoảng 2,000+ domain. Mỗi bên đều có ưu nhược khác nhau, nhưng có 1 số bên đặc biệt “bá đạo”, trong đó có: Vietnix!!!!

Lần đầu tiên em được cả CEO Hưng Nguyễn lẫn Master về dev Vietnix Trung của 1 đơn vị hàng đầu liên quan đến Hosting, Server support từ A – Z (từ Zalo, Tele, đến FB và cả Phone)

Em có khá nhiều web dạng Big Data (bài, ảnh, database, data) lên đến hàng trăm Gb. Càng to thì nó càng có nhiều vấn đề về phần phản hồi ban đầu (nhược điểm cố hữu của php wordpress so với nativejs, reactjs, html, headless,…), và anh em Vietnix có nhã ý hỗ trợ xử lý phần Speed Insight này.

Kết quả thực sự kinh ngạc, từ cách trao đổi đến xử lý vấn đề, cut off những cái cần cut off, xử lý rất sâu vấn đề và gợi ý rất nhiều ý tưởng optimize hệ thống!!!! Thực sự quá hài lòng về kết quả cũng như cách tương tác của các đầu tầu bên Vietnix ^^!!!

Nhân cơ duyên được kết nối với những cao thủ của Vietnix, em xin chia sẻ và lan tỏa để nhiều anh em có cơ hội được sử dụng những dịch vụ tốt nhất với giá vô cùng hợp lý!!!!

1 – Với anh em chưa có hosting, em đặc biệt recommend sử dụng hosting bên Vietnix:
– Sử dụng mã DUNGCAXINH_PAGESPEED sẽ được giảm 20% trọn đời (lifetime luôn)
– Áp dụng các gói Hosting Business, Hosting wordpress và reg 1 năm trở lên
– Anh em chưa biết cách reg thì còm men hoặc ib để em hướng dẫn hoặc nhờ các bạn bên Vietnix support từ A – Z

2 – Anh em có hosting rồi và muốn build blog hoặc web = wordpress mà chưa có giao diện thì nhân tiện em đang có tài khoản Premium bên Envato, em sẽ tặng bất kỳ giao diện nào có trên Envato Themes (Link em để dưới còm men) ạ. Cả nhà còm hoặc ib em Themes mà mọi người “chim ưng”, em sẽ cho anh em tải về, up drive và gửi ạ!!! (Chương trình này kéo dài đến ngày 29 tết âm lịch ạ)

3 – BEST NHẤT luôn!!!! Anh em nào mua hosting dùng mã DUNGCAXINH_PAGESPEED sẽ được tối ưu 100 điểm tốc độ cho 1 web (đây là ưu đãi riêng của CEO Hưng Nguyễn dành cho bạn bè của #dungcaxinh ^^) (Giá trị nhất là cái vụ số 3 này anh chị em nhé ^^), cơ hội vàng để move về đơn vị hosting uy tín là đây ^^!!!!

Một lần nữa xin chân thành cám ơn 2 đồng chí em: Hưng Nguyễn và Vietnix Trung đã giải được một bài toán khó cho các trang WP Big data mà anh loay hoay bao lâu nay chưa tìm ra đáp án!!! Chúc Vietnix ngày càng phát triển và có một năm 2024 đại đại thắng nhé ^^ !!!!!
#SEO #Vietnix #dungcaxinh

Trước khi tối ưu
Sau khi tối ưu
Hiếu AI

2 Tháng 2 lúc 21:06

·

UY TÍN – TẬN TÂM – TỐC ĐỘ

3 từ trên là vẫn chưa đủ để nói về quy trình làm việc cực chuyên nghiệp của team Vietnix.Chuyện là mình có con website chính đang có lượt truy cập organic hàng ngày cũng tương đối (hình 1)

Vấn đề là, con site này đang nằm trên hosting dùng chung nên tốc độ load chưa nhanh, tốc độ load chưa nhanh thì trải nghiệm visitor chưa tốt, trải nghiệm visitor chưa tốt thì tỷ lệ chuyển đổi ra đơn hàng kiểu gì thì kiểu cũng sẽ bị ảnh hưởng.

Biết rõ là đang mất tiền nhưng không biết xử lý như lào, nghĩ mà cay.

Đang loay hoay thì vận may nó tới, hôm qua đang lướt phở bò thấy a Nguyễn Việt Dũng đăng bài, rảnh nên thả cái comment hóng hớt, ai ngờ ngoằng phát thấy ông Dũng tạo nhóm với Vietnix Trung luôn.

Ae Vietnix thì siêu tốc độ, lập tức lấy thông tin vào việc, không hỏi han lằng nhằng, không kỳ kèo chốt đơn dù lúc đấy cũng đang đêm muộn.
Sáng hôm sau dậy vẫn còn đang lơ ngơ mở điện thoại check tin nhắn thì đã thấy ae Vietnix báo xong việc, trong khi mình vẫn chưa biết có chuyện gì xảy ra @@.

Được cái bấm thử website thì thấy load siêu nhanh, chưa tới một giây là thông tin các thứ hiện hết. Quá phê, thả con ảnh trước sau (hình 2,3) để ace tiện đối chiếu nhé. Thế này thì mình gửi gắm nốt 15 em website còn lại cho team Vietnix thôi chứ không cần nghĩ ngợi gì nữa. 10/10.

Nên là:

  1. Anh chị em muốn có một con website tốc độ load nhanh như tốc độ trở mặt của nyc – Dùng ngay dịch vụ hosting của Vietnix
  2. Anh chị em có website rồi muốn tìm bên hosting uy tín, chuyên nghiệp hỗ trợ không quản ngày đêm – Liên hệ ngay Vietnix Trung
  3. Anh chị em quan tâm đến trải nghiệm khách hàng, từ những cái nhỏ nhất như tăng tốc độ website – Better call Vietnix Trung

Và đừng quên dùng pass “HIEUAI_PAGESPEED” để được giảm 20% trọn đời hosting business và wp hosting, quả code này còn được tặng 1 lần tối ưu pagespeed nữa nhé, ưu đãi chắc cũng phải nhất nhì thị trường luôn.
#SEO #Vietnix #hieuai

Website
Trước khi tối ưu
Sau khi tối ưu

Chỉ số tăng trưởng

Điểm Desktop

100 (+43)

Điểm Mobile

100 (+74)

Core Web Vitals

Passed

Lĩnh vực

AI