Lägg till Emoji-stöd till din webbplats med Emoji CSS

Emojis har tagit över digitala konversationer och dessa söta lilla ikoner genomsyrade snabbt internetkultur med ett slag. De är nu en daglig del av våra liv och du kan hitta dem överallt från skrivbordsprogram till WordPress.

Och om du någonsin velat ha det anpassade emojis På din webbplats är Emoji CSS det perfekta biblioteket att använda.

Dessa rena CSS-ikoner är genereras med bakgrundsbilder så varje emoji har sin egen PNG-fil. Dessa bildfiler är retina-ready så de ser bra ut på alla bildskärmar.

Du kan också demo dessa emojis av inklusive den råa CSS-filen till din webbplats. Filen refererar till självhärdade bilder på GitHub så du behöver inte vara värd för något lokalt för att starta.

På Emoji CSS hemsida hittar du alla bildkod klasser tillsammans med ett prov demo snippet. När du har lagt till Emoji CSS-filen till ditt dokument behöver du bara lägga till en element med .em klass, tillsammans med vad som helst klassen avser den specifika ikonen du vill visa.

Så till exempel den här koden:

kommer att lägga till 100 emoji direkt i din webbplats innehåll. Du har det bra över 200 olika emojis att välja mellan och projektet är öppen källa så det är tillgänglig för uppdateringar.

Bäst av alla Emoji CSS hemsidor är super lätt att använda. Bara klicka på en ikon och du ska Kopiera automatiskt källkoden i klippbordet så att du kan klistra in den direkt i din HTML.

Jag kommer att vara den första att erkänna att inte varje webbplats kommer att dra nytta av detta Emoji bibliotek men sociala nätverk och Kommentarsupportade webbplatser kan förbättra användarengagemanget genom att lägga till emoji-support. Och med Emoji CSS-biblioteket är detta praktiskt taget en tvåstegs process för att emoji-upp din webbplats.