WordPress Blogging Tutorials
Additional Posting Techniques / Editing HTML Posts
Visitors to VTC.com will be able to view all introductory videos for each training course.
Free Trial Members will gain access to first three chapters for each training course.
Full Access Members have full access to VTC.com�s entire library of video tutorials.
Learn More
Subtitles of the Movie (WordPress Blogging / Additional Posting Techniques / Editing HTML Posts)
Did you survive your HTML hand-coding experience there? Hopefully you did well here. OK, now there's lots more that I want to show you here. I'm still looking at the Preview tab here inside my Web Browser but, of course, I'm going to go ahead and close out of that tab and head back into my Edit Post screen and, as always, I'll just expand this out so we can sort of have a better view of our post here. Now, you don't have to hand-code everything inside this HTML Editor. You may have eyeballed the Toolbar running across the top of the HTML Editor and it looks very different from the Formatting Toolbar that we had back in the Visual Editor. So, what I can do, for example, is I might decide that I want a certain piece of text to be formatted. Well, I could simply select that piece of text and then use my bold or my italics buttons up on the Formatting bar, right and if I do so what winds up happening is the selected content now appears inside a strong element in my bold example, or it would appear inside an emphasis element in the case of italics, right, so you can certainly make use of that. You can set your Hyperlinks so you don't have to hand-code your hyperlinks if you don't want and there's all sorts of other options here as well. We have Block Quotes and we have Images and there's our Lists and so on and so on and so on, right, so you can certainly check out those guys if you want. But what I want to do at this point is I want to go and grab some better content, better content than what you and I had hand-typed in here. So, what I'm going to do is I'm just going to go and hide my Browser just for a second and go all the way down to my Desktop, so go ahead and minimize your Browser, head into your Project Files Folder there on your Desktop and inside your Project Files Folder you'll find a file called HTMLPost. txt. Go ahead and double-click on that guy. And what we'll do is we'll take the contents of this file and copy it and then paste it into WordPress. So make sure you select all of your text there and then copy it, Command-C here on the Mac or Ctrl-C over on the Windows side and then head back to your Web Browser and we're still inside our new post, of course; we're still editing our new post. All I'm going to do is select all of the content that you and I had hand-coded in and simply delete it and then Paste - Command-V or Ctrl-V. Perfect. Something like this. OK, great. Now at this point you could update your post if you wanted to, or you could go ahead and hand-code in some more HTML. Let's do a quick example here. I'm just going to hit Enter a few times after the bottom edge of my paragraph there and, let's see here, I'm going to open up a paragraph, so open angle bracket, p and then close angle bracket. And then what I'll do is I'll type in: If you'd like to learn HTML, VTC has a course on the subject. OK and then don't forget to close your paragraph, so open angle bracket, forward slash, p and then close angle bracket. OK. Now, let's do a little bit of formatting to this paragraph here, this new extra line inside our post. Let's start off by aligning him in the center of our post. So what I've done here is I've placed my cursor just after the p in the opening paragraph tag, put in a space, type in the word align equals open quote and then type in the word center and then close quote. OK, perfect. Now, the next thing that I want to do is I want to make the text VTC, I want to make that a Hyperlink and, of course, we could use our Link button up on the Toolbar there. You can use that guy if you want but I think instead what I'll do is I'll hand-code my Hyperlink. So, just before VTC what I'll do is I'll type in an open angle bracket and then a space href equals open quote and then the URL, HTTP full colon//www.vtc.com close quote close angle bracket. OK, perfect. And then what I'll do is I'll just shuffle my cursor down the line just a little bit after the word VTC or wherever I want my Hyperlink to end, right and I'll type in open angle bracket /a close angle bracket. Perfect. OK, great. Now we could go on and on and add in more things. We could add in another numbered list if we wanted to. We could add in headings and subheadings and all kinds of crazy stuff, but I think I'm going to leave it at this. I think is kind of giving you a reasonable example of what's possible here inside the HTML Editor. So, let's go and view our results. I'll just collapse down my Browser here. I'll click on Update over in the top right corner of the WordPress Interface and then, as always, Command or Ctrl-click the Visit Site link, or button there, in the top left corner. Alright, there's our post with our text. There's are center-aligned paragraph down at the bottom of our post. It looks like I missed my period there; that's OK. And I'll go ahead and click on VTC and I don't have my Internet connection turned On right now but you can see it did go to VTC.com. So, there you go. There's some hand-coding, some hand-coding HTML for you and Editing your HTML posts.
Tutorial Information
| Course: | WordPress Blogging |
| Author: | Geoff Blake |
| SKU: | 34118 |
| ISBN: | 1-936334-24-0 |
| Release Date: | 2010-05-11 |
| Duration: | 7 hrs / 98 lessons |
| Work Files: |
Yes |
| Captions: | No |
| Compatibility: |
Vista/XP/2000, OS X, Linux QuickTime 7, Flash 8 |
VTC Sign up & Benefits
- Unlimited Access
- 81,350 Video Tutorials (14,200 free)
- Video Available as Flash or QuickTime
- Over 715 Courses
- $30 for One Month Access
- Multi-User Discounts Available
