Adding HTML Code to Your WordPress Page, Post or Widget

Many WordPress users find it easy to get started because the Visual editor is similar enough to Word that they feel comfortable getting started. But what about those times when you are provided with HTML code to add to your site? If you copy and paste it into the post or page using the Visual editor, it comes out as text, not code. So you lose the functionality of the code, and it ends up looking like this:

<a href="http://bit.ly/OWHS4O">
<img src="https://alewebsocial.com/storage/2012/09/3dcover-400.jpg">
</a>

Here’s how to add functioning HTML code to your WordPress page or post.

 

The result will look like this:

If you want to add it to the sidebar instead, you have to add a text widget to the sidebar and paste the code in there instead. Here’s how to do that.

Comments

  1. Hi,
    I was given a snipet of code to add to the root of my site. I have no clue how to do that. I don’t even understand what the root of the site is. Do you have instructions for doing something like that?

    • Hi, Matt. The root of your site is something you access from the server. You can either sign in using your web host’s cPanel and navigate to the file manager or use an FTP tool like Filezilla. However, given that you admittedly aren’t familiar with the root, I would caution you to be very careful about doing so. The reason so many people can maintain their own websites is because using a tool like WordPress limits what you can break. Working from the server has no precautions in place, so it’s very easy to break things if you don’t know what you’re doing. My recommendation would be to have someone who knows what they’re doing do it for you. If it’s just adding a file to the server, it’d be quick and easy to do, assuming you have the server access info handy. Feel free to contact me through the contact form if you need more help.

  2. Precious Rain says

    when I post the code and go back to the visual editor then there is NOTHING there!
    so it just does not work for me in wordpress, been working on this all day trying to embed a stylesaint code into my wordpress post.
    I had no problems doing in on tumblr but no results at all at wordpress.

    ad by the way, when I am to write a post at wordpress it does not say HTML like it does on yours, mine says Text

  3. Thank you for this. I am not the admin for our WP site at work, but on my own I am doing my blog site in WP. This is helpful!

  4. Yes, this is very helpful as always.

    In 1999 when we were first designing websites, I took an HTML course. After which I decided, we would do the web Design and work with a professional programmer for all code. And that’s what I still do with my blog(s)and those clients I help get started. Every once in a while I decide I’ll insert that little bit of code myself, and I wish I hadn’t!It’s not as easy as it looks and often way too time consuming for a non-pro!

    • Tara Alemany says

      Thanks, CASUDI. I agree that adding HTML code can be intimidating and confusing. But my focus is to empower my clients and readers to recognize that, often, don’t give themselves enough credit. With the proper guidance and training, it is possible to try new things. Notice, my emphasis was on the fact that the HTML was being provided to the reader. Receiving it from a reputable source, like a conference organizer, blog syndicator, publisher, etc. and putting them on a WordPress website is easier than it may seem.

      As always, though, we’re here to serve! So, if any of my readers need the additional assistance, they can always hire us. ๐Ÿ™‚