How To Add HTML In WordPress Page And Blog Post?
July 21st, 2016 | by Ravi Chahar || Leave a comment |
When you try to craft your blog post or the page for your blog then you may be in need to add HTML to WordPress post. Many times, bloggers try to show the content according to their perspective, not the theme then they add HTML in WordPress page.
Do you know how to add HTML in WordPress page and blog post? Well, it’s not that much hard as you think. If you have a little bit of knowledge about the HTML then you won’t face any difficulty. It just with the use of WordPress post writing area, you can add an extra code of HTML in the blog post.
How To Add Html In WordPress Post?
You may be thinking as if it is something enormous with the coding. Well, there is nothing like that. While writing a WordPress post, you can add any link without using any editor. You can create the boundaries around the content to highlight it.
In this post, I will show you to add the border and around an important content. There are some steps to follow:-
Step 1:- Just login to your WordPress admin panel and go in the blog post writing section.
Step 2:- Suppose if you want to add the border around few lines then you can do it by clicking on the “Text” option shown above.
Step 3:- Now you can see the content with all the HTML tags including the paragraph tag, an image tag, the heading tag and many else. I am going to create the border around few lines.
Just write the lines in between the paragraph tag ( i.e <p> ) or the <pre> tag. Pre tag is used if you want to show the content the way you have written with all the line breaks and spaces.
You should know that in HTML, for every tag there is a starting tag and an ending tag. So make sure you close the tag at the end of the lines. Let me write few lines and add them in between a paragraph tag.
You have to add the style attribute in the HTML element of the paragraph. In the style attribute, the CSS properties have been added. I have added the border width as “1px” and the color is “Grey”. Along with it, the background color of the box is also given. The alignment of the text in the box has justified. If you won’t add the text-align then it would be on the left. You have to insert the code in the starting tag of the paragraph.
The code is
style=”border: 1px solid grey; background-color: cyan; text-align: justify”
The Output is:-
These are the sample lines. These are the sample lines. These are the sample lines. These are the sample lines. These are the sample lines. These are the sample lines. These are the sample lines. These are the sample lines. These are the sample lines. These are the sample lines. These are the sample lines. These are the sample lines. These are the sample lines. These are the sample lines. These are the sample lines. These are the sample lines. These are the sample lines. These are the sample lines. These are the sample lines. These are the sample lines. These are the sample lines. These are the sample lines. These are the sample lines. These are the sample lines. These are the sample lines. These are the sample lines. These are the sample lines. These are the sample lines. These are the sample lines. These are the sample lines. These are the sample lines. These are the sample lines.
If you want to modify the box, you can attach any background image and the CSS properties of padding and margin can be used to adjust the content in the box.
Step 4:- After doing that when you press enter the same code of the paragraph will be continuing. To stop that you have to go to the “Text” and remove the code from the next paragraph so that you can write the simple lines.
Can You Now Add HTML In WordPress Page.
As I have shown above to add HTML in WordPress post. You can insert HTML into WordPress page. You know that that the WordPress writing area is same for the post and the page. So you can follow the same steps. To provide a better look to your blog posts, you should know how to add HTML in WordPress page and the post.
There are many attributes in the HTML languages using which you can transform your post. You can adjust the alignment of the text, you can add any image without any editor. If you want to know anything about it. I am here to help you.
