Hướng dẫn chèn code cho temples Mez (Phần 2)

Nó vẫn còn về tài liệu của Các mẫu Mez , là nhằm để dễ dàng tham khảo khi có bất kỳ câu hỏi trong tương lai. Hôm nay tài liệu về cài đặt Mini biểu tượng trong Các mẫu Mez .

Một trong những điều có thực hiện Các Mez mẫu trông mát mẻ là bằng cách cài đặt các Icon Mini ở góc của một widget.

Có hai lựa chọn để cài đặt các biểu tượng, thông qua "Edit HTML" và thông qua "Page Element". Nhưng đối với tùy chọn Page Element, bạn chỉ được phép cài đặt các biểu tượng để các widget HTML / Javascript.

Chuẩn bị Icon

Bước đầu tiên là chuẩn bị các biểu tượng bạn muốn cài đặt, được miễn phí dựa trên sở thích của bạn.Kang Rohman, trong trường hợp này, có các biểu tượng từ Iconspedia .

Sau đây là những mẫu của biểu tượng:

Đối với ngoại hình tốt nhất, bạn nên thay đổi kích thước của các biểu tượng vào 60X60 pixel. Kích thước này vẫn còn thay đổi, nhưng bản thân tôi đã chỉnh sửa CSS khi xác định kích thước.

Tải lên các biểu tượng vào hình ảnh lưu trữ như bạn đã sử dụng hoặc trực tiếp vào Blogger. Ghi lại các biểu tượng URL, ví dụ như:

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgiasJA8ahLe9EauBBcOTwu_7XJvUzdgdulAHTsG4GY18qJ0R2-9mfjjFrP9KCWGZZCZauBiYsjvDjUUiOFfjuQ5oHOWDl_9KHo_Otp_xG8UnEH1pu9GqwzYzToSARdQp_bUylCmKD2lvmb/ 5B1% 5D.png https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiPznQleZDFsov3uv2hlsJHqHLMr3FOVBC58DIYb1S2LswF3ZyU3EEXxYZftPs87AFLUHs_ri_dqDehf86R8amr8mtjVCIuSIgNKauGNUqlKQl3Zj6hzKSlRunNl5zIoenUvXB71_YQWFA/ 5B3 5D.png% https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgLnbpKRtEefHnVkID7wBidYA0dlQVauxTl9nedtEJN9m6KQkQ4GxsEcl-1wEw6hUhs8hOviOL0HYpR49n24jnqxYZkqN8tFKy1qY6Y8yqVwdSnMS4eOvnlRhC7p_pw0Y6qJbRDEQjT6co/ 5B1% 5D.png

Tạo ra các mã HTML cho các biểu tượng, ví dụ như:

<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgiasJA8ahLe9EauBBcOTwu_7XJvUzdgdulAHTsG4GY18qJ0R2-9mfjjFrP9KCWGZZCZauBiYsjvDjUUiOFfjuQ5oHOWDl_9KHo_Otp_xG8UnEH1pu9GqwzYzToSARdQp_bUylCmKD2lvmb/" alt="tutorial" /> <img src = "http://lh6.ggpht .com/_pt7i0nbIOCY/TKnUUWcHN_I/AAAAAAAAC6g/k3-hywXPw-s/browsers_thumb% 5B3% 5D.png "alt =" trình duyệt "/> <img src =" http://lh4.ggpht.com/_pt7i0nbIOCY/TKnQuO-2IAI / AAAAAAAAC54/zZ0zQDGKfH8/Downloads_thumb% 5B1% 5D.png "alt =" download "/>

Và các mã cuối cùng sẽ được thêm vào với:
<div class='icon'> hình ảnh mã </ div>
Vì vậy, các mã có sẵn sàng để được cài đặt sẽ là:

<div class='icon'> <img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgiasJA8ahLe9EauBBcOTwu_7XJvUzdgdulAHTsG4GY18qJ0R2-9mfjjFrP9KCWGZZCZauBiYsjvDjUUiOFfjuQ5oHOWDl_9KHo_Otp_xG8UnEH1pu9GqwzYzToSARdQp_bUylCmKD2lvmb/" alt="tutorial" /> <div> <div class='icon'> <img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiPznQleZDFsov3uv2hlsJHqHLMr3FOVBC58DIYb1S2LswF3ZyU3EEXxYZftPs87AFLUHs_ri_dqDehf86R8amr8mtjVCIuSIgNKauGNUqlKQl3Zj6hzKSlRunNl5zIoenUvXB71_YQWFA/" alt="browser" /> </ div> <div class='icon'> <img src = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgLnbpKRtEefHnVkID7wBidYA0dlQVauxTl9nedtEJN9m6KQkQ4GxsEcl-1wEw6hUhs8hOviOL0HYpR49n24jnqxYZkqN8tFKy1qY6Y8yqVwdSnMS4eOvnlRhC7p_pw0Y6qJbRDEQjT6co/ 5B1% 5D.png" alt = "download" /> </ div>

Xác định các Widget

Bước tiếp theo là xác định các vật dụng sẽ được cài đặt các biểu tượng. Cách dễ nhất để xác định các vật dụng được bởi các tiêu đề của widget .

Các tiêu đề của những widget trên là:

Hướng dẫn hữu ích
Làm việc ở mọi nơi
Free Templates

Bây giờ, tôi giả sử bạn có danh tính của các vật dụng mà bạn muốn cài đặt các biểu tượng. Khi thông tin thêm, các vật dụng có thể được cài đặt với các biểu tượng là ngược widget cột, vật dụng bên, và các vật dụng footer.

Cài đặt mã số biểu tượng

Bước cuối cùng là cài đặt các mã biểu tượng bạn đã chuẩn bị. Cách đầu tiên là thông qua Edit HTML.

Đăng nhập với ID của bạn blogger
Nhấp vào Thiết kế
Nhấp vào Chỉnh sửa HTML .
Thực hiện sao lưu của mẫu đầy đủ của bạn để ngăn chặn từ các lỗi có thể xảy ra. Chỉ cần nhấp vào Tải về bản đầy đủ .
Đánh dấu vào ô nhỏ bên cạnh Expand Widget Templates .
Tìm các mã số vật dụng mà bạn muốn cài đặt các biểu tượng. Như đã đề cập ở trên, cách dễ nhất để xác định các widget là theo tiêu đề của nó. Ví dụ, khi bạn muốn tìm một tiện ích được với hướng dẫn hữu ích , cho cách nhanh nhất, bạn có thể sử dụng Ctrl + F và sau đó nhập vào tiêu đề của widget vào cột sẵn có.
Dán mã của biểu tượng chính xác trên các mã <data:content/>
Làm tương tự cho các widget khác
Click SAVE TEMPLATE .
Thực hiện

Cách thứ hai là thông qua Element, nhưng giới hạn ở những vật dụng của HTML / Javascript , trong khi cho các widget khác như Label, Lưu trữ và những người khác có thể được thực hiện chỉ thông qua Edit HTML như được giải thích ở trên. Rất đơn giản. Bạn chỉ cần dán mã biểu tượng vào contentc của các phần tử này.