Làm thế nào để Thêm Emoji vào Website Bất kỳ

Hỗ trợ trình duyệt cho Emoji vẽ là vẫn còn khá nghèo , vì vậy không có đảm bảo rằng người dùng sẽ có thể nhìn thấy các biểu tượng cảm xúc vinh quang bạn đã dành chọn quá lâu.😰

May mắn thay, với việc phát hành gần đây của Twitter của thư viện Twemoji , bạn có thể thêm hỗ trợ Emoji trực tiếp đến trang web của bạn trong một vài dòng mã, chứ không phải dựa trên trình duyệt để chăm sóc nó!😄

Thư viện Twemoji có thể phát hiện các ký tự Unicode Emoji trong văn bản và chuyển đổi chúng thành những hình ảnh của biểu tượng cảm xúc tương ứng. Ví dụ; bạn có thể cung cấp cho nó một ký tự Unicode Emoji unrendered, mà có thể sẽ hiển thị như ???? trong nhiều trình duyệt, và nó sẽ trở lại một thẻ liên kết với một hình ảnh của biểu tượng cảm xúc đó, mà sau đó bạn có thể chèn vào DOM để thay thế chỗ trống ???? tính cách.

twemoji.parse('􏿿');

// Returns
<img class="emoji" draggable="false" alt="☕" src="http://twemoji.maxcdn.com/16x16/2615.png">

Điều này là rất tốt vì nó là, tuy nhiên Twemoji đi một bước xa hơn.Bạn chỉ có thể vượt qua các parsephương pháp một tham chiếu đếndocument.body, và nó sẽ tìm và thay thế tất cả các ký tự Unicode Emoji trong với ứng tag! Điều này cho phép bạn thêm các hỗ trợ Emoji đầy đủ để trang web của bạn trong ít hơn 10 dòng mã.
EMOJI.JS

window.onload = function() {

  // Set the size of the rendered Emojis
  // This can be set to 16x16, 36x36, or 72x72
  twemoji.size = '16x16';

  // Parse the document body and
  // insert <img> tags in place of Unicode Emojis
  twemoji.parse(document.body);

}

EMOJI.CSS

img.emoji {  
  // Override any img styles to ensure Emojis are displayed inline
  margin: 0px !important;
  display: inline !important;
}

Đừng quên để bao gồm các tập tin twemoji.min.js, trong đó có sẵn trên MaxCDN cho thuận tiện.

<script src="//twemoji.maxcdn.com/twemoji.min.js"></script>  

Bởi bao gồm cả các mã trên, bạn có thể chèn các ký tự Unicode Emoji vào bất kỳ văn bản về an toàn trong kiến thức trang web của mình rằng họ sẽ được hiển thị cho người dùng.

Thật tuyệt khi có một cách nhanh chóng như vậy để đảm bảo tầm nhìn Emoji, bất kể nền tảng được sử dụng, các trình duyệt được xây dựng trong hỗ trợ Emoji, và không có nhu cầu mở rộng trình duyệt. Cuối cùng bạn có thể thể hiện mới của bạn Emoji miền trong tất cả đó là vinh quang!