Các chuyên gia xây dựng thương hiệu thường nói về khả năng hiển thị. Nói cách khác, các yếu tố hướng tới người dùng trên trang web của bạn phải luôn phản ánh thương hiệu của bạn. Tuy nhiên, một dự án mà bạn có thể chưa cân nhắc đến là tạo icon WP cho trang của bạn.
Tin tốt là việc thiết kế và tải lên icon trang lên WordPress dễ dàng hơn bao giờ hết. Thực tế, có nhiều cách để thực hiện công việc này bất kể trình độ chuyên môn, thời gian, và ngân sách của bạn.
Trong bài viết này, chúng ta sẽ xem xét cách tạo biểu tượng trang cho trang web của bạn. Nhưng trước tiên, chúng ta sẽ tìm hiểu lý do tại sao bạn nên cân nhắc việc tạo biểu tượng trang cùng với một số cân nhắc bạn cần lưu ý.
Contents
Icon WP là gì và tại sao bạn cần một biểu tượng trang?
Chắc hẳn bạn đã từng nhìn thấy biểu tượng trang, kể cả khi bạn không chắc chúng là gì. Thực tế, bạn đã nhìn thấy một biểu tượng ngay bây giờ – hãy nhìn vào góc trái phía trên cửa sổ trình duyệt của bạn:
Nó là một biểu tượng nhỏ xuất hiện bên cạnh thẻ trang trong trình duyệt của bạn hoặc trên trang kết quả tìm kiếm (SERPs).
Bạn có thể coi nó như một quả bóng nhỏ bạn gắn vào ăng-ten xe của mình. Tuy nhiên, có một sự khác biệt giữa biểu tượng trang và 5,000 quả bóng màu sắc khác trong bãi đỗ xe của Walmart: Bạn có thể làm cho biểu tượng trang cụ thể cho thương hiệu của mình.
Khi nói đến thương hiệu của trang web, ấn tượng đầu tiên rất quan trọng. Hơn nữa, người tiêu dùng tìm đến mức độ nhất quán của thương hiệu như là một dấu hiệu đáng tin cậy. Một biểu tượng trang có thể giúp đạt được cả hai điều này.
Tất nhiên, biểu tượng trang của bạn sẽ không chịu trách nhiệm hoàn toàn cho chiến lược thương hiệu của bạn. Tuy nhiên, khả năng hiển thị mà nó mang lại – đặc biệt là khi một khách hàng tiềm năng đang duyệt trang web của bạn – có thể tạo ra tác động tích cực trong tương lai.
Cách tạo icon WP cho website của bạn (qua 3 bước)
Có hai giai đoạn trong nhiệm vụ này. Đầu tiên, bạn sẽ muốn tạo biểu tượng trang. Sau đó, bạn cần tải nó lên website WordPress của mình. Dưới đây là ba bước bạn có thể thực hiện để tạo biểu tượng trang cho trang WordPress của mình:
- Chọn kích thước biểu tượng trang phù hợp.
- Thực hiện một số phương pháp tối ưu khi thiết kế biểu tượng trang của bạn.
- Chọn công cụ phù hợp cho công việc.
Sau đó, chúng tôi sẽ hướng dẫn bạn ba cách để tải biểu tượng của mình lên:
- Sử dụng chức năng tích hợp sẵn của WordPress.
- Cài đặt plugin để tải biểu tượng của bạn lên.
- Tạo mã để tải biểu tượng trang lên.
Có nhiều thứ để thực hiện, vì vậy hãy bắt đầu!
Bước 1: Chọn kích thước phù hợp cho icon WP
Đầu tiên là kích thước biểu tượng trang của bạn. Bạn có thể nghĩ rằng các tệp này sẽ rất nhỏ. Tuy nhiên, trong khi kích thước rất nhỏ, việc hiểu các kích thước khác nhau có thể phức tạp. Điều này là do các nền tảng khác nhau có yêu cầu khác nhau về kích thước biểu tượng trang (hay còn gọi là “favicon”).
Nói chung, hầu hết các trình duyệt sẽ hỗ trợ tệp .ico kích thước 32 x 32 pixel, đây là tiêu chuẩn trong nhiều thập kỷ. Tuy nhiên, trong thực tế, bạn sẽ muốn sử dụng tệp .png kích thước 512 x 512 pixel.
Lý do là điều này bao gồm gần như tất cả các trường hợp, từ kích thước biểu tượng trang mặc định của Chrome cho đến yêu cầu tối thiểu.
Tình cờ, đây cũng là khuyến nghị rõ ràng trong phần quản trị WordPress (sẽ đề cập sau). Khi bạn đã chọn kích thước, đã đến lúc suy nghĩ về thiết kế.
Bước 2: Đảm bảo bạn đang sử dụng các phương pháp tối ưu cho thiết kế biểu tượng trang
Cám dỗ khi thiết kế icon WP là chỉ cần sử dụng một phiên bản thu nhỏ của logo trang web và coi đó là xong. Tuy nhiên, dựa trên lời khuyên của chúng tôi về thương hiệu tối ưu, bạn nên dành thời gian để tạo ra một biểu tượng trang riêng biệt thay vì chọn phương án dễ dàng.
Hơn nữa, “khoảng trống” mà bạn có đồng nghĩa với việc bạn có thể không thể thể hiện thương hiệu của mình bằng logo thông thường. Vì vậy, bạn nên cân nhắc những điều sau đây khi thiết kế biểu tượng trang:
- Cô đọng thương hiệu của bạn thành một hoặc hai màu đơn giản để đảm bảo tính nhất quán và dễ nhận diện.
- Giảm logo của bạn xuống các yếu tố cần thiết nhất và làm cho chúng trở thành chủ đề của biểu tượng trang.
- Sử dụng độ tương phản để làm nổi bật các khía cạnh chính của biểu tượng trang.
Để đưa ra ví dụ thực tế, hãy xem biểu tượng trang của WPKube. Nó sử dụng màu xanh và trắng, tạo độ tương phản cao và chỉ chứa logo của trang.
Đó là tất cả những gì cần thiết. Nó mang lại sự dễ nhận diện, tính nhất quán với các yếu tố thương hiệu khác, và đảm bảo bạn có thể nhận ra thẻ trên SERPs và màn hình trình duyệt.
Bước 3: Chọn công cụ phù hợp để tạo biểu tượng trang
Bước cuối cùng sau khi bạn đã chọn kích thước và thiết kế biểu tượng trang của mình là tạo nó. Như bạn mong đợi, có rất nhiều cách để tạo biểu tượng của bạn, và nếu bạn có một công cụ như Canva, đây sẽ là một lựa chọn lý tưởng.
Favicon.io cũng rất tuyệt vời để tạo nhanh một biểu tượng trang chỉ với văn bản và tải xuống tất cả các kích thước cần thiết:
Hãy nhớ rằng bạn cần lưu biểu tượng trang của mình dưới dạng tệp .PNG không trong suốt 8- hoặc 24-bit, vì đây là định dạng tối ưu nhất. Favicon.io sẽ thực hiện điều này cho bạn, mặc dù bạn sẽ phải thay đổi cài đặt trong các trình chỉnh sửa khác.
3 Cách để tải icon trang lên WordPress
Như thường lệ với WordPress, có nhiều cách để tải biểu tượng trang của bạn lên. Chúng tôi sẽ chỉ ra các trường hợp sử dụng và tính phù hợp bên dưới, mặc dù bạn có thể tự do khám phá bất kỳ phương pháp nào phù hợp nhất với bạn.
1. Sử dụng chức năng tích hợp sẵn của WordPress
Tin vui cho hầu hết người dùng WordPress là nền tảng này cung cấp chức năng nhanh chóng và dễ dàng để tải lên biểu tượng trang.
Nếu bạn muốn có một phương pháp đơn giản và không rườm rà, đây là cách dành cho bạn.
Bước 1. Truy cập màn hình nhận diện trang trong WordPress
Đầu tiên, đăng nhập vào WordPress. Từ bảng điều khiển, bạn muốn truy cập vào bảng tùy chọn theme. Theme cao cấp của bạn có thể có các tùy chọn riêng biệt, mặc dù đối với các theme mặc định của WordPress, điều này sẽ nằm trong phần Appearance > Customize > Site Identity của trình Customizer:
Khi bạn đã vào đây, bạn có thể chuyển sang bước tiếp theo.
Bước 2. Chọn icon trang của bạn
Tiếp theo, hãy nhìn vào phần Site Identity để xem hộp thoại Select site icon:
Tại đây, nhấp và tải lên như cách bạn thường làm với các tệp phương tiện của WordPress. Hãy nhớ đặt văn bản ‘alt text’ phù hợp cho biểu tượng trang của bạn để cải thiện khả năng tiếp cận.
Bước 3. Kiểm tra icon WP trên giao diện người dùng
Cuối cùng, hãy xem giao diện người dùng của trang web của bạn, cụ thể là để xem liệu biểu tượng trang của bạn đã được tải lên thành công hay chưa. Bạn sẽ thấy WordPress cung cấp một bản xem trước lớn của biểu tượng trang hiện tại của bạn trong một trình mô phỏng trình duyệt:
Tuy nhiên, bạn vẫn nên xem biểu tượng hiển thị như thế nào trên một trình duyệt, chủ yếu để kiểm tra biểu tượng trông như thế nào đối với người dùng – yếu tố quan trọng hơn.
2. Cài đặt Plugin WordPress phù hợp
Đối với nhiều người dùng, cài đặt một plugin WordPress là giải pháp “chuẩn”. Tuy nhiên, vì hầu hết các trang WordPress đều có sẵn tùy chọn Customizer để thực hiện điều này, nên một plugin có thể là thừa.
Chúng tôi khuyên bạn nên sử dụng cách này nếu bạn có các yêu cầu cụ thể cho biểu tượng trang của mình hoặc không có tùy chọn tải lên biểu tượng trang bằng các tùy chọn của theme.
Bước 1. Chọn Plugin phù hợp
Tên của bước này có chút hiểu lầm vì chúng tôi chỉ khuyến nghị một plugin: Favicon của RealFaviconGenerator:
Về cơ bản, đây là phiên bản plugin của trang web phổ biến này và nó cải tiến thêm chức năng tích hợp sẵn của WordPress. Nó tạo ra tất cả các biểu tượng trang cần thiết từ một hình ảnh duy nhất và lưu trữ chúng trong Media Library.
Sau khi bạn đã cài đặt và kích hoạt plugin, bạn gần như đã hoàn thành.
Bước 2. Tải lên biểu tượng trang đầy đủ kích thước
Khi plugin được kích hoạt, bạn sẽ thấy một bảng Appearance > Favicon mới trong bảng điều khiển WordPress của mình. Đi tới đây sẽ mở ra một tập hợp các tùy chọn đơn giản:
Dù câu chữ hơi khó hiểu, về cơ bản bạn chỉ cần tải lên (hoặc chọn một hình ảnh từ) Media Library. Nhớ thêm văn bản alt nếu bạn chưa làm.
Để bắt đầu quá trình tải lên, chỉ cần nhấp vào nút Generate favicon màu xanh lam và chuyển sang bước cuối cùng.
Bước 3. Tải xuống các icon WP cho trang của bạn
Khi plugin bắt đầu tạo biểu tượng trang của bạn, bạn sẽ thấy nó chuyển sang phiên bản ứng dụng web của trang web của nhà phát triển. Tại đây bạn sẽ thấy tất cả các biểu tượng trang khác nhau cho các nền tảng và kích thước khác nhau:
Lưu ý rằng bạn có thể chọn một số tùy chọn cụ thể cho từng nền tảng tại đây, liên quan đến thiết kế và cách hiển thị của biểu tượng trang:
Tuy nhiên, khi bạn đã sẵn sàng, nhấp vào Generate your Favicons and HTML code, và plugin sẽ hoạt động.
Cuối cùng, bạn sẽ được đưa trở lại bảng điều khiển WordPress, nơi bạn sẽ thấy bản xem trước của các biểu tượng trang trong các trình mô phỏng khác nhau:
Biểu tượng trang của bạn bây giờ đã sẵn sàng – một lần nữa, bạn sẽ muốn kiểm tra giao diện người dùng để đảm bảo.
3. Sử dụng mã để hiển thị icon WP
Cách cuối cùng mà chúng tôi sẽ đề cập là có phần lỗi thời đối với người dùng bình thường, vì có các lựa chọn thay thế. Tuy nhiên, sử dụng mã để hiển thị biểu tượng trang là lý tưởng cho những yêu cầu chính xác hoặc nếu bạn đang tạo một theme tùy chỉnh.
Bước 1. Truy cập máy chủ của trang bằng giao thức truyền tệp (FTP)
Đối với phương pháp này, bạn cần truy cập máy chủ thông qua FTP. Bạn sẽ cần một ứng dụng như Cyberduck hoặc Filezilla, và kỹ năng đủ để thực hiện. Vì chúng ta sẽ làm việc với các tệp lõi của WordPress, nên cũng khuyến nghị sử dụng một theme con.
Khi đã chuẩn bị xong, đăng nhập vào máy chủ bằng thông tin tìm thấy trong bảng điều khiển của nhà cung cấp lưu trữ. Nếu bạn không chắc chắn tìm thấy chúng ở đâu, bạn nên liên hệ với bộ phận hỗ trợ của nhà cung cấp. Thông tin có thể được tìm thấy trong email bạn nhận được khi mua hosting.
Bước 2. Tải lên tệp biểu tượng trang của bạn lên WordPress
Khi đã truy cập vào máy chủ, ứng dụng FTP sẽ hiển thị danh sách thư mục của trang web:
Tại đây, lấy tệp biểu tượng trang của bạn và tải nó lên cả thư mục của theme chính (trong wp-content > themes) và thư mục gốc của trang.
Lúc này, bạn gần như hoàn thành. Bước cuối cùng là mã hóa cứng biểu tượng trang vào WordPress.
Bước 3. Thêm mã vào đầu trang Web
Đối với bước cuối cùng, bạn sẽ cần quay lại WordPress, cụ thể là trang Appearance > Theme Editor:
Khi bạn truy cập vào trang lần đầu, một hộp thoại cảnh báo sẽ xuất hiện. Người mới vào màn hình này sẽ muốn đọc thông báo trước khi nhấp vào Tôi hiểu.
Màn hình chính sẽ hiển thị mã của toàn bộ trang WordPress và tất cả đều có thể chỉnh sửa, vì vậy hãy tiến hành cẩn thận.
Trước tiên, bạn muốn kiểm tra xem mình đang làm việc với theme đúng trong menu thả xuống Select theme to edit:
Tiếp theo, cuộn xuống danh sách Tệp Theme cho đến khi bạn tìm thấy tùy chọn Đầu trang (header.php). Bạn sẽ muốn chọn mục này, sẽ hiển thị tệp header.php trong trình chỉnh sửa.
Bạn sẽ muốn tìm một dòng mã bắt đầu bằng <link rel=”shortcut icon” và kết thúc bằng /favicon.ico” />. Nếu tìm thấy, thay thế nó bằng dòng mã sau:
<link rel="shortcut icon" href="<?php echo get_stylesheet_directory_uri(); ?>/favicon.ico" />
Nếu dòng đó không tồn tại, bạn có thể thêm dòng này vào giữa các thẻ <head>:
Cuối cùng, nhấp vào nút Cập nhật tệp màu xanh lam, sau đó kiểm tra biểu tượng trang của bạn trên giao diện người dùng.
Tóm tắt
Tóm lại, icon WP cho trang của bạn có thể giúp người dùng nhận diện thương hiệu của bạn và cải thiện khả năng hiển thị. Bất kỳ cơ hội nào để thu hút khách hàng tiềm năng đều nên được cân nhắc; với thời gian và nguồn lực bạn cần để tạo biểu tượng trang, quyết định này trở nên dễ dàng.
Trong bài viết này, chúng tôi đã xem xét cách tạo icon WP cho trang của bạn bằng ba phương pháp. Hãy cùng điểm lại nhanh chóng:
- Sử dụng chức năng tích hợp sẵn của WordPress để tải biểu tượng lên.
- Cài đặt một plugin như Favicon của RealFaviconGenerator.
- Hiển thị biểu tượng trang của bạn bằng mã.
