How to Add Meta Tags to Your Website Using Nvu or KompoZer

by Christopher Heng, thesitewizard.com

Meta tags serve a number of purposes on a web page. While they are not displayed to the user, they can be useful in things like controlling whether search engines index your page or follows links as well as determining the kind of description that the search engines show for your site when it appears in a search, and so on. This article deals with how you can add meta tags to your website using the free What-You-See-Is-What-You-Get (WYSIWYG) web editors Nvu and KompoZer.

Preliminary

This article makes the assumption that you already know how to use either Nvu or KompoZer to create your website. If this is not true, please see one of the following tutorial series:

(There isn't much difference between Nvu and KompoZer. If you can't decide, just pick KompoZer, which is basically Nvu with some bug fixes.)

In addition, the article also doesn't really delve into great detail the meaning and purpose of the different meta tags. If you don't already know what the meta tags are for, and how to use them, you can find a full description of the commonly-used tags in my article How to Use Meta Tags In Search Engine Promotion

Steps to Inserting Meta Tags with Nvu or KompoZer

Start up Nvu or KompoZer. The instructions for inserting Meta tags with either editor is identical.

Enter the Source Mode

There is no way to insert META tags into Nvu/KompoZer using the WYSIWYG interface or the GUI menus. You will, unfortunately, have to get your hands dirty by entering the source mode.

To enter the source mode, click the "View" menu and select the "HTML Source" item on the menu that appears.
Look for the <HEAD> Section

When you enter the Source mode, you are actually seeing the underlying HTML code for your web page. On a blank new web page (one where you haven't entered any text yet), you should be able to see code similar to the following:
```
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
     "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
  <meta content="text/html; charset=ISO-8859-1"
 http-equiv="content-type">
  <title></title>
</head>
<body>
<br>
</body>
</html>
```
If your page is not a blank document, it will probably contain a lot more text than my above example. That is not a problem - you should still be able to follow the steps easily.

Look for the tag <head> near the top of the document. There should also be a matching </head> tag a few lines below. The <head> and </head> tags respectively mark the beginning and end of a section frequently referred to as the <head> section. The content in this section are not actually displayed in the main body of a web browser, but serve to provide more information to the web browsers and search engine robots that access the page.

All meta tags should be located within this section. In fact, if you have not modified this section before, you should be able to spot the default <meta> content tag that Nvu or KompoZer inserts for you.

To insert a meta tag into this section, place your cursor immediately before the </head> closing tag, on the same line as the tag, and hit the ENTER (or RETURN key on the Mac) to create a new blank line. You can then insert the appropriate meta tag in that blank line.

It doesn't really matter which meta tags come first or which last, nor does it really matter where in the <head> section you place those tags. However, be careful not to break up any existing tags in the head section when you insert a new line. (Which is why I suggested that you create a new line just before the close of the HEAD section, to be safe.)
Adding The Meta Description Tag

To add the meta description tag, simply cut/copy and paste the following line into the head section.

<meta name="description" content="put your page description here">

After pasting my sample, replace the "put your page description here" with a brief description of your web page. A couple of sentences about what your page is about should be sufficient; if your description is too long, it will be truncated in the search engines results page.

Note the following:
- Put your description in one long line. Do not hit the ENTER (or RETURN key on the Mac) in the middle of the description to make it appear prettier.
- The meta description tag, as well as the other meta tags described in this article, will not be colour-coded the way the other tags on your page are. That is, it will just appear in a dull black, rather than in brown or blue like some of the other text on the page. This is just an Nvu/KompoZer deficiency.
- If you are using Internet Explorer 6 to read this article, you may have trouble selecting and copying the code. If so, see the article Why Can't I Copy and Paste the Code Examples in thesitewizard.com? for the workaround.
Adding the Meta Robots Tag

The meta robots tag allows you to control whether the search engine should index your page, follow its links or archive its contents. It should be added the same way as the META Description tag. The tag looks like this:

<meta name="robots" content="index,follow">

Please read my Meta Tags article for more details on the various options that you can use to manage the search engine spiders that arrive on your site.
How About The Meta Keywords Tag?

As mentioned in my article, it's probably a waste of effort to add the keywords tag, since I doubt any search engine even looks at the tag any more. If you insist on adding it, however, put it into the HEAD section along with the other tags. I personally don't even bother to add this tag to my new pages.

Once you've finished adding your META tags, switch back to the usual visual editing mode by clicking the "View" menu and selecting the menu item "Normal Edit Mode". The Meta tag changes you made earlier will not be visible, nor are they intended to be. From the Normal mode, you can continue designing your web page in the usual way.

Copyright © 2008 by Christopher Heng. All rights reserved.
Get more free tips and articles like this, on web design, promotion, revenue and scripting, from http://www.thesitewizard.com/.

If you find this article useful, please consider making a donation.

You are here: Top > Website Promotion and Search Engine Optimization > How to Add Meta Tags to Your Website Using Nvu or KompoZer

Other articles on: Site Promotion, Nvu, KompoZer

thesitewizard™ News Feed (RSS Site Feed)

Do you find this article useful? You can learn of new articles and scripts that are published on thesitewizard.com by subscribing to the RSS feed. Simply point your RSS feed reader or a browser that supports RSS feeds at http://www.thesitewizard.com/thesitewizard.xml. You can read more about how to subscribe to RSS site feeds from my RSS FAQ.

Please Do Not Reprint This Article

This article is copyrighted. Please do not reproduce this article in whole or part, in any form, without obtaining my written permission.

New Pages

Popular Pages

How to Link to This Page

To link to this page from your website, simply cut and paste the following code to your web page.

It will appear on your page as:

How to Add Meta Tags to Your Website Using Nvu or KompoZer

How to Add Meta Tags to Your Website Using Nvu or KompoZer

Control Search Engine Behaviour from Your Web Page

How to Add Meta Tags to Your Website Using Nvu or KompoZer

Preliminary

Steps to Inserting Meta Tags with Nvu or KompoZer

Enter the Source Mode

Look for the <HEAD> Section

Adding The Meta Description Tag

Adding the Meta Robots Tag

How About The Meta Keywords Tag?

thesitewizard™ News Feed (RSS Site Feed)

Please Do Not Reprint This Article

Related Pages

New Pages

Popular Pages

How to Link to This Page