Chuyên mục lưu trữ: Wordpress

Chuyên mục nội dung về Wordpress

Tích hợp reCaptcha cho Contact form

Contact Form là gì?

Contact Form là một trong những form liên hệ khi sử dụng website WordPress. Tuy nhiên, khi sử dụng contact form chúng ta có thể bị spam bằng bot để gửi các thông tin mã độc theo mail. Vậy làm cách nào để xác thực người có nhu cầu thực sự??

reCAPTCHA là gì? Recaptcha là một trong những dịch vụ xác thực của Google trong đó có thể xác thực được người dùng hay bot đang hoạt động trên website của bạn.

Tích hợp reCAPTCHA vào Contact Form

Bước 1: Cài đặt Google Authenticator và tạo key tại địa chỉ https://www.google.com/recaptcha/admin#list theo hướng dẫn tại bài viết xác thực hai lớp

Bước 2: Tại trang quản trị WordPress truy cập Contact > Integration và chọn như sau:

Truy cập theo trang recaptcha ở bước 1 và lấy Site KeySecret Key dán vào Integration sau đó sẽ có thông báo reCAPTCHA is active on this site thì việc cài đặt là thành công. Sau đó, kiểm tra lại form liên hệ đã được xác thực bằng reCAPTCHA chưa nhé!

Xử lý spam index trong GSC

Spam Index là gì?

Spam Index là tình trạng google bot lập chỉ mục những URL không có trên website do các “bậc thầy SEO bẩn” thực hiện trên site của chúng ta dạng yourwebsite.com/?s=xổ số thứ năm tuần trước miền bắc 【Đi vào link∶ ….com】Nền tảng trò chơi được chỉ định của European Cup】game slot nap the Khuyến mãi 【Mở Link∶ ….com】Hoàn trả mỗi ngày, nhận gói quà cho lần gửi tiền đầu tiên】3yui1i1y3

Phần lớn các nội dung này được tạo hoàn toàn tự động bởi bot chứ không phải con người. Để xem site có bị spam hay không vào https://search.google.com/ > Lập chỉ mục > Trang > Đã thu thập dữ liệu – hiện chưa được lập chỉ mục

Tác hại Spam Index

Việc spam index có nhiều tác hại trong đó phải kể đến như:
– Lãng phí tài nguyên của google bot khi thu thập dữ liệu trên site
– Site bị spam index trong khung tìm kiếm làm google hiểu nhầm nội dung site dẫn tới có hại cho SEO (do google hiểu nhầm là site cờ bạc, cá cược…)

Cách xử lý spam index

Để xử lý, các bạn chọn xóa URL tạm thời cho các index spam. Sau đó disallow trong robots.txt như sau:

Disallow: *?* – chặn index dạng dấu chấm hỏi

Disallow: /?s=* – chặn index trang tìm kiếm mặc định WordPress

Các bạn có thể làm tương tự với một số trường hợp khác. Sau đó, bạn có thể kiểm tra các lỗi này đã được khắc phục hay chưa.

Gỡ bỏ AMP khỏi website

AMP là gì?

AMP Project (Accelerated Mobile Pages) là trang dành cho thiết bị di động. Theo đó, khi sử dụng AMP, website sẽ được lưu trên phiên bản AMP của google và load trang gần như ngay lập tức. Tuy nhiên, trong một số trường hợp giao diện AMP tương đối nghèo nàn không phù hợp với nhiều website. Khi đó, việc gỡ bỏ AMP là cần thiết. Tuy nhiên, hậu quả để lại là nhiều trang 404 dang tenwebsite.com/bai-viet/amp

Cách gỡ AMP có ảnh hưởng tới thứ hạng?

Theo như John Mu việc gỡ AMP hoàn toàn không ảnh hưởng tới thứ hạng. Tuy nhiên, cần chắc chắn rằng trang được điều hướng một cách hợp lý. Sau đây sẽ là hướng dẫn cụ thể để loại bỏ AMP

Gỡ bỏ AMP và Redirect

Để gỡ bỏ AMP và Redirect nội dung các bạn có thể thực hiện bằng file .htaccess hoặc Plugin Redirection.

1. Với htaccess chèn như sau


# Redirect AMP URLs to non-AMP URLs
RewriteRule (.*)/AMP$ $1 [NC,R=301,L]

Code này sẽ giúp Redirect các trang dạng tenwebsite.com/bai-viet/amp về tenwebsite.com/bai-viet/

2. Sử dụng Plugin Redirection sau đó đặt như sau:

Source URL: /(.*)\/amp

Target URL: https://yourdomain.com/$1

Chọn mục Regex và Add Redirect

Ngoài ra còn có nhiều Plugin Redirect khác như Yoast Seo (bản Pre)…Tuy nhiên, chỉ với hai cách trên là các bạn có thể thực hiện được một cách đơn giản rồi.

Tạo bài viết liên quan cho WordPress

Bài viết liên quan là gì?

Bài viết liên quan là các bài viết cùng tag hoặc cùng chủ để trong website để điều hướng và trải nghiệm người dùng trong website của bạn. Điều này sẽ giúp website của bạn có thông tin rõ ràng hơn và trở lên uy tín trong mắt google khi SEO. Vậy tạo bài viết liên quan như thế nào? Trong bài này Học Khôn sẽ hướng dẫn cách thức tạo bài viết liên quan

Code bài viết liên quan WordPress

Để thực hiện code này các bạn phải nắm được một chút về WordPress. Theo đó, các bạn có thể lưu lại theme trước xử lý lý hoặc sử dụng Child Theme tránh làm hỏng Website

1. Code lấy bài viết liên quan theo chuyên mục

<?php
$categories = get_the_category($post->ID);
if ($categories) 
{
$category_ids = array();
foreach($categories as $individual_category) $category_ids[] = $individual_category->term_id;
$args=array(
'category__in'   => $category_ids,
'post__not_in'   => array($post->ID), //Bỏ qua bài viết hiện tại
'posts_per_page' =>5, // Số bài viết bạn muốn hiển thị.
'caller_get_posts'=>1,
'no_found_rows'   =>true //Bỏ qua load phân trang tăng hiệu suât query
);
$my_query = new wp_query($args);
if( $my_query->have_posts() ) 
{
echo '<h3>Bài viết liên quan</h3><ul class="list-news">';
while ($my_query->have_posts())
{
$my_query->the_post();
?>
<li>
<div class="new-img"><a href="<?php the_permalink(); ?>"><?php the_post_thumbnail(array(85, 75)); ?></a></div>
<div class="item-list">
<h4><a href="<?php the_permalink() ?>" title="<?php the_title_attribute(); ?>"><?php the_title(); ?></a></h4>
<?php the_excerpt(); ?>
</div>
</li>
<?php
}
echo '</ul>';
}
}
?>

2. Code lấy bài viết liên quan theo Tag

<!-- Hiển thị bài viết theo Tag -->
<div id="relatedposttags">    
<?php
$tags = wp_get_post_tags($post->ID);
if ($tags) 
{
$tag_ids = array();
foreach($tags as $individual_tag) $tag_ids[] = $individual_tag->term_id;
// lấy danh sách các tag liên quan
$args=array(
'tag__in' => $tag_ids,
'post__not_in' => array($post->ID), // Loại trừ bài viết hiện tại
'posts_per_page'=>5, // Số bài viết bạn muốn hiển thị.
'caller_get_posts'=>1
);
$my_query = new wp_query($args);
if( $my_query->have_posts() ) 
{
echo '<h3>Bài viết liên quan</h3><ul>';
while ($my_query->have_posts()) 
{
$my_query->the_post();
?>
<li><a href="<?php the_permalink() ?>" title="<?php the_title(); ?>"><?php the_title(); ?></a></li>
<?php
}
echo '</ul>';
}
}
?>
</div>

Các bạn có thể chèn code trên vào file single.php hoặc file tương ứng trong theme để lấy bài viết liên quan.

Cách lấy ảnh ngoài làm Featured Image (Thumbnail)

Featured Image (Thumbnail) là gì?

Featured Image (Thumbnail) tiếng anh có nghĩa là “hình nhỏ” là một trong những ảnh đại diện của bài viết trên website khi các bạn post link lên facebook hoặc ảnh bài viết khi vào trang chủ của website. Tại wordpress còn gọi là featured image

Ví dụ về Thumbnail khi đăng bài trên Facebook
Ví dụ về Thumbnail khi đăng bài trên Facebook

Featured Image (Thumbnail) trong WordPress: Đối với các bạn sử dụng WordPress, ảnh Thumbnail thường là ảnh được up lên hosting. Tuy nhiên, wordpress có một vấn đề là khi up ảnh thường bị resize ra nhiều kích cỡ. Vì vậy, nếu muốn dùng ảnh ngoài dùng làm thumbnail thì làm như thế nào? Trong bài này Học Khôn sẽ hướng dẫn các bạn cách tạo thumbnail sử dụng link ảnh bên ngoài.

Cách tạo thumbnail sử dụng link ảnh bên ngoài

Để sử dụng thumbnail dùng ảnh ngoài ta có nhiều cách đó là tự code hoặc sử dụng plugin cho WordPress.

Cách 1: Dùng code để thay thế hàm the_post_thumbnail() của wordpress bằng link ảnh đầu tiên trong bài viết bằng cách chèn đoạn code sau vào functions.php

function get_first_image() {
global $post, $posts;
$first_img = ”;
ob_start();
ob_end_clean();
$output = preg_match_all(‘/\’”[\’”].*>/i’, $post->post_content, $matches);
$first_img = $matches[1][0];
if(empty($first_img)) {
$first_img = “/path/to/default.png”;
}
return $first_img;
}

Sau khi chèn xong, chúng ta tìm trong theme phần the_post_thumbnail() và thay thế bằng đoạn code sau:

[html]
<img src=”<?php echo get_first_image(); ?>” alt=”<?php the_title(); ?>” />
[html]

Phần thay thế thường là tại phần nội dung bài viết là file single.php hoặc các file khác tùy theme mà các bản sử dụng.

Cách 2: Dùng plugin Featured Image from URL (FIFU). Hiện tại Học Khôn đang dùng plugin này để chọn Featured Image (Thumbnail) link ngoài. Các bạn có thể tham khảo nếu không biết code nhé!

Cố định Widget (fixed Widget) khi cuộn trang

Widget là gì?

Widgets dịch từ tiếng anh là “những ứng dụng nhỏ” được sử dụng trên nhiều nền tảng khác nhau. Tại website sử dụng wordpress, Widgets là những mục mà người dùng có thể thêm vào theo sắp xếp của website thường là sidebar trong nội dung trang.

Cố định widget

Cố định widgets (hay còn gọi là Sticky Widget, Fixed Widget, Widgets trượt). Cũng là một widgets bình thường như giải thích ở trên nhưng có thể cuộn theo trang (kéo chuột xuống không bị mất đi) cho đến khi cuộn tới footer.

Việc cố định Widgets có tác dụng gây chú ý cho người dùng khi người dùng đọc nội dung và Sidebar cũng được kéo theo.

Cách tạo Sticky Widget

1. Tạo Sticky Widget bằng Plugin

Trong bài viết này, để tạo Sticky Widgets các bạn sử dụng Plugin Fixed Widget and Sticky Elements for WordPress. Cài đặt thì không cần nói lại, chỉ cần tìm trên thư viện của WordPress và cài đặt thôi. Sau khi cài đặt. Truy cập phần Admin > Widgets để chọn cố định Widgets

Chọn Fixed Widget
Chọn Fix Widget

Sau đó, chọn Fixed Widget hoặc Fix Widget như hình trên và chọn Update là các bạn đã có thể cố định Widget như mong muốn.

2. Tạo Sticky Widget không dùng Plugin

Tại cách này, các bạn bấm F12 (trên chrome) rồi tìm ID (class CSS) của Widget dự định Sticky. Sau đó chèn CSS code cố định như sau:

#id{
position: sticky;
position: -webkit-sticky;
top: 30px; }

Dán CSS trên vào file style.css của trang web của bạn hoặc qua giao diện Admin của WordPress là dược nhé! Để cụ thể hơn mình làm rõ như sau

  • #id : là ID của Widget cần cố định
  • position: sticky; position: -webkit-sticky; là CSS để cố định Widget
  • top: 30px; : Khoảng cách tới top của Website (tương tự Header)

Trường hợp này, mình mò ra, nhưng nếu để nhiều ID thì sẽ bị đè lên nhau, thế nên để mình nghiên cứu tiếp rồi viết thêm.

Xác thực hai lớp wordpress

Khi sử dụng wordpress thông thường nếu site có thứ hạng một chút có thể bị hack thường bằng brute force attack bằng cách thử các password khác nhau để truy cập vào site. Để tránh vấn đề này có thể dùng iTheme Security hoặc xác thực hai lớp với Google Authenticator. Trong bài viết này sẽ hướng dẫn các bạn cách xác thực hai lớp bằng Google Authenticator đối với website wordpress.

Tích hợp Google Authenticator

1. Cài đặt Plugin Google Authenticator

Đầu tiên, hãy truy cập website của bạn > wp-admin > plugins > Add New. Trong khung tìm kiếm nhập vào Google Authenticator và bấm Install Now.

Sau đó truy cập Users > Profile bạn sẽ thấy bảng sau:

  • Active. Kích hoạt chức năng xác thực hai lớp
  • Relaxed mode: Relaxed mode kéo dài thời gian nhập mã xác thực thêm 4 phút. Sau 4 phút nếu không nhập mã xác thực thì mã sẽ bị vô hiệu hóa
  • Description: Mô tả website trong Google Authenticator (đặt tên để tránh nhầm với các ứng dụng khác)
  • Secret: Khóa riêng hay còn gọi là khóa bí mật để thêm tài khoản vào Google Authenticator một cách thủ công. CÒn bình thường chọn Show QR Code và quét bằng app cho nhanh
  • Enable App password: Mật khẩu ứng dụng đăng nhập cho bên thứ ba như ứng dụng…

Sau khi thay đổi các thiết lập hãy nhớ kéo xuống cuối trang và bấm nút Update Profile để lưu các thiết lập

2. Cài đặt Google Authenticator trên điện thoại

Cài đặt apps như hình sau đó mở app và chọn Scan a QR Code hoặc Enter Setup Key để quét mã QR hoặc nhập Secret Key như ở trên. Sau đó tại app sẽ hiện ra 6 số để đăng nhập. Nhập 6 số này vào phần code như hình để đăng nhập

Tích hợp reCAPTCHA cho wordpress

Để có thể không phải nhập ký tự hoặc do các bạn lười có thể nghiên cứu reCAPTCHA của google như sau:

Để sử dụng được công nghệ mới này, bạn phải truy cập vào địa chỉ https://www.google.com/recaptcha/admin#list và tạo key mới. Sau khi đăng ký và nhập domain google sẽ trả lại các bạn Site KeySecret Key. Sau khi có hai thông tin trên các bạn cài đặt Plugin Simple Google reCAPTCHA và điền thông tin và lưu lại.

Sau khi hoàn thiện, khi đăng nhập sẽ hiện như sau:

Hướng dẫn tạo website WordPress

Tạo một website hiện nay rất đơn giản. Bằng google các bạn có thể tìm kiếm hầu hết các hướng dẫn, trong đó một trong những mã nguồn mở là WordPress được dùng rất nhiều. Trong bài này tôi sẽ hướng dẫn các bạn tạo một website với wordpress.

Chuẩn bị để tạo website bằng wordpress

Để tạo website wordpress cần chuẩn bị những gì? Sau đây là một số nội dung mà các bạn cần chuẩn bị bao gồm:

Lưu ý: wordpress.com và wordpress.org cùng là wordpress nhưng wordpress.com sẽ quản lý mã nguồn của bạn (khó thay đổi) còn wordpress.org cho bạn mã nguồn có thể chỉnh sửa tùy ý.

Làm website WordPress tốn bao nhiêu tiền?

Trên thực tế làm website wordpress rất rẻ. Cụ thể:
Tiền tên miền: từ 300k tới 700k tùy tên miền/năm, thường tên miền quốc tế thì rẻ hơn nhưng nếu bị mất sẽ khó lấy lại hơn tên miền Việt Nam
Tiền hosting: Cũng rất rẻ khoảng 69k/tháng tùy dung lượng
– Mã nguồn wordpress thì miễn phí

Nói chung với các bạn yêu cầu đơn giản chỉ cần một website thì chi phí tầm 1 triệu là có thể có website với 1 năm. Tuy nhiên, để chỉnh được về hình thức website sao cho đẹp thì cần phải biết một chút về HTML và code thì mới làm được hoặc có thể thuê các coder để làm.

Các bước tạo website wordpress

Bước 1: Đăng ký domain và hosting cho website.
Như hướng dẫn ở trên khi làm website phải có host và tên miền do vậy cần phải mua hai thứ này trước khi tiến hành làm website
Bước 2: Trỏ domain về hosting
Truy cập hosting để lấy IP sau đó tiến hành trỏ domain về hosting để truy cập
Bước 3: Cài đặt wordpress
Truy cập wordpress.org tải mã nguồn wordpress sau đó tải mã nguồn lên hosting. Tạo database và admin database sau đó cài wordpress và chọn theme, plugin phù hợp với nhu cầu
Bước 4: Cài đặt Google Search Console và Google Analytic để quản lý website và theo dõi tình trạng website

Thiết lập ban đầu cho website wordpress

Làm website thì mục đích chính là giới thiệu sản phẩm và SEO, do vậy việc thiết lập ban đầu sẽ rất quan trọng và ảnh hưởng tới hướng SEO sau này. Với website wordpress thì có thể làm các công đoạn sau:

1. Thiết lập đường dẫn tĩnh cho website
Vào admin > Setting > Permalinks chọn đường dẫn phù hợp với nhu cầu như hình

Cài đặt đường dẫn tĩnh
Cài đặt đường dẫn tĩnh

2. Xóa revision wordpress
Trong wordpress có một tính năng khá hay đó là “revision”; revision là một trong những tính năng lưu lại các nội dung đã thay đổi của một bài viết khi đang soạn thảo hoặc thay đổi nội dung bài viết. Tuy nhiên nếu nhiều bài viết và có chỉnh sửa thì tính năng này sẽ tạo ra các nội dung tạm gọi là rác gây tràn bộ nhớ hosting của website. Do vậy, một số trường hợp muốn xóa tính năng này trên wordpress thì phải làm sao?

Thêm lệnh sau vào file wp-config.php trong thư mục gốc wordpress của bạn:

define(‘WP_POST_REVISIONS’, false);

Xóa các bài viết revision trên hosting: Vào Cpanel và vào Phpmyadmin chọn database website của bạn và chạy lệnh SQL sau: DELETE FROM wp_posts WHERE post_type = “revision”;

Như vậy, chỉ cần làm các bước trên là bạn đã xóa được tính năng revision trong wordpress và các bài viết vision trên website rồi nhé!