This is a free (and easy to use) alternative to linktree
![alt text](/alisa-yar/Linktree-Alternative/raw/main/images/demo.jpg)
Example by @ho0ber
https://links.sam.codes
He also build Lazylinks: A simple python package that makes it easy to write content and generate static HTML to be deployed and you can read more about it in his blog
- line 7 - website title
- line 10 - website icon image
- line 14 - profile image
- line 16 - user name
- line 17 - description
- lines 20-49 - your social media links
- line 4 - text color
- line 5 - font
- line 16 - your backround image/color
Let's say to 'red' for the example
- username - add 'color: red;' after line 40
- description - add 'color: red;' after line 44
- both - change line 11 from 'color: var(--textColor);' to 'color: red;'
Netlify (easy to navigate): https://netlify.app
Github Pages (better for begginers): https://pages.github.com
Vercel: https://vercel.com/
Heroku: https://www.heroku.com
I personally recommend using Google Tag Manager and connect it to Microsoft Clarity
Google Tag Menger: https://tagmanager.google.com/
Microsoft Clarity: https://clarity.microsoft.com/
Netlify Analytics (9$ per month): https://docs.netlify.com/monitor-sites/analytics/
Google Analytics: https://analytics.google.com
Here you can choose your wanted icons for each link:
https://fontawesome.com/search?o=r&m=free
- Make sure that you choose only from the "free" section.
- Copy the code for HTML/CSS.
Let's say you want to use book icon instead of the Twitter icon
The line under your wanted link contains this line: "fab fa-twitter"
Then, after founding the icon that you want and its code, paste the code in the same place where was your previous one
The final code shoud look like this: "fa-solid fa-book"
You can change backround to color instead of using an image.
background-color: #7E65F5;
You can find your wanted color code here: https://www.color-hex.com
background-image: linear-gradient (#E8E0FF, #7E65F5);
CSS Gradient Generator: https://www.css-gradient.com/
Coolors (colors palettes): https://coolors.co
ColorsWall (colors palette): https://colorswall.com
CSS color picker from photos: https://imagecolorpicker.com/
CSS color keyword: https://www.w3.org/wiki/CSS/Properties/color/keywords#Basic_Colors
Google Fonts: https://fonts.google.com/
Favicon (icons): https://favicon.io/
BGJar (free svg backgrounds): https://bgjar.com
Box Icons (free icons): https://boxicons.com