social links

A CodePen plugin to easily display links to your social profiles within a Pen - see bottom right.

Usage

1. In your JavaScript Pen settings add the external js file:
   https://codepen.io/woodwork/pen/XXZaGQ.js
2. Call the social() function and pass through your social profiles in the format "WebsiteIndicator/YourUsername" You can pass through as few or as many as you like - but not too many, you don't want to look desperate.

   For personal websites: drop the WebsiteIndicator and just pass through "/anywebsite.com".

   social("twitter/username", "codepen/username", "linkedin/personal-url", "/yourwebsite.com");
3. Customise:
   
   The default theme is dark, positioned at the bottom with no message. You can change these by passing through "light", "top" and "Any message you like!":
   social("codepen/woodwork", "top", "light", "Made with ♡ by Joe Harry");

   Oh, and if you like discos, you'll also want to pass through "disco".

4. Optionally: save your Pen as a template to easily include your social signature in future Pens.

Links

Feel free to request more...

social(...);

- "codepen/username",

- "twitter/username",

- "dribbble/username",

- "github/username",

- "instagram/username"

- "/yourwebsite.com"

- "facebook/personal-url",

- "linkedin/personal-url",

note: don't include /in/

Customise

Optionally pass through these config settings with your links

"light" - light theme

"top" - position top

"disco" - disco hover mode

"Follow me!" - display a message below your links

You can override the message font by targeting #social-message{} in your CSS.