mirror of
https://github.com/tabler/tabler.git
synced 2026-08-30 22:01:28 +04:00
35 lines
1.2 KiB
Plaintext
35 lines
1.2 KiB
Plaintext
---
|
|
title: Social icons
|
|
summary: Social icons are a great way to make your website more engaging and user-friendly. You can use social icons to help users quickly find your social media profiles and connect with you.
|
|
description: Add social media icons with the socials plugin. Link users to your profiles with recognizable, consistently styled buttons.
|
|
css-plugins: [socials]
|
|
---
|
|
|
|
import Example from '@components/Example.astro'
|
|
import Socials from '@components/Socials.astro'
|
|
import CdnImportPlugin from '@components/CdnImportPlugin.astro'
|
|
|
|
## Installation
|
|
|
|
This part of Tabler is distributed as a plugin. To enable it you should include `tabler-socials.css` or `tabler-socials.min.css` file in your page.
|
|
|
|
You can also include the plugin via CDN:
|
|
|
|
<CdnImportPlugin plugins={['socials']} />
|
|
|
|
## Social icons
|
|
|
|
To create a social icon, add the `social` class to a component and provide the class `social-app-*` with the social app whose icon you want to use.
|
|
|
|
<Example>
|
|
<span class="social social-app-facebook"></span>
|
|
<span class="social social-app-x"></span>
|
|
<span class="social social-app-instagram"></span>
|
|
</Example>
|
|
|
|
## Social apps list
|
|
|
|
Here is a list of all available social apps:
|
|
|
|
<Socials />
|