Home
Tài liệu

Thiết lập cơ bản của trang

GiangDongHa

Tạo url hình ảnh

Trong suốt bài đọc này, chúng ta sẽ cần tạo url của nhiều hình ảnh khác nhau để đặt chúng vào đúng vị trí của chúng. Phương pháp tốt nhất để tạo url hình ảnh khi sử dụng chủ đề này như sau:

  1. Đi tới Bố cục Blogger.
  2. Nhấp vào biểu tượng bút chì bên cạnh tiện ích Tải ảnh lên .
  3. Chọn Tải ảnh từ máy tính lên .
  4. Tải hình ảnh của bạn lên bằng cách nhấp vào Chọn tệp . Đợi cho đến khi hình ảnh được tải lên đầy đủ.
  5. Nhấp vào nút Lưu .
  6. Nhấp vào biểu tượng bút chì một lần nữa.
  7. Bây giờ bạn có thể sao chép url có sẵn trong trường URL hình ảnh vì đó là url của hình ảnh bạn vừa tải lên.

Thẻ meta

Thẻ meta cung cấp thông tin quan trọng cho trình duyệt và công cụ tìm kiếm, tăng cường SEO và tối ưu hóa hiển thị trang.

Biểu tượng yêu thích

Chúng tôi biết rằng favicon có thể được tải lên thông qua cài đặt Blog, nhưng biểu tượng được tải lên thông qua nó không có sẵn ở nhiều kích cỡ. Do đó, theo mặc định, chủ đề không sử dụng biểu tượng này. Bạn cần cung cấp rõ ràng url của hình ảnh favicon png để tạo url của cùng một hình ảnh ở nhiều kích cỡ để sử dụng trong thẻ meta. Theo mặc định, hình ảnh giả được sử dụng làm favicon.

Bạn muốn thay đổi favicon mặc định. Tìm đoạn mã sau trong Edit HTML và thay thế url được đánh dấu bằng url favicon tùy chỉnh của bạn. Hình ảnh phải có tỷ lệ 1:1 với chiều rộng tối thiểu là 512px , tức là 512px*512px , 640px*640px , v.v.

<Variable name="meta.icon" description="Favicon URL" type="string" default="" value="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEisldTSPR5qQSsrqZDyfYV81HFSq4Pko5u8xpbzKJ7V05CZAaCkfxG550uqbp2xlCxukxcVL4i2so2XxNri-wqqUO0yuVLLznfFes1rdmg7Ywq8pWE8FXwWQfcyrNiAPlyI3_ngX12x7-KGzAVPfjiTWPMP3HdwelG4pn729xMfH05-hdWVbQyaIsgMkQg/s0/favicon.png"/>
[!] Favicon URL
[!] @type {String}
[!] Recommended image ratio: 1:1
[!] If Blank: It will use Favicon URL from Blogger Blog Settings
[!] Warning: Dont't add invalid URL

Nếu bạn muốn sử dụng favicon được tải lên thông qua cài đặt Blog, hãy xóa url hình ảnh trong valuethuộc tính và để trống.

Hình ảnh mặc định của Opengraph

Thẻ meta hình ảnh Opengraph sử dụng hình thu nhỏ của bài đăng hoặc trang nếu có. Do đó, chúng ta cần sử dụng hình ảnh mặc định nếu không có hình thu nhỏ hoặc cho trang chủ và các trang khác.

Để sử dụng hình ảnh mặc định cho những trường hợp như vậy, hãy tìm đoạn mã sau trong Edit HTML và thay thế phần được đánh dấu bằng url hình ảnh tùy chỉnh của bạn. Hình ảnh phải có tỷ lệ 16:9 với chiều rộng tối thiểu là 1280px , tức là 1280px*720px , 1920px*1080px , v.v.

<Variable name="opengraph.image" description="Open Graph Image URL" type="string" default="" value="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgXxFjLFkLM3eZsKgzpO8R-f3pQPsb-ica2dzqZ-TpJw-fhOsZMG3fUs6UzvcualJbzE9xoUPtqIAI68pQcy9E2IXSFt8SxYEpcaIln78PEZzj1S-iiDp4aJtwNdkImyH5oEtzuzKUxetnUMMjaJWhi6BTLBkNxQX8tUzsL3Q2hqQq_hBF7_w6z5yUYxws/s0/open-graph-image.png"/>
[!] Open Graph Image URL
[!] @type {String}
[!] Recommended image ratio: 16:9
[!] If Blank: Doesn't add meta tag if any not available
[!] Message: If the view is single item, it will use thumbnail url of item if available
[!] Warning: Don't add invalid URL

Tìm đoạn mã sau trong Edit HTML và thay thế url được đánh dấu bằng url logo tùy chỉnh của bạn. Logo phải có tỷ lệ 1:1 với chiều rộng tối thiểu là 512px , tức là 512px*512px , 640px*640px , v.v.

<Variable name="metadata.organizationLogo" description="Metadata Organization Logo" type="string" default="" value="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgLYXKas2Slg6XQSDnVv2sZp3WrBMgpRTTNdEEmBCO54XHW3kmftJKJMU-CrNBEwOn0CU1J-KwAeGuS-ETuCpXhZob0AYrl789Lrwu_T_CDJYJ2k1hOQ-ur_Ek-iEAIm5-0C-nMjY8DtWtfyZfRaOXJC8mdBvdunVCbObp9ra6rMrcSg7jGCf298UE13as/s0/organization-logo.png"/>
[!] Metadata Organization Logo
[!] @type {String}
[!] Recommended image ratio: 1:1
[!] Warning: Don't add invalid URL

Hình thu nhỏ lược đồ mặc định

Sơ đồ bài viết sử dụng hình thu nhỏ của bài đăng hoặc trang nếu có. Do đó, chúng ta cần sử dụng hình ảnh mặc định nếu không có hình thu nhỏ.

Để sử dụng hình ảnh thu nhỏ mặc định cho những trường hợp như vậy, hãy tìm đoạn mã sau trong Edit HTML và thay thế phần được đánh dấu bằng url hình ảnh thu nhỏ tùy chỉnh của bạn. Hình ảnh phải có tỷ lệ 16:9 với chiều rộng tối thiểu là 1280px , tức là 1280px*720px , 1920px*1080px , v.v.

<Variable name="metadata.defaultThumbnail" description="Metadata Default Thumbnail" type="string" default="" value="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgvC6vD6OtRfm9LfBlmnU43YBdoPU22C5TbYwdvBh-tcs70b-uyK7D_iri6WRtUUrtvSrhJrp5vo3IQTo-ta0t_J1VrozfN3ZdCapfbhEKcqMgphQeM3clXm8goom0uOKITSosfDKij6h9AUyYyZ7-nliDKV5EOiE9YyzFA_yW1vtud1lIt_mgTxGpBHUA/s0/metadata-default-thumbnail.png"/>
[!] Metadata Default Thumbnail
[!] @type {String}
[!] Recommended image ratio: 16:9
[!] Warning: Don't add invalid URL

Sơ đồ bài viết

Chủ đề sử dụng loại lược đồ Article cho các trang blog và loại lược đồ BlogPosting cho các bài đăng trên blog. Bạn cũng có thể thêm nhãn News vào bài đăng để sử dụng loại lược đồ NewsArticle cho bài đăng đó.

Tỷ lệ hình ảnh

Phần này cung cấp cho bạn thông tin về tỷ lệ và kích thước hình ảnh bạn nên sử dụng.

Đăng hình thu nhỏ

Để đảm bảo hình ảnh của bạn không bị cắt trên bản xem trước, hình thu nhỏ, v.v. của nền tảng mạng xã hội, chúng tôi quyết định sử dụng hình ảnh có tỷ lệ cố định ở mọi nơi sử dụng hình thu nhỏ của bài đăng.

Chúng tôi khuyên bạn nên sử dụng hình ảnh 16:9 với chiều rộng tối thiểu là 1280px , tức là 1280px*720px , 1920px*1080px , v.v. làm hình thu nhỏ cho bài đăng hoặc trang của bạn. Đối với hình ảnh bài đăng khác ngoài hình thu nhỏ, bạn có thể thoải mái sử dụng hình ảnh có bất kỳ tỷ lệ hoặc kích thước nào.

Để đảm bảo hình ảnh vòng quay không bị cắt, hãy sử dụng hình ảnh có tỷ lệ 5:2 với kích thước tối thiểu là 1080px , tức là 1080px*432px , 1920px*768px , v.v.

Đối với logo ở chân trang, hãy sử dụng hình ảnh có tỷ lệ 1:1 với chiều rộng tối thiểu là 512px , tức là 512px*512px , 640px*640px , v.v.

Nhảy đột phá

Vào năm 2009, Blogger đã giới thiệu Jump Breaks . Với Jump Breaks, bạn có thể chỉ hiển thị một đoạn trích của bài đăng trên trang chỉ mục của blog. Blogger sẽ chèn liên kết Đọc thêm vào trang bài đăng đầy đủ, nơi người đọc của bạn có thể tiếp tục đọc.

Rất khuyến khích thêm Jump Break sau đoạn đầu tiên hoặc đoạn thứ hai của mỗi bài đăng. Có hai cách để thêm Jump Break vào bài đăng của bạn. Cách đầu tiên là nhấp vào biểu tượng Insert Jump Break trong chế độ xem Compose và cách thứ hai là thêm <!--more-->trong chế độ xem HTML.

Cảnh báo!
Nếu bạn không thêm dấu ngắt dòng trong bài đăng của mình, mọi thứ có thể bị hỏng nếu bất kỳ bài đăng nào của bạn có quá nhiều nội dung. Phân trang sẽ không hoạt động như mong đợi, số lượng bài đăng bạn muốn hiển thị trên trang chỉ mục sẽ không được tôn trọng, không có bài đăng nào của bạn được hiển thị trên trang chỉ mục và nhiều hành vi bất ngờ khác. Điều này không chỉ áp dụng cho chủ đề của chúng tôi!

Phục vụ hình ảnh WebP

Blogger gần đây đã thêm tùy chọn phục vụ hình ảnh WebP trong Cài đặt Blog, có thể bật tùy chọn này để tự động phục vụ hình ảnh bài đăng ở định dạng WebP . Blogger thực hiện điều này bằng cách tự động thêm rwtham số vào hình ảnh bài đăng. Nó cải thiện hiệu suất của các trang web.

Bạn nên bật chế độ phục vụ hình ảnh WebP từ Cài đặt Blog.

Post a Comment