0:00
Hello everyone, I am Abhishek Wadhi and in this video I will show you how you can highlight
0:04
a text in your WordPress website. You can highlight text in both Gutenberg and Elementor editor
0:10
To do this, go to your WordPress dashboard and edit your existing post or create a new post
0:18
Here select the paragraph where you want to highlight the text and here in the option
0:25
click on Edit as HTML. Now add a mark tag just before the highlighted text like this and close it with closing
0:38
mark tag. Now here click on three dot icon and click on edit visually and as you can see the text
0:51
highlight is added to your Gutenberg editor. Now you can change the color of this highlighted text by adding a CSS code to your theme
1:04
So let me show you. First of all, you have to copy a CSS code from here and go to the appearance section
1:21
of your theme and click on customize. Here click on additional CSS and paste this code here and you can change the default color
1:39
by using the hex code. You can easily get the hex code by searching HTML color code
1:53
Here copy a color and change it here
2:04
Now save this code and let's check if this highlight color is changed or not
2:15
Click on edit. Let's open the preview window
2:29
Okay, your highlighted text is added and you can easily change the highlighted text color
2:36
using that CSS code. So let's take how you can edit, how you can highlight the text in your elementor editor
2:52
Let me just remove the mark tag from here. To highlight text in elementor editor, click on edit with elementor and to highlight this
3:12
click on the text editor and here click on the text button
3:20
Now go to this website again and copy this first section of the code and paste it where
3:32
you want to highlight the text. So I am pasting it here
3:39
Now copy this closing span tag and paste it here
3:52
Now you can change the highlighted color using the hex code. So I am using this color to paste it here
4:04
So in this way you can highlight text in your elementor editor and you can easily change
4:11
the highlighted text color by changing this hex code from here. So let's take it in preview and as you can see the highlighted text color is changed
4:28
So in this way you can easily highlight text using both Gutenberg and elementor editor
4:36
I hope this tutorial is helpful to you. If you really like this video then hit the thumbs up button and subscribe to my channel
4:45
for upcoming videos like this. Thank you
