0:00
Hello everyone, welcome to K2 blogging and in this video, I will show you how you can
0:04
add custom cursor effect to your blogger and WordPress website. So as you can see, the cursor effect is changed in this website
0:12
And when I switch to this website, the cursor will look like this
0:16
And this is the default cursor that we get in the website
0:21
So you can easily change the cursor property using the CSS code
0:26
And this is a very short code and you need to copy the CSS code and go to the blogger
0:32
website and here in the dashboard, click on themes option and here click on edit HTML
0:40
Now you have to scroll down to the bottom and you have to paste this code just above
0:45
the closing body tag. And let's save this code. Now let's refresh this page and as you can see, the cursor effect is changed in this website
0:58
So in this way, you can easily change the cursor effect. You can also implement the same cursor effect in WordPress
1:05
So to implement this, go to the appearance section and here click on customize
1:11
And here you have to click on the additional CSS section and you have to paste the code here
1:17
So let me just copy this code and here remember that you don't need to add this style tag here
1:23
Just copy the code and paste it here like this. And as you can see, the cursor effect is changed
1:32
And when I remove this code from here, the cursor is back to the normal
1:38
So in this way, you can implement custom cursor effect in both blogger and WordPress website
1:44
So let's check how can change the icon of this cursor. So here I will use this website icon 8
1:51
So here just search for cursor. And here as you can see, you will find a lot of cursor
1:58
You can use any of this icon from here. So let me just pick a cursor from here like this
2:05
I will select this cursor. Click on it. And here you have to click on the embed HTML
2:12
You can also customize the cursor by clicking on this option. Like you can change the color or you can add overlay to the cursor
2:21
So here I will choose the normal one. So click on cancel and here click on embed HTML
2:28
Now I will select the CDN option and here you have to copy the URL
2:33
So just copy this and here extract the image URL from here
2:40
So just copy the image URL and go to the blogger dashboard
2:45
And here you have to change the URL like this. So just change the URL and save your code
2:56
Now refresh this page and as you can see, the cursor is changed to the new one
3:02
So in this way, you can use any of the icon given in this website and use it on your website
3:09
And you can also use another website like icon monster. So let me just search for the cursor
3:15
Or in fact, you can use any of the icon in this website
3:20
So let me just select this one. Click on it and here click on the SVG option and click on I agree and click on embed
3:31
And here switch to the base 64 and here copy the source URL
3:37
So just copy this code and again go to this code and replace the URL like this
3:45
So let me just select this and paste the URL and click on save
3:52
Now let's refresh this page and as you can see, the cursor is changed
3:56
So in this way, you can use any of the icon as a cursor and give your website a professional look
4:05
So you can use this code in any of the platforms like blogger or WordPress
4:11
And if you want to customize your WordPress website, then you can watch this video
4:15
Here I have explained 10 methods to customize WordPress website using CSS code
4:21
I will see you in the next video. Thank you
