Tự động thay đổi kích thước hình ảnh cho vừa Blogger

Blogger cung cấp hầu hết các công cụ bạn sẽ cần phải thêm và thay đổi kích thước hình ảnh Blogger nhanh chóng và dễ dàng. Bạn có thể tải lê...


resize blogger images automatically

Blogger cung cấp hầu hết các công cụ bạn sẽ cần phải thêm và thay đổi kích thước hình ảnh Blogger nhanh chóng và dễ dàng. Bạn có thể tải lên hình ảnh trực tiếp trên nền tảng này và thậm chí thay đổi kích thước dựa vào loại nội dung mà bạn đang cố gắng để sản xuất. 

Để làm điều này, tạo ra một bài và nhấn vào biểu tượng hình ảnh nhỏ trên thanh công cụ hàng đầu bên cạnh cài đặt kiểu font. Một cửa sổ pop-up sẽ hiển thị trên màn hình của bạn hỏi bạn nơi bạn muốn tải lên các nguồn hình ảnh. Bạn có một sự lựa chọn giữa việc thêm hình ảnh từ: 

- Chọn từ Máy tính của bạn 
- Trước đó tải lên các hình ảnh trên blog 
- Picasa Web Albums 
- Một URL hình ảnh

upload blogger image

Một khi bạn chọn hình ảnh mà bạn muốn sử dụng, bạn sẽ thấy bốn kích thước hình ảnh để lựa chọn - nhỏ, vừa, lớn, và x-lớn; nó cũng cung cấp cho bạn các tùy chọn để xác định sự liên kết. Nếu bạn thấy rằng bốn kích thước định sẵn không cung cấp kết quả mà bạn mong muốn, có những cách dễ dàng để thay đổi kích thước hình ảnh Blogger để tùy chỉnh kích thước để phù hợp với khu vực bài đăng blog của bạn.

Step #1: Giữ lại chất lượng hình ảnh

Nếu bạn biết rằng bạn sẽ cần phải thay đổi kích thước hình ảnh Blogger khi bạn gửi cho họ vào blog của bạn, hãy chắc chắn rằng bạn bắt đầu với một bức ảnh lớn hơn so với kích thước 640px của các tùy chọn x-lớn. Thật dễ dàng để mang lại một hình ảnh xuống kích thước, nhưng nếu bạn cố gắng để tạo ra một hình ảnh nhỏ lớn hơn, bạn sẽ mất một số chất lượng. Chỉ cần chắc chắn rằng bạn xem ra cho các kích thước tập tin có chứa các hình ảnh; lớn hơn các tập tin, chậm hơn nó sẽ được tải trên trang web của bạn. 

Photoshop là một trình biên tập hình ảnh mạnh mẽ có thể giúp bạn thay đổi kích thước hình ảnh Blogger hoặc sửa đổi hình ảnh của bạn trước khi bạn gửi, nhưng nó cũng là một sự đầu tư tốn kém. Ngoài ra còn có rất nhiều phần mềm miễn phí chỉnh sửa ảnh khác có thể thực hiện các nhiệm vụ đơn giản thay đổi kích thước ảnh. Xác định kích thước bạn muốn hình ảnh để hiển thị trên trang và thay đổi kích thước hình ảnh Blogger để những kích thước; người dùng khác đã phát hiện ra rằng 700px là một kích thước chiều rộng khá linh hoạt, hoạt động tốt trên bài viết. 

Một khi bạn đã thay đổi kích thước hình ảnh của bạn và thêm vào bài viết của bạn, click vào nó và chọn 'kích thước gốc' tùy chọn. Nếu hình ảnh của bạn sẽ vượt quá biên tập bài, nó có thể có nghĩa rằng họ là lớn hơn so với cơ thể của bài viết của bạn, vì vậy hãy khắc phục điều đó và làm cho chúng phù hợp chính xác.

set image to original size

Step #2: Sửa đổi CSS của trang web

Tiếp theo, bạn sẽ muốn thay đổi CSS của mẫu Blogger của bạn cho phù hợp với điều chỉnh. Đừng lo lắng; bạn không cần phải mã hóa nhiều kinh nghiệm để hoàn thành nhiệm vụ này. 
Mở bảng điều khiển Blogger và đi đến 'Template'> Customize. Bạn sẽ thấy các tùy chọn cho 'Nâng cao', click vào nó và tìm cách để 'Thêm CSS tab' ... dán đoạn mã CSS sau đây trong ô trống:
.post-body img {
max-width: 100%;
max-height: auto;
display: block;
margin: auto;
}
Thêm mã để phần này, nó sẽ tự động thêm giữa <b:skin>....<b:skin> thẻ của Mẫu (Template > Edit HTML, trên]]></b:skin> tag). Vì vậy, không có vấn đề cho dù bạn thêm nó ở trên ]]></b:skin> hoặc trong hộp Add CSS, hiệu quả cần được như vậy.

Hãy nhớ rằng khi bạn thay đổi CSS của Template của blog, những thay đổi này sẽ ảnh hưởng đến tất cả các bài viết thêm vào trước đó, bằng cách sử dụng "kích thước gốc" tùy chọn kích thước. 

Để làm đẹp lên bài viết thậm chí nhiều hơn, thêm ba dòng cuối cùng thể hiện trong màu xanh lá cây dưới đây:
.post-body img {
max-width: 100%;
max-height: auto;
display: block;
margin: auto;
box-shadow: none;
border: none;
padding: 0px;
}
Screenshot

resize blogger pictures

Mã này sẽ loại bỏ bất kỳ biên giới và padding xung quanh hình ảnh và cung cấp cho nó một cái nhìn tự nhiên nhiều hơn nữa trong bài. Nhấn nút "Apply để Blog" một khi bạn đã hoàn tất việc thêm nó. 

Lưu ý: Điều này sẽ chỉ thay đổi hình ảnh thiết lập kích thước gốc. Để thay đổi kích thước hình ảnh với kích cỡ khác nhau và áp dụng các thay đổi này trên tất cả các hình ảnh được bổ sung vào bài viết của mình, thêm CSS này thay vì:
.post-body img {
width:100%;
height:100%;
display: block;
}
Xin hãy xét rằng, nếu bạn có bài viết với hình ảnh nổi hoặc bên phải hoặc bên trái của nội dung, họ sẽ tự động chuyển toàn bộ chiều rộng.

Step #3: Tạo bài viết

Sau khi thực hiện những điều chỉnh cho cả hai kích thước tập tin và CSS, bạn có thể quay trở lại với biên tập bài và lặp lại các bước 1 để thêm một hình ảnh. Khi bạn quay lại màn hình yêu cầu về quy mô, bấm vào "kích thước gốc" tùy chọn và xác nhận lựa chọn của bạn. Hình ảnh mới được bổ sung của bạn sau đó sẽ được hiển thị với những điều chỉnh mà bạn tạo ra, để nó vừa vặn với chiều rộng của khu vực bài.

No comments: