Level up your Github profile page in three easy steps

Hacker NoonThis post was originally published by Danilo Del Busso at Hacker Noon

Whether you’re looking for a new position and want to stand out or you just like to make cool things, GitHub offers you the tools to get your own customised welcome message, like this.

The message is surprisingly easy to set up and it’s only limited by your imagination.

I will go through what I did to create mine and how you can replicate it.

1. Create a repository named after you

The first step is to create a new repository that is named after your GitHub username.

You will see this message confirming that you are creating the special repository needed for this tutorial.

2. Create your animated GIF

Here is where your creativity can shine. I suggest you make a GIF which will show on your profile page.

You can create whatever you want. What I have found easiest is to design a quick HTML page with a welcome text and some CSS animations.

Once you have built your webpage (you can check out the code for mine here), you are ready to create your GIF.
Download a screen-to-gif recording app and record your animations. I used peek.

Remember to keep recording for at least 30 seconds after the animations are completed, to avoid looping.

3. Add the GIF to your profile

Once you’re satisfied with your welcome message GIF, you are ready to add it to your profile page.

Upload the GIF to the repository that you created in step 1 and modify the README.md file to include your welcome message.

There are a couple of ways to do so. You can either add the GIF by referencing it as an absolute path like so:

![Alt Text](https://media.giphy.com/media/Ju7l5y9osyymQ/giphy.gif)

You can also use some HTML to achieve the same result.

<img src='https://path/to/animation.gif' />
💡PRO TIP: you can wrap this <

img />

tag in a

<a>

tag to make it a button!

Finally, commit your README.md and share it with everyone who will click!

Spread the word

This post was originally published by Danilo Del Busso at Hacker Noon

Related posts