How To Add Animated Social Media Icons To Your Blogger Website BlogSpot

How To Add Animated Social Media Icons To Your Blogger Website BlogSpot Hi everybody welcome to live blogger in this video i'll show you how to add the social media icons to your blogger website now we can see that these icons are displayed over here and if i hover.

Over any of these icons we can see that the name of the platform is displayed over here in the same way if i hover over any other icon we have twitter displayed over here then we have.

Instagram and youtube now in the same way you can go ahead and add new icons over here and add the text of the company over here now i have shown you how to design this from scratch using.

Html and css in the previous video so if you want to learn how to design this from scratch you can watch that video i will leave the link in the description of this video now in this video we're.

Just going to add these icons to our blogger website and we're just going to copy and paste the code so i will leave the link of the source code as well in the description alright so let's get.

Started here i'm in the dashboard of my blogger website and i'm gonna add these icons.

How To Add Animated Social Media Icons To Your Blogger Website

Inside a post now you can add this in a page as well so if you want to add it inside a page you can go over here to pages and click on new page but i'll just add it inside a new post so i'll.

Just click on new post and he will just add a title so i'll just type about us now here in this post you can go ahead and add your content so by default it'll.

Be in the compose view so you can add paragraph heading or whatever you want over here and once you're done with the content and once you want to add these links you can just go back to the html.

View so let's click on this button and click on html view so you can go to the end of the html of your content and then just go ahead and paste the html of our.

Design so let's go to our source code and you can find the link of the source code in the description so this is the html file so let's go ahead and copy everything inside the body so i'll just.

Copy from here till here till the end of the division and let's copy this from here and let's go back to our blogger post and i'll.

    Just paste it over here Wesdigital

    Now you can go ahead and add your own icons over here so here we can see we are using font awesome icons so these are the code that we use for.

    Font awesome icons and you can go to font awesome.com website and search for your icon or your logo and just copy and paste the code over here.

    And just change the text to whatever you want over here and if you want to remove any of these icons you can just delete the anchor tag and here in the htf you can just add the.

    Link of your social media page so here we can see we are having this anchor tag for facebook so you can just delete this hash from here so you can just add the link of your facebook page over here in.

    The same way you can add the link of your twitter profile over here and instagram and youtube and in the same way if you want to add any other links over here you can just copy and paste.

    One of these anchor tags from here and just change the link over here and the icon and the name all right now the next thing we need to do is add the link of font awesome so.

    This is the link of font awesome so i'll just copy this and let's go back to our blogger post and i'll just paste it over here and now the last thing we need to do is.

    Add the css so let's create a style tag and in the style tag we will paste the css so let's go back to our source code and let's go to the css file and i'll just copy everything from here.

    And let's go back and paste it over here right now let's click on publish and confirm right now let's open this post and let's see how it looks so let's click on view.

    And here we can see we have these icons

    Displayed over here and let's hover over these icons and we have the names displayed over here so everything is working all right so.

    That's basically how you can add social media icons to your blogger website alright so that's it for this video if you have any doubts you can ask in the comments below and i will also leave the.

    Link of the source code and also the design video in the description of this video so if you like this video please click on the like button and subscribe to this channel to get the latest video.

    DISCLAIMER: In this description contains affiliate links, which means that if you click on one of the product links, I'll receive a small commission. This helps support the channel and allows us to continue to make videos like this. All Content Responsibility lies with the Channel Producer. For Download, see The Author's channel. The content of this Post was transcribed from the Channel: https://www.youtube.com/watch?v=KuQARuwnw84
Previous Post Next Post