Cách Thêm Hình Ảnh Đúng Cách Vào WordPress (Từng Bước)

Mục lục

Bạn đang tìm cách phù hợp để thêm hình ảnh vào website WordPress hoặc blog của mình?

Bằng cách chèn hình ảnh vào WordPress đúng cách, bạn có thể cải thiện sức hấp dẫn trực quan, khả năng truy cập và SEO của website. Bạn thậm chí có thể cho phép người dùng upload hình ảnh của riêng họ và sử dụng chúng trên website của bạn hoặc trong các cuộc thi của bạn.

Trong bài viết này, WPBeginner Việt Nam sẽ hướng dẫn bạn cách thêm hình ảnh vào WordPress đúng cách theo từng bước.

Thêm hình ảnh vào WordPress đúng cách

Tầm quan trọng của việc tải hình ảnh chính xác lên WordPress

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

Khi bạn thêm hình ảnh vào website WordPress của mình, điều quan trọng là phải thực hiện đúng cách. Điều này có nghĩa là sử dụng đúng định dạng file, tên file và văn bản thay thế.

Chúng tôi khuyên bạn nên đặt tên cho hình ảnh của mình bằng các từ mô tả được phân cá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 hình ảnh trên blog du lịch của mình.

Thêm hình ảnh đúng cách cũng có nghĩa là thay đổi kích thước hình ảnh của bạn để chúng tải nhanh và trông đẹp trên mọi thiết bị. Ví dụ, một số định dạng hình ảnh như JPEG được nén nhiều hơn các định dạng khác, điều đó có nghĩa là những hình ảnh này sẽ chiếm ít dung lượng hơn trên server của bạn và sẽ mất ít thời gian hơn để tải.

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

Tương tự như vậy, bằng cách sử dụng block Hình ảnh trong WordPress và tối ưu hóa hình ảnh cho SEO và văn bản thay thế một cách phù hợp, bạn có thể giúp công cụ tìm kiếm lập chỉ mục hình ảnh của mình dễ dàng hơn.

Điều này có thể tăng thứ hạng của website và cải thiện khả năng truy cập website của người khuyết tật.

Nói như vậy, chúng ta hãy xem cách thêm hình ảnh đúng cách vào WordPress. Chúng tôi sẽ đề cập đến một số phương pháp và bạn có thể sử dụng các link nhanh bên dưới để chuyển đến các phần khác nhau trong hướng dẫn của WPBeginner Việt Nam:

Cách thêm hình ảnh vào trình chỉnh sửa block (Gutenberg)

Bạn có thể dễ dàng thêm hình ảnh vào trình chỉnh sửa block WordPress bằng cách sử dụng block Hình ảnh.

Đầu tiên, bạn cần mở trang/bài viết hiện có hoặc mới mà bạn muốn thêm hình ảnh.

Khi bạn đã vào đó, hãy nhấp vào nút ‘Thêm block’ (+) ở góc trên bên trái của màn hình để mở menu block. Từ đây, bạn phải tìm và thêm block Hình ảnh vào bài đăng hoặc trang.

Thêm block hình ảnh vào bài viết

Sau khi thực hiện xong, hãy nhấp vào nút ‘Thư viện phương tiện’ để khởi chạy lời nhắc ‘Chọn hoặc tải phương tiện lên’ trên màn hình.

Từ đây, bạn có thể chuyển sang tab ‘Tải file lên’ nếu bạn muốn tải hình ảnh từ máy tính của mình lên.

Tuy nhiên, nếu bạn muốn thêm hình ảnh từ media library, bạn cũng có thể thực hiện bằng cách chuyển sang tab ‘Thư viện phương tiện’.

Chọn hình ảnh từ media library

Khi thêm hình ảnh, bạn sẽ cần thêm văn bản alt cho hình ảnh đó vào cột bên trái. Văn bản alt này rất quan trọng đối với SEO hình ảnh vì nó giúp các công cụ tìm kiếm hiểu được ngữ cảnh của hình ảnh. Nó cũng cho phép những người có trình đọc màn hình xem thông tin này về hình ảnh của bạn.

Bạn cũng có thể thêm tiêu đề và chú thích mô tả hình ảnh ở cột bên phải. Chú thích là phần mô tả văn bản hiển thị của hình ảnh, trong khi tiêu đề sẽ xuất hiện khi người dùng di chuột qua hình ảnh.

Để biết thêm chi tiết, bạn có thể xem hướng dẫn dành cho người mới bắt đầu về cách thêm chú thích vào hình ảnh trong WordPress.

Tiếp theo, chỉ cần nhấp vào nút ‘Chọn’ để thêm hình ảnh vào trang hoặc bài đăng của bạn.

Điền thông tin hình ảnh

Sau khi đã tải ảnh lên, bạn có thể custom thêm kích thước, chiều, đường viền và kiểu dáng của ảnh từ bảng block ở bên phải.

Để biết chi tiết, hãy xem hướng dẫn của WPBeginner Việt Nam về cách thêm và căn chỉnh hình ảnh trong WordPress.

Cài đặt hình ảnh trong bảng block

Cuối cùng, nhấp vào nút ‘Cập nhật’ hoặc ‘Xuất bản’ để lưu cài đặt của bạn.

Bây giờ bạn đã thêm hình ảnh đúng cách vào trình soạn thảo Gutenberg.

Cách thêm hình ảnh vào trình chỉnh sửa cổ điển

Nếu bạn vẫn đang sử dụng trình chỉnh sửa cổ điển trong WordPress, thì bạn có thể sử dụng phương pháp này.

Đầu tiên, bạn cần truy cập trang hoặc bài đăng mà bạn muốn thêm hình ảnh từ dashboard WordPress. Khi đã vào đó, chỉ cần nhấp vào nút ‘Thêm phương tiện’ để khởi chạy media library.

Nhấp vào nút thêm phương tiện

Sau đó, bạn có thể chuyển sang tab ‘Tải file lên’ để tải hình ảnh từ máy tính của mình lên.

Ngoài ra, để thêm hình ảnh từ media library, chỉ cần chuyển sang tab ‘Thư viện phương tiện’.

Tải file hình ảnh lên trình chỉnh sửa cổ điển

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

Bạn có thể chỉ cần mô tả hình ảnh cho tất cả các option này. Điều này sẽ giúp các công cụ tìm kiếm lập chỉ mục hình ảnh của bạn và tăng khả năng hiển thị của website.

Tiếp theo, hãy nhấp vào nút ‘Chèn vào bài đăng’.

Cấu hình chi tiết file đính kèm trong trình chỉnh sửa cổ điển

Bây giờ, hình ảnh sẽ được thêm vào bài đăng hoặc trang WordPress của bạn.

Từ đây, bạn có thể thay đổi căn chỉnh bằng cách sử dụng các icon 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 icon bút chì.

Nhấp vào icon Bút chì để chỉnh sửa hình ảnh

Thao tác này sẽ mở hộp thoại ‘Chi tiết hình ảnh’ trên màn hình, tại đây bạn có thể thay đổi kích thước và thêm thuộc tính tiêu đề hình ảnh, lớp CSS, căn chỉnh, v.v.

Khi hoàn tất, chỉ cần nhấp vào nút ‘Cập nhật’ để lưu những thay đổi bạn đã thực hiện.

Chỉnh sửa hình ảnh trong trình chỉnh sửa cổ điển

Sau đó, chỉ cần nhấp vào nút ‘Xuất bản’ hoặc ‘Cập nhật’ để lưu bài đăng của bạn.

Cách thêm hình ảnh vào media library WordPress

Nếu muốn, bạn cũng có thể trực tiếp thêm hình ảnh vào media library. Lưu ý rằng sau khi thêm hình ảnh vào media library, bạn vẫn cần mở bài đăng hoặc trang và chèn block Hình ảnh.

Để thêm hình ảnh từ media library, bạn phải truy cập Phương tiện truyền thông » Thêm mới trang từ khu vực quản trị WordPress.

Khi bạn đã vào đó, hãy nhấp vào nút ‘Chọn file’ để upload hình ảnh từ máy tính của bạn. Sau đó, nhấp vào link ‘Chỉnh sửa’ bên cạnh hình ảnh.

Thêm hình ảnh vào media library và nhấp vào link Chỉnh sửa

Thao tác này sẽ đưa bạn đến trang ‘Chỉnh sửa phương tiện’, nơi bạn có thể bắt đầu bằng cách thay đổi tiêu đề cho hình ảnh. Sau đó, bạn có thể thêm văn bản thay thế, chú thích và mô tả bằng cách cuộn xuống.

Sau khi thực hiện xong, bạn cũng có thể nhấp vào nút ‘Chỉnh sửa hình ảnh’.

Nhấp vào nút Chỉnh sửa hình ảnh

Thao tác này sẽ chuyển hướng bạn đến một trang khác, nơi bạn có thể cắt, thay đổi tỷ lệ, xoay hoặc lật hình ảnh theo ý thích. Để biết hướng dẫn chi tiết, vui lòng xem hướng dẫn dành cho người mới bắt đầu về cách chỉnh sửa hình ảnh cơ bản trong WordPress.

Khi đã hài lòng, chỉ cần nhấp vào nút ‘Cập nhật’ để Save Changes.

tính năng chỉnh sửa cơ bản trong WordPress

Thao tác này sẽ đưa bạn trở lại trang ‘Chỉnh sửa phương tiện’, tại đó bạn phải nhấp vào nút ‘Cập nhật’ một lần nữa để lưu cài đặt của mình.

Bây giờ bạn đã thêm hình ảnh vào media library thành công.

Tiếp theo, hãy truy cập bài đăng mà bạn muốn thêm hình ảnh này từ sidebar quản trị WordPress. Khi bạn đã ở đó, hãy nhấp vào nút ‘Thêm block’ (+) để thêm block hình ảnh vào bài đăng.

Tiếp theo, bạn cần chọn nút ‘Thư viện phương tiện’.

Khối hình ảnh

Thao tác này sẽ khởi chạy lời nhắc ‘Chọn hoặc Tải phương tiện lên’ trên màn hình, tại đó bạn sẽ thấy hình ảnh bạn đã upload trong media library ở trên cùng.

Khi chọn, bạn sẽ thấy tiêu đề, văn bản thay thế, chú thích và mô tả của ảnh đã được thêm vào từ trang media library.

Bây giờ, chỉ cần nhấp vào nút ‘Chọn’ để tải hình ảnh lên trình chỉnh sửa block.

Thêm hình ảnh từ media library

Cuối cùng, nhấp vào nút ‘Xuất bản’ hoặc ‘Cập nhật’ để lưu cài đặt của bạn.

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

Sau khi bạn đã thêm hình ảnh vào bài đăng/trang, việc tối ưu hóa hình ảnh cho công cụ tìm kiếm cũng rất quan trọng. Thật không may, WordPress không cung cấp bất kỳ tính năng SEO nâng cao nào được tích hợp sẵn cho hình ảnh.

Đây là đâu Tất cả trong một SEO cho WordPress (AIOSEO) vào đi.

Đây là plugin SEO WordPress tốt nhất trên thị trường giúp bạn dễ dàng tối ưu hóa content, bao gồm cả hình ảnh, cho các công cụ tìm kiếm.

Đầu tiên, bạn cần cài đặt và kích hoạt AIOSEO plugin. Để biết thêm hướng dẫn, hãy xem hướng dẫn từng bước của WPBeginner Việt Nam về cách cài đặt plugin WordPress.

Ghi chú: AIOSEO cũng có một phiên bản miễn phíTuy nhiên, bạn sẽ cần gói chuyên nghiệp của plugin để mở khóa tính năng SEO hình ảnh.

Sau khi kích hoạt, bạn sẽ phải cấu hình trình hướng dẫn thiết lập.

Để biết thêm chi tiết, hãy xem hướng dẫn của WPBeginner Việt Nam về cách thiết lập All in One SEO cho WordPress đúng cách.

Trình hướng dẫn thiết lập AIOSEO

Tiếp theo, hãy đến Tất cả trong một SEO » Giao diện tìm kiếm từ sidebar quản trị WordPress và chuyển sang tab ‘SEO hình ảnh’.

Sau đó, cuộn xuống và nhấp vào nút ‘Kích hoạt SEO hình ảnh’ để mở khóa tính năng.

Kích hoạt Module SEO hình ảnh trong AIOSEO

Bây giờ bạn có thể thấy cài đặt SEO hình ảnh. Tại đây, bạn sẽ thấy các tab khác nhau cho tiêu đề, văn bản thay thế, 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 ‘Tiêu đề’ trên trang SEO hình ảnh, bạn có thể bắt đầu bằng cách tạo định dạng tiêu đề cho hình ảnh của mình bằng tag thông minh.

Các tag thông minh này sau đó sẽ tự động tạo thuộc tính tiêu đề cho hình ảnh của bạn. Đây là những gì người dùng sẽ thấy khi họ di chuột qua hình ảnh của bạn.

Ví dụ, nếu bạn muốn mỗi thuộc tính tiêu đề hình ảnh sử dụng tiêu đề hình ảnh và tiêu đề website, thì bạn có thể thêm các tag thông minh này vào trường ‘Định dạng tiêu đề’.

Thêm tag thông minh để cấu hình SEO tiêu đề

Sau đó, bạn cũng có thể bật option Xóa dấu câu nếu muốn AIOSEO tự động xóa một số ký tự khi tạo tiêu đề hình ảnh khỏi tên file.

Ví dụ, nếu bạn sử dụng dấu gạch ngang khi lưu file hình ảnh như ‘an-example-image’, thì bạn có thể chọn option ‘Dấu gạch ngang (-)’ trong phần ‘Ký tự chuyển đổi thành khoảng trắng’.

Sau khi bạn thực hiện xong, AIOSEO sẽ tự động xóa 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 ‘hình ảnh mẫu’.

Cấu hình option chấm câu và viết hoa

Sau đó, cuộn xuống phần ‘Vỏ’.

Từ đây, bạn có thể chọn option viết hoa cho tiêu đề của mình. Chúng tôi khuyên bạn nên chọn viết hoa câu hoặc viết hoa tiêu đề để làm cho tiêu đề của bạn dễ đọc hơn.

Cấu hình tag Alt tự động

Sau khi cấu hình cài đặt tiêu đề, hãy chuyển sang tab ‘Thẻ Alt’ ở trên cùng.

Từ đây, bạn có thể sử dụng tag thông minh bên cạnh option ‘Định dạng tag Alt’ để tự động tạo văn bản alt cho tất cả hình ảnh của bạn.

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

Cài đặt SEO cho tag alt

Tương tự như vậy, nếu có các ký tự như số hoặc dấu cộng (+) mà bạn không muốn AIOSEO xóa khi tạo văn bản thay thế, thì bạn có thể đánh dấu vào các hộp cho các option này trong phần ‘Ký tự không bị xóa’.

Bạn cũng có thể chọn chữ hoa cho văn bản thay thế của mình.

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, hãy chuyển sang tab ‘Chú thích’.

Từ đây, hãy đảm bảo rằng option ‘Tự động tạo chú thích khi upload’ được bật. Sau đó, bạn có thể chọn các tag thông minh sẽ được sử dụng để tạo chú thích cho hình ảnh của mình.

Bật nút chuyển đổi Phụ đề và cấu hình tag thông minh của nó

Tiếp theo, bạn cũng có thể sử dụng tính năng Bỏ dấu câu để loại trừ hoặc thêm ký tự vào chú thích và chọn cách viết hoa cho chúng.

Khi hoàn tất, bạn cần chuyển sang tab ‘Mô tả’ ở trên cùng.

Từ đây, hãy đảm bảo rằng option ‘Tự động tạo mô tả khi upload’ được bật. Bạn cũng phải chọn tag thông minh mà bạn muốn sử dụng để tạo mô tả hình ảnh tự động.

Bật nút chuyển đổi Mô tả và cấu hình tag thông minh của nó

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

Sau đó, chỉ cần chọn một khung cho mô tả hình ảnh của bạn.

Thiết lập dấu câu và vỏ chữ

Cấu hình tên tập tin tự động

Như đã đề cập trước đó, WPBeginner Việt Nam khuyên bạn nên đặt tên file hình ảnh tối ưu với SEO. Bạn có thể thực hiện việc này trước khi tải hình ảnh lên hoặc AIOSEO có thể tự động thực hiện cho bạn.

Khi bạn chuyển sang tab ‘Tên file’ ở trên cùng, bạn sẽ thấy AIOSEO đã cấu hình cài đặt Strip Punctuation cho bạn.

Tuy nhiên, nếu bạn muốn AIOSEO xóa thêm bất kỳ ký tự nào khỏi tên file hình ảnh khi tạo tiêu đề hoặc văn bản thay thế, thì bạn có thể nhập các ký tự đó vào hộp ‘Từ cần xóa’.

Thiết lập AIOSEO cho Tên file

Sau đó, bạn cũng có thể chọn chữ hoa/thường cho tên file của mình.

Khi hoàn tất, đừng quên nhấp vào nút ‘Lưu thay đổi’ để lưu cài đặt của bạn.

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

Để biết hướng dẫn chi tiết hơn, vui lòng xem hướng dẫn dành cho người mới bắt đầu về cách tối ưu hóa hình ảnh cho công cụ tìm kiếm.

Phần thưởng: Cho phép người dùng tải hình ảnh lên WordPress

Bạn cũng có thể muốn cho phép người dùng tải hình ảnh của riêng họ lên blog 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 điều hành một website nhiếp ảnh chấp nhận hình ảnh do người dùng tạo.

Đối với điều này, bạn có thể sử dụng Biểu mẫu WPlà plugin form liên hệ tốt nhất trên thị trường. Nó đi kèm với 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 gửi hình ảnh.

Đầu tiên, bạn sẽ cần phải cài đặt và kích hoạt Biểu mẫu WP plugin. Để biết chi tiết, hãy xem hướng dẫn của WPBeginner Việt Nam về cách cài đặt plugin WordPress.

Sau khi kích hoạt, hãy đến WPForms » Thêm mới màn hình từ dashboard WordPress để khởi chạy trình tạo form.

Từ đây, bạn cần nhập tên cho form của mình rồi nhấp vào nút ‘Sử dụng mẫu’ bên dưới mẫu ‘Biểu mẫu liên hệ đơn giản’.

Chọn mẫu form liên hệ

Thao tác này sẽ tải mẫu vào trình tạo form, tại đó bạn sẽ thấy bản xem trước ở bên phải và các trường có sẵn ở cột bên trái.

Từ đây, hãy kéo và thả trường Tải file lên vào form và nhấp vào đó để custom thêm các cài đặt.

Thêm trường tải file lên

Bạn có thể thay đổi nhãn và mô tả của trường và thậm chí chỉ định extension được phép.

Ví dụ, nếu bạn chỉ muốn cho phép các file JPEG và PNG, thì bạn phải nhập các option này vào trường ‘Phần mở rộng file được phép’. Hãy nhớ phân tách từng extension 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 ảnh upload ở cột bên trái.

Cấu hình cài đặt trường

Để biết hướng dẫn chi tiết hơn, bạn có thể xem hướng dẫn của WPBeginner Việt Nam về cách cho phép người dùng tải hình ảnh lên WordPress.

Khi hoàn tất, chỉ cần nhấp vào nút ‘Lưu’ để lưu cài đặt của bạn.

Tiếp theo, mở trang/bài đăng mà bạn muốn thêm form tải hình ảnh lên. Khi vào đó, nhấp vào nút ‘+’ ở góc trên bên trái của màn hình để mở menu block

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

Xác định vị trí và thêm block WPForms

Chỉ cần chọn form tải file hình ảnh mà bạn đã tạo từ dropdown menu.

Cuối cùng, nhấp vào nút ‘Cập nhật’ hoặc ‘Xuất bản’ để lưu cài đặt của bạn. Bây giờ, bạn có thể truy cập trang WordPress của mình để xem form đang hoạt động và người dùng sẽ có thể gửi hình ảnh của họ bằng form.

Chúng tôi hy vọng bài viết này giúp bạn biết cách thêm hình ảnh đúng cách vào WordPress. Bạn cũng có thể muốn xem hướng dẫn dành cho người mới bắt đầu của WPBeginner Việt Nam về cách thay đổi chiều cao và chiều rộng của block trong WordPress và các lựa chọn chuyên gia của WPBeginner Việt Nam về các theme WordPress tốt nhất cho các nhà thiết kế đồ họa.

Nếu bạn thích bài viết này, vui lòng đăng ký theo dõi WPBeginner Việt Nam Kênh Youtube cho các video hướng dẫn về WordPress. Bạn cũng có thể tìm thấy WPBeginner Việt Nam trên TwitterFacebook.

5/5 - (136 bình chọn)
Facebook
Twitter
LinkedIn
Telegram
Email
Đội Ngũ Biên Tập