NỘI DUNG

Hosting tốc độ cao Vietnix - tốc độ tải trang trung bình dưới 1 giây
VPS siêu tốc Vietnix - trải nghiệm mượt mà, ổn định
07/09/2023
Lượt xem

5 cách thêm hình ảnh vào WordPress dành cho người mới bắt đầu

07/09/2023
20 phút đọc
Lượt xem

Đánh giá

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

Bằng cách thêm hình ảnh vào WordPress một cách đúng đắn, bạn có thể cải thiện tính hấp dẫn, tăng lượt truy cập từ người dùng và cải thiện SEO của trang web. Bạn còn có thể cho phép người dùng tải lên hình ảnh riêng của họ và sử dụng chúng trên trang web. Để hiểu rõ hơn, hãy cùng Vietnix tham khảo cách thêm hình ảnh vào WordPress dành cho người mới bắt đầu có trong nội dung sau đây.

Tầm quan trọng của việc thêm hình ảnh vào WordPress đúng cách

Thỉnh thoảng, người dùng sao chép trực tiếp một hình ảnh từ nguồn gốc và dán vào nội dung trang web của họ. Điều này có thể gây ra vấn đề như trang web chậm, trải nghiệm người dùng và tối ưu hóa SEO kém.

Khi bạn thêm hình ảnh vào trang web WordPress của mình, điều quan trọng là làm điều này đúng cách. Bao gồm việc sử dụng định dạng file đúng, tên file và alt text đúng cách. Bạn nên đặt tên hình ảnh của mình bằng các từ mô tả được phân tách bằng dấu gạch ngang.

Ví dụ, bạn có thể sử dụng tên file “bali-vacation-photo.jpg” cho một hình ảnh trên blog du lịch.

Thêm hình ảnh một cách đúng cách cũng bao gồm việc điều chỉnh kích thước hình ảnh để chúng tải nhanh và hiển thị đẹp trên tất cả các thiết bị.

Ví dụ, một số định dạng hình ảnh như JPEG, được nén mạnh hơn so với các định dạng khác, điều này có nghĩa rằng những hình ảnh này sẽ chiếm ít không gian trên máy chủ và sẽ tải nhanh hơn.

Bằng cách sử dụng những định dạng này, cùng với một plugin nén hình ảnh cho blog WordPress, bạn có thể cải thiện trải nghiệm người dùng trên trang web của mình.

Tương tự, bằng cách sử dụng Image block trong WordPress và tối ưu hóa hình ảnh của bạn đúng cách cho SEO và alt text, bạn có thể làm cho việc tìm kiếm của công cụ tìm kiếm hình ảnh trở nên dễ dàng hơn. Điều này có thể tăng thứ hạng của trang web và thân thiện hơn với tất cả người dùng.

1. Cách thêm hình ảnh vào WordPress bằng block editor (Gutenberg)

Bạn có thể dễ dàng thêm hình ảnh trong block editor của WordPress bằng cách sử dụng Image block. Trước hết, bạn cần mở trang/bài viết hiện có hoặc tạo mới để thêm hình ảnh vào.

Sau đó, hãy nhấp vào button “+” ở góc trái trên cùng của màn hình để mở menu block. Từ đây, bạn cần tìm và thêm Image block vào bài viết hoặc trang.

thêm hình ảnh vào WordPress bằng block editor
Thêm hình ảnh vào WordPress bằng block editor

Khi bạn đã hoàn thành bước đó, hãy nhấp vào button Media Library để mở hộp thoại Select or Upload Media trên màn hình. Từ đây, bạn có thể chuyển đổi sang tab Upload Files nếu bạn muốn tải lên một hình ảnh từ máy tính.

Tuy nhiên, nếu bạn muốn thêm một hình ảnh từ media library, bạn cũng có thể làm điều đó bằng cách chuyển sang tab Media Library.

Chuyển sang tab Media Library để thêm hình ảnh
Chuyển sang tab Media Library để thêm hình ảnh

Sau khi thêm một hình ảnh, bạn sẽ cần thêm alt text cho chúng trong cột bên trái. Alt text này quan trọng cho việc tối ưu hóa hình ảnh cho công cụ tìm kiếm (SEO) vì sẽ giúp công cụ tìm kiếm hiểu về ngữ cảnh của hình ảnh.

Đồng thời, cũng cho phép người dùng sử dụng phần mềm trình đọc màn hình xem thông tin về hình ảnh của bạn.

Ngoài ra, bạn cũng có thể thêm tiêu đề và chú thích mô tả hình ảnh trong cột bên phải. Chú thích là các mô tả văn bản hiển thị của hình ảnh của bạn. Chú thích thường xuất hiện dưới hoặc bên cạnh hình ảnh để cung cấp thông tin bổ sung về hình ảnh đó, trong khi tiêu đề sẽ xuất hiện khi người dùng di chuột qua hình ảnh.

Tiếp theo, chỉ cần nhấp vào button Select để thêm hình ảnh vào trang hoặc bài viết của bạn.

Chọn Select để thêm hình ảnh
Chọn Select để thêm hình ảnh

Bây giờ bạn đã tải lên một hình ảnh, bạn có thể tùy chỉnh thêm kích thước, chiều dài, viền và kiểu dáng của nó từ bảng tùy chỉnh ở bên phải như hình.

Chọn button Update hoặc Publish để lưu thiết lập
Chọn button Update hoặc Publish để lưu thiết lập


Cuối cùng, nhấp vào button Update hoặc Publish để lưu các thiết lập. Bây giờ bạn đã thêm một hình ảnh một cách chính xác trong Gutenberg editor.

2. Cách thêm hình ảnh vào WordPress bằng classic editor

Nếu bạn vẫn đang sử dụng classic editor trong WordPress, thì bạn có thể sử dụng phương pháp này. Trước hết, bạn cần truy cập trang hoặc bài viết mà bạn muốn thêm hình ảnh từ WordPress dashboard. Sau đó, chỉ cần nhấp vào button Add Media để mở media library.

Chọn button Add Media để mở media library
Chọn button Add Media để mở media library

Sau đó, bạn có thể chuyển sang tab Upload Files để tải lên một hình ảnh từ máy tính. Hoặc nếu bạn muốn thêm một hình ảnh từ media library, chỉ cần chuyển sang tab Media Library.

Để tải lên hình ảnh từ máy tính hãy chọn Upload Files
Để tải lên hình ảnh từ máy tính hãy chọn Upload Files


Sau khi thêm hình ảnh, bạn sẽ cần thêm alt text và một tiêu đề cho chúng. Bạn cũng có thể thêm mô tả và chú thích nếu muốn.

Bạn có thể đơn giản mô tả hình ảnh cho tất cả các tùy chọn. Điều này sẽ giúp công cụ tìm kiếm index hình ảnh và tăng khả năng thấy trang web trên công cụ tìm kiếm.

Tiếp theo, hãy nhấp vào button Insert into Post.

Nhấp vào button Insert into Post để tiếp tục
Nhấp vào button Insert into Post để tiếp tục

Bây giờ, hình ảnh sẽ được thêm vào bài viết hoặc trang WordPress. Từ đây, bạn có thể thay đổi sự căn chỉnh bằng cách sử dụng biểu tượng căn chỉnh phía trên hình ảnh. Bạn cũng có thể chỉnh sửa thêm hình ảnh bằng cách nhấp vào biểu tượng bút chì.

Chọn biểu tượng bút chì để chỉnh sửa hình ảnh
Chọn biểu tượng bút chì để chỉnh sửa hình ảnh

Điều này sẽ mở hộp thoại Image details trên màn hình, trong đó bạn có thể thay đổi kích thước và thêm các thuộc tính tiêu đề hình ảnh, lớp CSS, căn chỉnh và nhiều tùy chọn khác.

Khi đã hoàn thành, chỉ cần nhấp vào button Update để lưu các thay đổi đã thực hiện.

Nhấp vào button Update để lưu
Nhấp vào button Update để lưu

Sau đó, chỉ cần nhấp vào button Publish hoặc Update để lưu bài viết.

Ngoài cách thêm hình ảnh vào WordPress, bạn cũng có thể tham khảo thêm:

Hiện tại Vietnix đang tặng miễn phí plugin tối ưu hóa hình ảnh WP Smush Pro cho khách hàng sử dụng các dịch vụ hosting. WP Smush Pro là một plugin tối ưu hóa hình ảnh rất hữu ích giúp giảm dung lượng hình ảnh trên website, từ đó cải thiện tốc độ tải trang và hiệu suất SEO. Bên cạnh WP Smush Pro, trong bộ quà tặng của Vietnix còn bao gồm nhiều công cụ hữu ích khác như: Plugin WPML, Rank Math SEO Pro, Elementor Pro, theme từ Divi – MyThemeShop ,… với tổng giá trị lên tới 50.000.000 VND. Liên hệ với đội ngũ Vietnix để được tư vấn chi tiết và nhận ngay phần quà giá trị này.

3. Cách thêm hình ảnh vào meadia library

Bạn cũng có thể thêm trực tiếp một hình ảnh vào media library. Hãy nhớ rằng sau khi thêm một hình ảnh vào media library, bạn vẫn cần mở một bài viết hoặc trang và chèn Image block.

Để thêm một hình ảnh từ media library, bạn phải truy cập trang Media > Add New từ WordPress admin area. Sau đó, hãy nhấp vào button Select Files để tải lên một hình ảnh từ máy tính. Tiếp theo, hãy nhấp vào link Edit bên cạnh hình ảnh.

Nhấp vào button Select Files để tải hình ảnh từ máy tính
Nhấp vào button Select Files để tải hình ảnh từ máy tính

Điều này sẽ đưa bạn đến trang Edit Media, nơi bạn có thể bắt đầu bằng việc thay đổi tiêu đề cho hình ảnh. Sau đó, bạn có thể thêm alt text, chú thích và mô tả bằng cách cuộn xuống.

Sau đó, bạn cũng có thể nhấp vào button Edit Image.

Nhấp vào button Edit Image để tùy chỉnh
Nhấp vào button Edit Image để tùy chỉnh

Điều này sẽ đưa bạn đến một trang khác, nơi bạn có thể cắt, co giãn, xoay hoặc lật hình ảnh theo ý thích. Khi bạn hài lòng với kết quả, chỉ cần nhấp vào button Update để lưu các thay đổi.

Có thể tùy chỉnh hình ảnh theo ý thích
Có thể tùy chỉnh hình ảnh theo ý thích

Điều này sẽ đưa bạn trở lại trang Edit Media, nơi bạn phải nhấp vào button Update một lần nữa để lưu các thiết lập. Bây giờ bạn đã thành công thêm một hình ảnh vào media library.

Tiếp theo, truy cập bài viết mà bạn muốn thêm hình ảnh này từ WordPress admin sidebar. Sau đó, hãy nhấp vào button “+” để thêm một Image block vào bài viết.

Tiếp theo, bạn cần chọn button Media Library.

Chọn button Media Library
Chọn button Media Library

Điều này sẽ mở hộp thoại Select or Upload Media trên màn hình, nơi bạn sẽ thấy hình ảnh bạn đã tải lên trong media library ở phía trên. Khi bạn chọn hình ảnh, bạn sẽ thấy rằng tiêu đề, alt text, chú thích và mô tả của chúng đã được thêm vào từ trang media library.

Bây giờ, chỉ cần nhấp vào button Select để tải hình ảnh lên block editor.

Chọn button Select để tải hình ảnh lên block editor
Chọn button Select để tải hình ảnh lên block editor

Cuối cùng, hãy nhấp vào button Publish hoặc Update để lưu các thiết lập.

4. Cách tối ưu hóa hình ảnh cho SEO

Khi bạn đã thêm một hình ảnh vào một bài viết/trang, việc tối ưu hóa chúng cho công cụ tìm kiếm cũng quan trọng. WordPress không cung cấp bất kỳ tính năng SEO nâng cao tích hợp nào cho hình ảnh, vì vậy bạn cần một plugin để thực hiện điều này. Bạn có thể dùng plugin AIOSEO, là plugin SEO WordPress tốt nhất trên thị trường giúp việc tối ưu hóa nội dung, bao gồm cả hình ảnh, trở nên cực kỳ dễ dàng cho công cụ tìm kiếm.

Trước hết, bạn cần cài đặt và kích hoạt plugin AIOSEO. Sau khi kích hoạt, bạn sẽ phải cấu hình thông qua hướng dẫn cài đặt ban đầu.

Plugin AIOSEO
Plugin AIOSEO

Tiếp theo, truy cập trang All in One SEO > Search Appearance từ WordPress admin sidebar và chuyển sang tab Image SEO.

Sau đó, cuộn xuống và nhấp vào button Activate Image SEO để mở khóa tính năng này.

Chọn Activate Image SEO để mở khóa tính năng Image SEO
Chọn Activate Image SEO để mở khóa tính năng Image SEO

Bây giờ bạn có thể thấy các cài đặt Image SEO. Ở đây, bạn sẽ thấy các tab khác nhau cho tiêu đề, alt text, chú thích, mô tả và tên file.

Cấu hình tiêu đề hình ảnh tự động

Khi bạn chuyển sang tab Title trên trang Image SEO, bạn có thể bắt đầu bằng cách tạo một định dạng tiêu đề cho hình ảnh bằng cách sử dụng các smart tag.

Những smart tag này sau đó sẽ tự động tạo ra các thuộc tính tiêu đề cho hình ảnh. Đây là điều mà một người truy cập sẽ thấy khi họ di chuột qua hình ảnh.

Ví dụ, nếu bạn muốn mỗi thuộc tính sử dụng tiêu đề hình ảnh và tiêu đề trang web, bạn có thể thêm các smart tag này vào Title Format field.

Cấu hình title tự động
Cấu hình title tự động

Sau đó, bạn cũng có thể kích hoạt tùy chọn Strip Punctuation nếu bạn muốn AIOSEO tự động xóa một số ký tự khi tạo tiêu đề hình ảnh từ tên file.

Ví dụ, nếu bạn sử dụng dấu gạch ngang khi lưu tên file hình ảnh như “an-example-image“, sau đó bạn có thể chọn tùy chọn “Dashes (-)” trong phần “Characters to Convert to Spaces“.

Khi bạn thực hiện điều đó, AIOSEO sẽ tự động loại bỏ các dấu gạch ngang này và biến chúng thành khoảng trống, biến tiêu đề hình ảnh thành “an example image“.

Có thể sử dụng dấu gạch ngang khi lưu tên file
Có thể sử dụng dấu gạch ngang khi lưu tên file

Sau đó, cuộn xuống phần Casing. Từ đây, bạn có thể chọn một tùy chọn viết hoa cho tiêu đề. Vietnix khuyên bạn nên chọn chữ hoa câu hoặc chữ hoa tiêu đề để làm cho tiêu đề trở nên dễ đọc hơn.

Cấu hình alt text tự động

Sau khi cấu hình thiết lập tiêu đề, chuyển sang tab Alt Text ở phía trên. Từ đây, bạn có thể sử dụng các smart tag bên cạnh tùy chọn Alt Tag Format để tự động tạo alt text cho tất cả các hình ảnh.

Sau đó, bạn cũng có thể kích hoạt tùy chọn Strip Punctuation nếu bạn muốn các ký tự như dấu gạch ngang (-) hoặc gạch dưới (_) được chuyển đổi thành khoảng trống.

Cấu hình alt text tự động
Cấu hình alt text tự động

Tương tự, nếu có các ký tự như số hoặc dấu cộng (+) mà bạn không muốn AIOSEO loại bỏ khi tạo văn bản thay thế (alt text), bạn có thể chọn các ô cho những tùy chọn này trong phần “Characters to Exclude from Being Stripped“. Bạn cũng có thể chọn kiểu viết cho alt text.

Cấu hình chú thích và mô tả tự động

Để tạo chú thích tự động cho hình ảnh của bạn, chuyển sang tab Captions. Từ đây, hãy đảm bảo rằng tùy chọn Autogenerate Caption on Upload đã được kích hoạt. Sau đó, bạn có thể chọn các smart tag sẽ được sử dụng để tạo chú thích cho hình ảnh của bạn.

Tạo chú thích tự động cho hình ảnh
Tạo chú thích tự động cho hình ảnh

Tiếp theo, bạn cũng có thể sử dụng tính năng Strip Punctuation để loại trừ hoặc bao gồm các ký tự trong chú thích và chọn kiểu viết cho chú thích.

Khi bạn đã hoàn thành, bạn cần chuyển sang tab Description ở phía trên. Từ đây, hãy đảm bảo rằng tùy chọn Autogenerate Description on Upload đã được kích hoạt. Bạn cũng phải chọn các smart tag mà bạn muốn sử dụng để tạo mô tả hình ảnh tự động.

Chuyển sang tab Description
Chuyển sang tab Description

Tiếp theo, bạn cũng có thể sử dụng tính năng Strip Punctuation để bao gồm/loại trừ các ký tự như gạch dưới, dấu ngoặc đơn hoặc số trong mô tả.

Sau đó, đơn giản chỉ cần chọn kiểu viết cho mô tả hình ảnh.

Tính năng Strip Punctuation
Tính năng Strip Punctuation

Cấu hình tên file tự động

Như chúng tôi đã đề xuất trước đó, chúng tôi khuyên bạn nên đặt tên file hình ảnh của mình sao cho thân thiện với SEO. Bạn có thể thực hiện điều này trước khi tải lên hình ảnh hoặc AIOSEO có thể làm điều đó tự động.

Khi bạn chuyển sang tab Filename ở phía trên, bạn sẽ thấy rằng AIOSEO đã cấu hình tùy chọn Strip Punctuation cho bạn.

Tuy nhiên, nếu có thêm bất kỳ ký tự nào khác mà bạn muốn AIOSEO xóa khỏi tên file hình ảnh khi tạo tiêu đề hoặc alt text, bạn có thể nhập những ký tự đó vào ô “Words to Strip“.

Có thể nhập ký tự vào Words to Strip
Có thể nhập ký tự vào Words to Strip

Sau đó, bạn cũng có thể chọn kiểu viết cho tên file. Khi bạn hoàn thành, đừng quên nhấp vào button Save Changes để lưu các thiết lập.

Bây giờ, bạn đã thành công tối ưu hóa hình ảnh của mình cho SEO, và AIOSEO sẽ tự động tạo tiêu đề, alt text, chú thích và mô tả cho tất cả các hình ảnh.

Ngoài ra, bạn cũng có thể tham khảo thêm cách tối ưu tốt hơn cho website tại:

5. Cho phép người dùng tải lên hình ảnh trong WordPress

Bạn cũng có thể muốn cho phép người dùng tải lên hình ảnh riêng của họ lên trang web WordPress của bạn. Điều này có thể hữu ích nếu bạn đang tổ chức một cuộc thi hoặc vận hành một trang web nhiếp ảnh chấp nhận hình ảnh do người dùng tạo ra.

Để làm điều này, bạn có thể sử dụng WPForms, đó là plugin contact form tốt nhất trên thị trường. Đi kèm với một trình tạo kéo và thả giúp bạn dễ dàng tạo bất kỳ loại form nào bạn muốn, bao gồm cả form mẫu gửi hình ảnh.

Trước hết, bạn sẽ cần cài đặt và kích hoạt plugin WPForms. Sau khi kích hoạt, truy cập màn hình WPForms > Add New từ WordPress dashboard để mở form builder.

Từ đây, bạn cần gõ tên cho form và sau đó nhấp vào button Use Template dưới Simple Contact Form template.

Nhấp vào button Use Template sau khi gõ tên form
Nhấp vào button Use Template sau khi gõ tên form

Điều này sẽ tải template trong form builder, bạn sẽ thấy phần xem trước của chúng ở phía bên phải và các field có sẵn ở cột bên trái. Từ đây, hãy kéo và thả File Upload field vào form và nhấp vào để tùy chỉnh cài đặt chi tiết.

Kéo và thả File Upload field vào form để tùy chỉnh
Kéo và thả File Upload field vào form để tùy chỉnh

Từ đây, bạn có thể thay đổi nhãn và mô tả của field và thậm chí chỉ định các phần mở rộng được cho phép.

Ví dụ, nếu bạn muốn cho phép chỉ các file JPEG và PNG, sau đó bạn phải nhập các tùy chọn này vào field Allowed File Extensions. Hãy nhớ ngăn cách mỗi phần mở rộng bằng dấu phẩy.

Sau đó, bạn cũng có thể cấu hình kích thước file hình ảnh tối đa và số lượng tải lên trong cột bên trái.

Nhập các tùy chọn vào Allowed File Extensions nếu muốn thêm file
Nhập các tùy chọn vào Allowed File Extensions nếu muốn thêm file

Khi bạn hoàn thành, chỉ cần nhấp vào button Save để lưu các thiết lập. Tiếp theo, mở trang/bài viết mà bạn muốn thêm biểu mẫu tải lên hình ảnh. Một khi bạn đã ở đó, hãy nhấp vào button “+” ở góc trái phía trên của màn hình để mở block menu.

Từ đây, bạn cần thêm block WPForms vào trang/bài viết.

Block WPForms
Block WPForms

Chỉ cần chọn form tải lên file hình ảnh mà bạn đã tạo từ menu thả xuống. Cuối cùng, nhấp vào button Update hoặc Publish để lưu các thiết lập. Bây giờ, bạn có thể truy cập trang web WordPress của mình để xem form hoạt động, và khách truy cập sẽ có thể gửi hình ảnh của họ bằng cách sử dụng form này.

Lời kết

Vietnix hy vọng bài viết trên đã gúp bạn hiểu được cách thêm hình ảnh vào WordPress. Ngoài nội dung trên, bạn cũng có thể tham khảo các bài viết khác như những điều cần biết về quản lý hình ảnh trong WordPress hoặc 17 cách sửa các lỗi hình ảnh phổ biến trong WordPress tại vietnix.vn để tối ưu cho trang web tốt hơn, chúc bạn thành công!

THEO DÕI VÀ CẬP NHẬT CHỦ ĐỀ BẠN QUAN TÂM

Đăng ký ngay để nhận những thông tin mới nhất từ blog của chúng tôi. Đừng bỏ lỡ cơ hội truy cập kiến thức và tin tức hàng ngày

Chọn chủ đề :

Lê Nam

WordPress Expert
tại

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

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

Tăng tốc độ website - Nâng tầm giá trị thương hiệu

Tăng tốc tải trang

95 điểm

Nâng cao trải nghiệm người dùng

Tăng 8% tỷ lệ chuyển đổi

Thúc đẩy SEO, Google Ads hiệu quả

Tăng tốc ngay

SẢN PHẨM NỔI BẬT

7 NGÀY DÙNG THỬ HOSTING

NẮM BẮT CƠ HỘI, THÀNH CÔNG DẪN LỐI

Cùng trải nghiệm dịch vụ hosting tốc độ cao được hơn 100,000 khách hàng sử dụng

ĐĂNG KÝ NHẬN TÀI LIỆU THÀNH CÔNG
Cảm ơn bạn đã đăng ký nhận tài liệu mới nhất từ Vietnix!
ĐÓNG

ĐĂNG KÝ DÙNG THỬ HOSTING

7 NGÀY MIỄN PHÍ

ĐĂNG KÝ DÙNG THỬ HOSTING

7 NGÀY MIỄN PHÍ

XÁC NHẬN ĐĂNG KÝ DÙNG THỬ THÀNH CÔNG
Cảm ơn bạn đã đăng ký thông tin thành công. Đội ngũ CSKH sẽ liên hệ trực tiếp để kích hoạt dịch vụ cho bạn nhanh nhất!
ĐÓNG