Show you how to add this to a blogger website so let's get started [Music] right here I have logged into my blogger dashboard and um the theme that I'm.
Using is called Contempo light which comes by default with blogger and this is how it looks right now so if I open my website this is how the website looks right now so let's go ahead and add it.
Inside a post so you can add this design to a post or a page so if you want to add it inside a page you can go over here to pages and then just create a new page and uh you'll be able to add this.
To the page but I'll just add it inside the post so let's go over here to posts and let's click on new post and here the first thing we need to do is change this into HTML view so if it.
Add the CSS I just create a style tag for that and let's close the style tag over here and let's go to our source code and here in the source code let's go ahead and go to the styler CSS file.
And let's copy the source code from here I'll just go and copy from this line of code because uh this CSS that we see over here is for Center aligning this text now for our website we don't want.
To do that we just want to display the gradient text so let's copy from this line of code till the end and let's paste it inside the style tag now we need to paste the HTML so.
Let's go back and let's go to the HTML file and here we have this H1 so let's copy this and let's paste it over here you can also add another tag if you want so I.
Think we already have an H1 in the heading of our posts so let's change this into an S3 and let's see how it looks so here we have added the HTML and CSS of our.
Posts Related:
- 5 Mind-Blowing FREE Windows Apps (you probably didn't know existed)
- Pakar Tutorial Mengucapkan Marhaban ya Ramadhan Selamat Menjalankan Ibadah Puasa Ramadhan PowerPoint
- How To Add Video In Text In Your Website Using HTML & CSS - Live Blogger BlogSpot
Design now if you go back to the source
Code here we can see that we have added this gradient text class now whatever text you add over here inside this tag will be acting as this animated text so.If you go to the CSS file here we can see that we have the colors that we added so you can change these colors to match your needs you can also add and remove new colors over here and uh this.
Is the animation so you can change the animation Styles you want so right now it is setting the background position of this uh linear gradient so that's why we can see that the text color is moving to.
The right and the left and then here we can see we have the duration of the the animation and the using function and here we have added infinite because we want to run it for infinite amount of.
Times so this is basically the CSS of our design right now let's go ahead and publish this and confirm and here we can see that our post has been published let's click on.
View and here we have the animated text display but we have some problems in the CSS so let's right click over here and go to inspect and let's see what's the problem and here we can see we have the.
S3 and let's see what's the problem so here let's scroll down here we can see for the post body we have a line height of 1.6 M and if I remove the line height now we can see that we have the correct.
Animation for our text so we need to remove the line height from this uh text so let's go back to our post and let's go to the gradient text and uh let's type line height and I think the default.
Is one so let's click on update and let's reload this page and now we can see that we have the correct CSS and we have the animated gradient text displayed over here so you can add.
Any text you want over here and it will
Be displayed as the animated text so if I just type live blogger and update let's go back and reload and here we can see live blogger is displayed with the.Animation so that's basically how you can add this gradient animated text to your blogger website so that's basically it for this video if you have any doubts you can you can ask in the comments.
Below and if you like this video please click on the like button and subscribe to this channel to get the latest video updates thanks a lot for watching have a nice day.
