As a new-ish blogger with no budget to buy cute, unique templates and fonts for your blog, I always try to learn from my youtube editing skill or creativity I might say, to bring out the best appearance for my blog. Of course, "don't judge a book by it's cover", I mean "don't judge a blog by it's look", but we all know the fact that the first thing that pop in the readers' eyes is the view of a blog. So I've just discovered a very simple way to add the Icon in your blogger page with links included which was ever so easy. And yes, I will show it to you, step by step, you're welcome in advance:
Step 1: Find or purchase the perfect social media icons templates. What I did is I googled "tumblr social media icons" ( the word "tumblr" always makes things a billion better ). It will then come up with multiple icons in different shapes and sizes for you to choose from. Pick the one you like and save it to your desktop,
Step 2: Open PhotoFiltre 7 ( link download here ) or any photoshop programs you know. I will go with PhotoFiltre.
- Click "File"à"Open" to choose the saved picture.
- Click the mouse shape in the right side, then click the rectangle shape.
- It will pop up with just the icon only but it still has the white or its own background color so we want to transfer it to be having transparent background by clicking the "transparent colors" button on the top.
- Then click 'OK" if the color says matches the icon's background color and the background will automatically become transparent.
- Click "File"à"Save as" to save the picture to your desktop. Remember to set it in PNG so the picture can be able to be used.
- Do the same with others icons for every social media that you have.
Step 3: Open your blogger account and go to "New post" ( You should remember that this post should NEVER be published or deleted. Unless you want to delete it.
- Add all the icon pictures into the post and order them how ever you would like.
- Click the mouse shape in the right side, then click the rectangle shape.
- Drag the mouse to create a rectangle shape around the chosen icon.
- Right click and choose "crop image".
- It will pop up with just the icon only but it still has the white or its own background color so we want to transfer it to be having transparent background by clicking the "transparent colors" button on the top.
- Then click 'OK" if the color says matches the icon's background color and the background will automatically become transparent.
- Click "File"à"Save as" to save the picture to your desktop. Remember to set it in PNG so the picture can be able to be used.
- Do the same with others icons for every social media that you have.
Step 3: Open your blogger account and go to "New post" ( You should remember that this post should NEVER be published or deleted. Unless you want to delete it.
- Add all the icon pictures into the post and order them how ever you would like.
- To add link to your icons so when people click them, they will automatically open a new tab straight to your social media, click the icon image and then click "Link" (sometimes you have to click it twice).
- Copy and paste your social media links in the "web address", if it's email address then pick the second one and type your email address in. Do this to all of the images.
- Save the blog, then click the HTML button on the left of the page. There will be a paragraph that full of codes, copy the codes by right click and copy or by entering Ctrl+v.
- Go back to your blogger account (www.blogger.com) à"Layout"à"Sidebar-right-1"à"Add a gadget"à"HTML/JavaScript"àPaste the codes you just copied and type in the title you want it to be called.
- Click "Save"à"Save Arrangement" and you are finished. Good Luck! ♡
No comments :
Post a Comment