Sidebar Fix #1: the < p > tag

WordPress is a very user-friendly back-end to your blogs.  The stuff that you enter – your text, images, videos, comments, go into WordPress’s engines and they do their “thing” to publish it all classy-like.  There are THREE areas of your blog that skip the WordPress engines.  They take your text and publish it directly to the WEB.  These are:

  • text widgets

  • HTML editor

  • theme Editor

So, if you use those three areas of your blog, you need to know a thing or two about HTML.  Remember – whatever you put in those areas will go directly to the web – it will not get filtered and published by your friendly WordPress engine.   Now, unless you know HTML, you really should NOT be using the html editor in the add-new post screen.  And unless you know css AND html, you should not be tweaking your theme through the theme editor.

The text widgets are something that all of us use to one extent or another to put stuff in our sidebars.  We use it for our RSS / feed subscribe buttons, for our twitter buttons, and for any other image or text that we want to put in there.  Unfortunately, those text widgets will break your blog.  Let’s go through the <p> tag to use it properly, and prevent a mishap with an unruly sidebar.

Lesson #1: the <p> tag

If you’ve used a word processor, you know that if you press <enter> key on your keyboard, you get what is called a “hard return”.  This creates the space between paragraphs.  If you press the <shift> and <enter> keys, you get a soft return (on a mac, I believe it is <ctrl> and <enter>).  It just moves the curser to the next line without an extra line.

The <p> tag stands for “paragraph” and is used in HTML to create a hard return. If your theme is styled correctly, it will create a space between your paragraphs.  To USE html tags, you need to know one thing: What you start, you must finish, without exception.  This is especially true if your theme is written in xhtml.  If you open a paragraph with <p> then you must close it with a </p>.

Note: If you are typing away and press “enter” and get a new paragraph on your screen – that is a word processor type of function.  HTML is NOT a word processor.  If you want a new paragraph, you have to wrap your text in <p> </p> tags.

For example:

<P> This is my short paragraph. I am using some shortcuts to show you how to write a paragraph.  For some editors, I really should code the punctuation instead of typing it like I am now. </p>

If I did not use the closing </p> tag, then the internet would assume that everything for the rest of that page was in the same paragraph.  So if you forget to close your sidebar <p> tags, then your sidebar MAY swing to an unexpected position.  If you want to be sure that you don’t get weird sections all over your page, be sure to close the html tags that you use.

I’ve also seen some people use <p> like a page break or section break.  This is the WRONG use for it.  When some web browsers are reading this type of html it will read it wrong, and your page could be read or displayed with weird sections.

This post is part of a series on Desperately Seeking WordPress called, “Save the Sidebar!”  Click here to go to the beginning of the series:

save-the-sidebars

We’ll cover how to create section breaks and page breaks in our next tutorial:  Sidebar Fix #2: the <br> tag.

Similar Posts

3 Comments

  1. As a beginner blogger I picked up a super easy tip early on. I create a new post and make the link or picture that I want to insert in the text box, then I go to the HTML edit view and copy the HTML code from whatever I’ve done.

    Then I discard the post and return to my text box widget where I paste in my HTML code. That’s how I’ve cheated my way through all this time!

    1. Thanks! I heard of this, and also uploading images to a post through the “insert img” button so that you can copy and paste them too. My only caveat – be sure to paste the right piece of code / to copy and paste the WHOLE thing! 🙂

  2. I upload through the post page and then go to the media gallery to get the link. Similar to what you 2 are saying – I think. 🙂
    Looking forward to your next post!

Leave a Reply

Your email address will not be published.