Well good morning everybody and welcome to Lesson 9 in our How To Build A Professional Website Using WordPress and Thesis 2 course. Today we’re going to be talking about some WordPress basics, that is how to add content to your site.
I’m adding some new material to this lesson. I’ve taught this lesson, Adding Content to Your Site, several times and I’ve decided to add material. We’re going to talk about image editing and how to optimize your images for use on your website and that sort of thing.
Adding content to your site starts off with the WordPress Text Editor. And the WordPress Text Editor is included in both pages and posts. So if we go to our all pages, we can come down here say to the West Seattle View Home and select edit. And when I say the WordPress Text Editor, this is what I’m talking about right here. This is the WordPress Text Editor.
Two Modes of the WordPress Text Editor
The WordPress Text Editor has two different modes and two views of each mode. The two different modes are the visual mode which is sort of a ‘what you see is what you get’ kind of mode. And the text mode which is what used to be called the HTML mode and I still routinely refer to it as HTML. In text mode you can see any HTML code. You can type HTML code in here and it will work, but you can’t do it in the visual mode.
The visual mode is where you make visual changes. Those visual changes can result in HTML which you’d see in the text mode. But you’ve got these two different modes and regular WordPress users are going to use both, really, because there are some times when you need to type some HTML or delete some HTML or check for problem and you use text for that. And then visual is where you’re probably going to compose your content or at least, paste your content.
Two Views of the WordPress Text Editor
So those are the two modes but there are also two views of each of those modes. And the first view is this view where you have everything else as part of it. So you can just start typing here and that’s one view.
However, there is this second view called distraction-free writing mode where if you click on that button, all of a sudden everything else goes away. Once you start typing you have just a nice, big, blank piece of paper. If you find that useful then that’s good.
The second view of that is the text mode and the text mode is very much the same. Everything disappears once you start typing. Now you can tell you’re in the text mode by the way the text is rendered. Notice this is that code style text whereas if we go to the visual, now you’ve got the Georgia style text so that can be a visual cue to you as to what’s going on there.
The Kitchen Sink
The full screen mode here has a very limited toolbar. Let’s exit the full screen and we come to this, this looks like a pretty minimalist toolbar as well. But actually, there is this little thing here called the kitchen sink. And once you open that up, you can see all the rest of the default Tiny MCE Editor tool buttons. More often than not, you’re going to want to work with the kitchen sink open.
Now if you don’t know what these things do, all you have to do is hover your mouse over them. And when you hover your mouse over them, you can see it tells you, right? Paste as plain text, paste from Word. You can also click on this and this has some helpful files for you. So rich editing basics, some advanced stuff.
There are hotkeys that you can set up or that you can use and then there’s something about just the Tiny MCE Editor. And if you are in your full page mode, you have a lot fewer buttons here. You can still click on this and you can still essentially get your hotkeys but you have many fewer choices. Really, it’s just bold, italic and buttons or numbered lists and then insert media. It says ‘insert edit image’ but that insert edit image is exactly the same thing as add media here.
In any case, those are the two views in two modes, visual and text and then full screen and the normal views.