Generator and we also have added all the functionality so if i make some changes over here we can see that the box shadow is updated over here and if i click on generate code.
We have the css code displayed over here and then we can just copy and paste this code and add it to our css code now in this video i'll show you how to add this box.
Shadow generator to your blogger website so let's get started right here i'm in the dashboard of my blogger website now you can add this box.
At the generator inside a post or a page let's add it inside a post so let's click on new post and for the title i'll just type box shadow generator.
And then you have to make sure that you are in the html view so by default it will be in the compose view so you have to select this option and select html view.
The code so the first thing we will do is we'll copy the link of this font and also the highlight is styles so let's copy all these lines of code from here.
And let's paste it over here right now let's go back and let's copy all the html so let's copy it from here and we'll go all the way till the end so we'll copy it till here.
And let's paste it over here inside our post now you can delete this h1 from here because we already have this title for the post.
So i'll just delete this if you want you can keep it and now the next thing we will do is we'll copy all the javascript so let's scroll down and i'll just.
Create a script tag and in this script tag we will add the javascript so let's go back to our source code and let's go to the main.js file and.
Let's copy everything from here Wesdigital
And i think at the end of this line of code we also need to have a semicolon so i'll just add that over here all right now let's select everything.From here and let's copy it and paste it inside the script tag and now the last thing we need to do is add the css so let's create a style tag over here.
And let's go back to our source code and let's go to the style.css file and let's copy everything from here and let's go back and paste it over here inside the style tag.
Right now let's publish this and let's see whether it looks alright and here we can see we have this post published so let's click on view and now here we can see we have this box.
Shadow generator and let's see whether everything works all right so let's change the values of this slider and we can see that everything is.
Working all right and let's change the color let's also check the inside so everything is working all right let's click on generate code.
And we have the code generated so everything is working all right so that's basically how you add a box shadow generator to your blogger website all right so that's basically it for.
This video and i will leave the link of the source code in the description and if you have any doubts 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 so.