Friday , 31 March 2017
Home » Wordpress » Plugins » How to post codes like HTML, XML, CSS…etc in wordpress WP post editor

How to post codes like HTML, XML, CSS…etc in wordpress WP post editor

While making my last post, How to create an ‘About the Author’ Widget below post body on blogger, I wanted to post HTML XML codes in WordPress post. When I added the XML codes for it in wordpress using default post editor and checked, there was an error in it. It is that the style/character of the single quotes was changing when I posted it on WP. And therefore, when i used the code in XML template it showed errors. Here is a simple representation on how the character of quotes differ in WP and others

Difference in the Quotes of WP and others

How to Insert HTML codes in wordpress psot

So i had got some problems for posting XML codes in WordPress and I tried hard to find a solution for it and googled many times. But hadn’t got a good result. There are also several other problems also like that sometimes the code may work and create difficulties for browser, or sometimes it may make a widget inside post….etc. Alas I found a unique solution for all of these.

How to post / Insert codes like HTML, XML, CSS…etc in wordpress articles through WP post editor ?

The solution is very simple and is just to add a plug-in to WP. There are several plug-ins which helps you in this purpose (but it’s a great trouble to find all of them, very hard even by googling..), but i personally prefer the most used syntax highlighter. I’m using a pro version of it which supports HTML, CSS, PHP, C++, XML……etc. This tool will also gives a good background to the codes and even adds line numbers to it. The codes included in this section can be easily copied to the clipboard and are easily available to print. All these facilities makes it unique. Here is a screenshot of how the code will looks like when you use it ->

The process of making this code shown like this is really simple. Just install the plug in and add BB code (the name of the type of code. for eg: if you are using xml codes, paste the code inside [ xml ] code here [ / xml ] ) and add the codes inside this. Here is a live preview of it.


There may be several texts like

'test1'

<test2>

"test3"

[test 4]

It’s very easy na. So hurry and use this plug-in if you too want to use some codes on your post and display it to your readers….

About Rajeel

I'm Rajeel, a teen blogger from India who loves computers, sports, internet and all other kind of tech stuffs. This blog thing is one of my favourite hobby and the one that eats up much of my time. But Really, I'm loving it :) Find me in G+

8 comments

  1. Interesting stuff 🙂 You share great content dude, keep rocking !

  2. Nice share bro, I too had this similar problem but I solved it using a plugin. I dunno which is installed but I have installed something for code and syntax in posts

  3. Cool, Good post. I was looking for this
    .-= TechGyo´s last blog ..How To Make Cool Manga Avatar For Your Profile ? =-.

  4. Each of our preferred modern society may have people are convinced how to reduce weight is usually to shed them quickly. This simply means placing our-self in a state about denial in addition to adhering to a diet program that may be mostly unsustainable. These days, ad servers pay out enormous to point out most people the best way and additionally actually eat junk food, chances are they expend tons attempting encourage people that you can lose weight quickly.

    [url=http://loseweight-losebelly.com/how-to-lose-weight-fast/]learn how to lose weight fast[/url]
    [url=http://loseweight-losebelly.com/how-to-lose-weight-fast/learn ]how to loose weight fast[/url]
    [url=http://loseweight-losebelly.com/how-to-lose-weight-fast/]loose weight fast in weeks[/url]
    [url=http://loseweight-losebelly.com/how-to-lose-weight-fast/]how to lose weight fast for men[/url]
    [url=http://loseweight-losebelly.com/how-to-lose-weight-fast/]lose belly fat[/url]
    [url=http://loseweight-losebelly.com/the-diet-solution-program-reiew/]the diet solution program scam[/url]
    [url=http://loseweight-losebelly.com/the-diet-solution-program-reiew]the diet solution program review[/url]
    [url=http://loseweight-losebelly.com/the-truth-about-about-abs-review/]the truth about abs scam[/url]
    [url=http://loseweight-losebelly.com/the-truth-about-about-abs-review/]the truth about abs review[/url]

    • Thanks for your spam, we all (really don’t) appreciate your efforts to drive traffic (especially to such an overworked niche) on a site that is trying to help those interested in modifying WordPress.

  5. Thank you for the details, much appreciated !

Leave a Reply

Your email address will not be published. Required fields are marked *

*

Scroll To Top