![Steemit thumbnail.jpg](https://steemitimages.com/DQmQsmo2h6fFMEzrM2CUyMKg1zhCFK8jjztDtemQ6neeSXR/Steemit%20thumbnail.jpg)

# Hi dear folks!

today I'm going to show you how to create amazing click buttons for your steemit posts, so can increase your visual quality  and reduce some spacing, for exmaple like this one:

<center>
[![Hello I'm a click button.png](https://steemitimages.com/DQmcwp27EMuPyzNr318p6bxAoLbKrD1pUSaXQEGQEtEQWJC/Hello%20I'm%20a%20click%20button.png)](https://steemit.com/@carlosd15)
</center>

***

# <center>  1. Creating the shape</center>


Open what ever software you can handle easily to create some shapes and include text. On this post we are going to use PowerPoint as design tool for it. Please open a new PowerPoint document.

http://tdescargas.org/wp-content/uploads/2017/07/C%C3%B3mo-mejorar-un-Power-Point.png

You may want to erase everything on the canvas to have full freedom to work on creating the shapes, so please erase this Title boxes.

![](https://steemitimages.com/DQmSkvmTTYTF6t4bfg1M2u7BLpepHA9S5sSG1SMCN2KL3kW/image.png)

Now you should have something like this:

![](https://steemitimages.com/DQmSnc9tEf5mWB2MMkh7R86jhAGFz6XNAzCG3Mp5JnjSAfj/image.png)

Then please go to Insert and insert a Rectangle: rounded corners shape.

![](https://steemitimages.com/DQmaVdmXgoegUxF3hReyM44hPJovKB8xBYfT4sisSAauRrA/image.png)

![rectangle.png](https://steemitimages.com/DQmWv9AvDJSpV4PjiMXL8hkDcJGZkggsQyVYmCnp6GG91tX/rectangle.png)

Click on the white canvas to create the rounded corner rectangle shape

![](https://steemitimages.com/DQmV4yJJoFJMK2SwDextpi1tATg3oWNfvuLqqusCgrXLt9S/image.png) 

Now please format the this shape to 1 cm x 5 cm size

![](https://steemitimages.com/DQmcXSjzHsAfxuc7MAqA6hcpGYM1sF4WVMWJFMfsY6dN9DY/image.png)

it should look like this:

![](https://steemitimages.com/DQmZnRsbgmcTTSVKxxnT5hrJgzE2ea7i6FBCX2XFNT8Rjfq/image.png)

For following the shape of this tutorial please erase the outline stroke and round the corners by dragging the yellow dot to the right until it rounded the corners totally, otherwise you can leave it like it is to make your own click button.

![rectangle 2.png](https://steemitimages.com/DQmXPZimB2ZRLPYZshqHGqPdQWcy1WArUBUsht4dX2Yq7Kk/rectangle%202.png)

<center>![rectangle 3.png](https://steemitimages.com/DQmTRypWJjTPAU8aAyeK9Sp6Nb7pvSeEXE1fmSCDxTk4ZEt/rectangle%203.png)</center>

Ten please change the color on the fill options to red. Again you can change it to whatever you want :)

it should look like this:

![rectangle 4.png](https://steemitimages.com/DQmWGUo8DWptjV41MsUgjGLgkU1rMemYYvSCWq6385dfHVR/rectangle%204.png)

Please type inside the shape whatever you want to include, for this purpose I'm typing "hello I'm a click button" select the font that you like the most and set the font size to 11 pt for this shape size.

![rectangle 5.png](https://steemitimages.com/DQmeEVaiE8TzBcPUYiZxyze5v9rU19qi5ZpYeKWo7SETkRd/rectangle%205.png)

We are almost there. Then you may want to stylish it a little by incling some shadow please follow this set up by right clicking, going to Format Shape and Effects, and set the shadow like this:

![rectangle 6.png](https://steemitimages.com/DQme37ooiB5wDAW7NkpwkM1qdi3v8u9CNURS2gsNxHUt28x/rectangle%206.png)

Finally after creating a cool looking click button you may want to save it as PNG and save it to the desktop. Please right click and save it as a picture.

![rectangle 7.png](https://steemitimages.com/DQmNThHxr1B2ozKZGW95imCrhWG4cMFhhg5kbmRyFBDVXio/rectangle%207.png)

Save it as PNG Portable Network Graphics Format:

![](https://steemitimages.com/DQmUd1ChiQ2thiseYRAySqy3v2HPKfgukd8rNEtt4nLP2Vw/image.png)

***

# <center> 2. Making it functional </center>

Now it is time to create a new post to include the new awesome click button. For this you will need to learn some easy coding language.

Please type the next:

![click b.png](https://steemitimages.com/DQmfHzja6EcDBRj4XMYS3VFNA9TH8Jaoq8p7HKYFtC2kGyT/click%20b.png)

Please follow this:

> Inside the yellow square corner brackets you are going to include the direction of your image.
>
> Inside the green parentheses you are going to include the URL of whatever you want to show after clicking the button.
 
< center > [ **YOUR IMAGE DIRECTION** ]  ( **YOUR URL HYPER LINK**  )  < / center >

Please ignore the spacing on the last line and you are ready to go!


<center>
[![Hello I'm a click button.png](https://steemitimages.com/DQmcwp27EMuPyzNr318p6bxAoLbKrD1pUSaXQEGQEtEQWJC/Hello%20I'm%20a%20click%20button.png)](https://steemit.com/@carlosd15)
</center>


***
<center>[![Follow me @carlosd15.png](https://steemitimages.com/DQmWVhni67kge1LGNaRAdQ9Ywena89DmTLG9EKd1aMxWPhJ/Follow%20me%20%40carlosd15.png)](https://steemit.com/@carlosd15/)</center>
***
## <center>😺 Do you want to help me? 😺</center>
>
> I'm a self employeed graphic designer who dreams on having his own business and plenty dedication to his profession. 
>
> I'm spending time and effort with so much energy to bring cool content almost daily! 
> 
> If you want to extend your love to my ideas  it is super easy to do :)
> You can decide on:
>
> 1. [Following](https://steemit.com/@carlosd15/)
> 2. Upvoting 
> 3. Resteeming
> 4. Commenting 
> 5. Sending SBD or STEEM tips to my account @carlosd15
>
> ## <center>You can get in contact with me through: </center>
>
> <center>Discord app:</center>
> <center>[![Join discord chat.png](https://steemitimages.com/DQmRSsMHcnRf7xUHLYAcrs9ZDr8JdUkrHgsj8WU7A4P3jyK/Join%20discord%20chat.png)](https://discord.gg/jKGxd3R)</center>
> 
> <center>Steemit Chat:</center>
> 
> <center>[![Join Steemit chat.png](https://steemitimages.com/DQmQ92RESXhrAeTMZ958gEj4MA6ibKQKx9Vg6Fo5m7UPX93/Join%20Steemit%20chat.png)](https://steemit.chat/direct/Carlosd15)</center>
>
> ## <center>😺Thank you for reading! 😺</center>