WordPress HTML Editing Window – Can I Have More Control Over My Pages and Posts?

A reader offered the following comment/question today about the WordPress HTML Editing Window.

I’m frustrated with the WP editor. I’m used to Dreamweaver and having lots of html coding available to me, along with design view. I find that the html view of WP jumps around, doesn’t take me to where I was in the design view, is limiting on features, increases or decreases spacing between lines on me once posted, and is generally frustrating. It won’t even underline properly.

Do you have any suggestions about an outside editor for WP??

Here’s my answer:

@energeticnutrition
Thanks for your question. It’s something that I’m hearing more often these days. In general, it’s the idea that people want more control over their pages and posts.

Bloggers in the traditional sense are not the ones calling for this. It’s usually businesses, independent consultants and professionals that are using WordPress for full-blown websites.

What most people seem to want is a WYSIWYG editor that will allow them to do more with layout and styling using the Visual editing window. For that, there are several solutions. The most popular is TinyMCE Advanced WordPress Plugin.

But what you are asking for is more control over the HTML. This is tricky.

On the one hand, you have just about as much control as your HTML and CSS skills allow, but practically speaking it’s a pain. You can paste all kinds of code into the HTML window. For this, I usually use an external HTML editor. Dreamweaver works fine. There’s a free editor on the Business Blogging 101 Resources page. You can’t preview your work in Dreamweaver, however, unless you go through some other technical setup. Not worth it, imo. You can paste the HTML into the WP editor and save the changes, then view the page. The more complicated your HTML, the more tedious it gets!

The other thing you have to contend with is that your WordPress theme may conflict with the CSS you use in your hand-coded HTML. My guess is that the problem you cite with underlining is due to such a conflict. If the conflicts are very disruptive or they don’t allow you to do what you want at all, you may need to edit your style.css or other CSS files.

If you want to simplify the editing process and see how things work when you edit your page using HTML without having to constantly paste your changes into WordPress to preview them, you might try this:

In a web browser, View the Source Code for the page or post you are working on. Select All. Copy and Paste the code into the Code/HTML window of Dreamweaver. Now save that page somewhere, and you should be able to open it in a browser – or maybe view it in Dreamweaver’s visual window – that is, you should be able to view it from your desktop, so that you don’t have to keep saving changes into the WordPress editor to see how they look.

You’ll need to identify the section of the HTML page that is the chuck of code you will paste into the WordPress HTML editing window when you get things looking the way you want. (Try demarcating it with <!– HTML comments –>.) This doesn’t always work, but if you want more control over your pages, this is the easiest way to do it.

WordPress Tutorial – Where is the “Insert Image Into Post” Button – and How to Insert a Photo Gallery

This WordPress tutorial show two things:

  1. Where the “Insert Into Post” button is so that you can insert an image into a WordPress post or page.
  2. How to insert a gallery of images into a WordPress post or page.

New Features in WordPress 2.8

Over at the McBuzz Communications website, I have posted a nice video overview of the new features in WordPress 2.8, and a short description of one of the coolest new features: the ability to insert more than one instance of the same widget into one – or more – of your sidebars. This gives you a powerful new way to customize the link menus in your sidebars. If you have a theme that allows you to have different sidebars on different pages, you can now have custom links on every page – without having to hack the PHP code for the theme!

Add a Photo Slideshow to WordPress with Slide.com

It is truly amazing how many resources and tools are available online these days – absolutely free. Here’s one more example. You can create a slideshow on Slide.com and easily embed it into a WordPress page or post. I made the slideshow below by importing images from my Flickr account directly into Slide.com. You can do the same, or upload images from your computer, or get them from any number of other sources.

Choose from prefab themes and custom colors, add captions and a title, give Slide your email address, choose a username/account URL (mine is mcbuzz.slide.com) and password, click Save. Then click on the WordPress option to embed the slideshow. Copy the code for WordPress. Paste that into the HTML editing window of your WordPress editor. Preview or Publish, and BOOM, you’re done.

WordPress Tutorial – How to Make a Static Page Your Home Page & Hide a Double Home Page Link

UPDATE – PLEASE NOTE:
The latest version of WordPress, WordPress 3.0, includes custom navigation menus. They are built into the new default theme, Twenty Eleven. Many themes on WordPress.com support custom menus. If your site is hosted on WordPress.com or you are using a theme that supports the new custom navigation menus, hiding a double Home page link is easy. See the tutorial on WordPress 101 called Building Custom Menus.*

IF YOU HAVE A SELF-HOSTED WORDPRESS SITE WITH AN OLDER THEME:
If you have a “self-hosted” site instead of one hosted on WordPress.com, you may be able to use the Exclude Pages Plugin for WordPress to hide your extra Home page link and any links that appear in your sidebar Pages navigation.

You can’t install plugins on sites hosted by WordPress.com. That’s one of the main drawbacks to hosting with WordPress.com. For those sites, this YouTube video tutorial (below) is still useful.

If you like this tutorial, you may also like: WordPress Tutorial – How to Make a “Child” Page (Subpage) and How to Hide a Link in the Pages Sidebar Widget

This beginner-level WordPress Tutorial shows how to make a “static” WordPress page your Home page (also called a “front page”), and how to hide the second Home page link that sometimes appears in your site navigation when you make that static page into a Home page.

By default, a WordPress website displays the blog page on the home / front page. For example, on the Business Blogging 101 website home page at https://mcbuzz.wordpress.com you see blog posts with the most recent post at the top of the page and earlier posts below that.

WordPress allows you to select a different page as your home page, so that you can display more traditional content like information about yourself or your business. You can also create another page to use as your blog page, with a link to that page in your site navigation. Watch the video tutorial below to see how to do this.

One problem you may run into when you make a static page your home page is that the link to that page now appears in the main site navigation, so that you have two links to the same home page – usually the page called “Home” in the main site navigation. The second part of this tutorial shows how to remove one of those links from your site navigation so that visitors to your site are not confused by the duplicate link.

WordPress Tutorial – How to Make a Static Page Your Home Page & Hide Double Home Page Link

*Note the “Pay What You Wish” pricing on WordPress 101. Business Blogging 101 is not an affiliate of WordPress 101 WordPress tutorials, meaning that I don’t get a kickback for referring people there.

WordPress Tutorial – How to Make a “Child” Page (Subpage) and How to Hide a Link in the Pages Sidebar Widget

UPDATE – PLEASE NOTE:
If you have a “self-hosted” or third-party-hosted site instead of one hosted on WordPress.com, you may be able to use the Exclude Pages Plugin for WordPress to hide Child Page links that show in popup submenus under your main navigation links and any links that appear in your sidebar Pages navigation.

You can’t install WordPress plugins on sites hosted by WordPress.com. That’s one of the main drawbacks to hosting with WordPress.com. For those sites, this tutorial is still useful.

This beginner-level WordPress tutorial shows 1. How to make a “child” page or subpage of another page (a “parent” page) using the WordPress 2.7 editing interface. And 2. How to hide a link in the Pages sidebar widget, in other words, how to keep a link to a page from showing in the Pages sidebar widget by putting the page (post) ID number into the “Exclude” box in the Pages sidebar widget dialog box.

If you like this tutorial, you may also like: WordPress Tutorial – How to Make a Static Page Your Home Page & Hide a Double Home Page Link

Making “child” pages (subpages) is useful because you may not want all your pages to show in the main page navigation of your WordPress theme. In most themes, only “main” pages (pages that don’t have a “parent”) show up in the main page navigation. In some newer WordPress themes, child pages show up in a popup menu that appears when you roll over the main page link. And in some themes, sub-subpages show up in popup menus as well. These are sometimes called “cascading” navigation menus: sub-subpages show up in a popup menu when you roll over a subpage link.

The second part of this tutorial shows how to hide (or “exclude”) a link to a page that would otherwise appear in the links of the Pages sidebar widget. The tricky part of excluding a link is finding the page / post ID number. I show you how to do this.

Excluding a link is useful for a number of reasons. One is that when you make a static page your Home page in WordPress (by telling WordPress to diplay a Page as your Home page instead of displaying your blog posts), some themes will show the link to this static page as a second home page link in your main navigation. By making the Home page a subpage and excluding that link from the Pages sidebar navigation, you can eliminate the double Home page link.

In WordPress 2.7, you select a static page to use as your Home page using the Settings > Reading panel in the Dashboard. When you do this, be sure to create a new page to use as your Blog page. If you do not designate a page to use as your Blog page, your blog posts will no longer be visible.

How to Make a “Child” Page (Subpage) & Hide a Pages Sidebar Widget Link

WordPress Tutorial – Make a Static Page Your Home Page – Part 3

This Beginner-level WordPress Tutorial is a follow-up to “Make a Static Page Your Home/Front Page” and “Make a Static Page Your Home Page – Part 2”.

Part 2 shows a way to hide the link to a page that you use as your home page so that people aren’t confused by the fact that there are two links to the same page in your navigation. That method works when you have navigation in the sidebar that shows subpages AND subpages are part of your site. If your site doesn’t have subpages, there is no way to hide the link to your home page. It will show as a subpage link. That sentence is no longer true! As an intrepid reader points out, the WordPress Pages navigation widget now allows you to exclude any page from its links.

The video tutorial below shows you how to a make a custom sidebar using WordPress Widgets so that you can remove page navigation from the sidebar and make the home page a subpage whose link does not appear in the navigation.

But the best way to go (I haven’t made a video tutorial for this yet) is to exclude the Home page from your Pages navigation in the sidebar using the Pages widget. As noted by a reader commenting on Part 2 of this Static Page / Home Page WordPress tutorial, you can keep Pages navigation in your sidebar without having to show a link to your Home page there.

The Pages navigation widget allows you to exclude any page using the page ID number.

Here’s how to find the ID number for a Page or Post.

You can insert the Page ID of any page you want to exclude into the “Exclude:” box when you Edit the Pages widget. Find the ID number of your Home page, put that in the “Exclude:” box of the Pages widget, and the link to the Home page will not show in the sidebar.

Mark McLaren
McBuzz Communications

%d bloggers like this: