Random thoughts on art, technology, stuff, and occasionally Real Estate: April 2007

TypePad: Adding META Tags

My post below describes how to manually add META tags in Advanced Templates. 

If you want to check how how to add META tags in Basic Templates, read Teresa Boardman's post here Typepad and Meta Tags ( http://activerain.com/blogsview/93520/Typepad-and-Meta-Tags )

~~~~~~~~~~~

I was going to put off talking about converting to TypePad Advanced Templates until after I'd written more posts about using the design wizards.  But since META TAGS can only be added in Advanced Templates, and everyone is anxious to work on their META TAGS, I'll go for it.  Keep in mind it is usually simplest to create as much of your design as possible with TypePad's wizards, before converting to Advanced Templates.

First, allow me to bore you with a few sentences about how TypePad works.  Blog pages generated by TypePad use a "module" system.

For example, if you look at the code for your blog's header while working within TypePad, it will look like this
<$MTWeblogIncludeModule module="head-index"$>

When the same blog page is published, and viewed with a browser, that one line of code will expand to look like this
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
 "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" id="sixapart-standard">
<head>
 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
 <meta name="generator" content="http://www.typepad.com/" />
  ............
 </head>

Actually there are several more lines in the expanded code, but I didn't want your eyes to glaze over.  I just wanted to demonstrate the basic concept:  TP "modules" blossom out into lines of standard HMTL.  So with that in mind, here goes:

1.  Create a test blog.  I find this is always a good idea when testing new things in any environment.  Don't mess with your working blog until you've comfortably got the new thing figured out.  To create a new test blog, click on the "Weblogs" tab -> click "Create A New Weblog".  I usually name test blogs by what I am testing out "Test Meta Tags" for example.  Click the Design tab, "Change Theme", "Custom Theme" to choose, colors, borders, fonts.  Under "Change Layout" choose the number and placement of columns.  Toss up a test post, and publish the whole shebang.

2.  Now for the good stuff.  Click on the "Design" tab.  Click "Saved Designs".  TypePad will have used the new blog name as the name for the design.  So if you named your test blog "Test Meta Tags", you'll see a design named "Test Meta Tags".  Put a check mark in the box to the left of the design name, then click "Convert To Advanced".  

Don't worry, the original design will not disappear. Typepad will make a copy of the design and convert the copy to the Advanced set.  Later, if you want to revert to the previous design, it is just a matter of a couple clicks.  But keep in mind any changes you make in the new advanced design will not carry over to the original design. 

Click "Yes, Convert".  The system will convert and return you to the "Manage Your Designs" screen.  Put a checkmark in the box to the left of your new "Test Meta Tags [Advanced]" design, double check to make sure you are working in your test blog, and not your working blog (don't skip this step!) and click "Apply".  You'll land on a new screen listing the individual templates.  Click "Publish Weblog".


3.  Now comes the short cut that is not in the TypePad help files.  Open Notepad or any other simple text editor, and keep it running in its own window throughout these next steps.  After publishing completes, click "View Your Site".  Depending on your browser, the blog site will open in a new tab, or a new window.  Click View -> Source (or View -> Page Source in Firefox).  Another text editor window will open displaying the HTML code.


Click and drag, selecting all the code text starting from <!DOCTYPE html PUBLIC ....... to   .....</head>
Click Edit -> Copy (CTRL C)    Click in the blank Notepad window to bring it to the front, and paste in the code you just copied.  Edit -> Paste  (CTRL V)

4.  Do you see these lines of code?
 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
 <meta name="generator" content="http://www.typepad.com/" />

Right under those lines type in your own additional meta tags, using this format:
 <meta name="description" content="Northeast Los Angeles blah, blah, blah">
 <meta name="keywords" content= "Northeast Los Angeles blah, blah, blah">

Save the file.  Let's name it "header-text".  Keep it open, don't close the Notepad window.

5.  Now, back to the "Advanced Templates" list, which you should still have open.  If not, click the "Weblogs" tag, find your test blog in the list of blogs, and click "Design".  Click "Main Index Template", and a window will open up showing all the TypePad module code of the Main Index Template.



Drag to select the top line -- This one: <$MTWeblogIncludeModule module="head-index"$> Then Edit -> Cut (CTRL X)  I always paste the line I just cut out somewhere down at the nottom of my Notepad file -- just in case of screw-up.


Now drag and select all the code in your notepad "header-text" file, (you know the one where you just typed in your brand new meta tags)  between <!DOCTYPE html PUBLIC ..... and ...... </head>  (Obviously you'd leave out that one module line you stuck at the bottom for safe-keeping).  Then Edit -> Copy (CTRL C)

6.  Click back in the TypePad "Edit Template: Main Index Template" window.  Paste all that code you just copied at the very top, in the same space where you just removed the <$MTWeblogIncludeModule module="head-index"$> line.  Don't worry, everything else will move down to let it fit in.

Be sure you didn't accidently remove anything else.  The next line below </head> should start <body class= ....

Click "Save", then "Publish"

7.  View the site to make sure it works.  Test in both Internet Explorer and Firefox.

8.  Now that you know the steps, you can also add your meta tags to the Archive Index Template, the Category Archives Template, the DateBased Archives Template, and the Individual Archives Template.

Remember, writing anything out make its sound much more complicated that it is.  This is not really complicated.  It is not writing code (other than writing out the words you want in your meta tags).  It is basically copy-and-pasting.  The most complicated thing is copying the correct stuff to the correct spot.

But if you don't feel comfortable yet working in Advanced Templates, that's OK, too.  Check how how to add META tags in Basic Templates, read Teresa Boardman's post here Typepad and Meta Tags ( http://activerain.com/blogsview/93520/Typepad-and-Meta-Tags ) Just focus on writing great content, and the rest will come in time.

 

 

Cheryl Johnson // Bob Tayor Properties, Inc.

 




Bob Taylor Properties, is a progressive, independent, full service real estate brokerage located in Northeast Los Angeles. We have a small staff of experienced, veteran real estate agents who love what they do and work tirelessly for their clients.

 

We are experts at selling residential, multi-unit residential and commercial properties. We are highly experienced with residential and commercial leasing. We know the Los Angeles City Rent Stablization Ordinance.

 

We know and appreciate all types of Los Angeles architecture and design from Historic Homes to Ultra Modern Lofts.

 

We would love to help you buy or lease a home anywhere in the Greater Los Angeles area, or to sell or lease the home you already own.

 

Call us today at 323-257-1080.



 

* Starter Homes
* Historic Homes
* Dream Homes
* Investment Property
* Commercial Property
* Rentals
* Leases
* Short Sales
* Bank Owned
 

Our highly skilled and experienced staff serves all of Southern California and handles all types of property.

 



 

The Bob Taylor Properties Network of informative blogs and websites

Bob-Taylor.com Our original website

BobTaylorProperties.com Featuring a live MLS feed with lots of listings!

EclecticAngelino.com A headline newsfeed from around Northeast L.A.

WeMarketRealEstate.com Our intensive marketing strategies

RealEstateHomeBuyersGuide.com Information for home buyers

HomesForLeaseToday.com Live MLS feed of homes and apartments offered for lease

LALeasingService.com Our leasing services for property owners

 

 

 





 

 

Bob Taylor Properties, Inc.

323-257-1080
5526 North Figueroa Street
Los Angeles, CA 90042
DRE License # 01304057

 

 

 

 





 

Comment balloon 2 commentsCheryl Johnson • April 27 2007 08:26AM
TypePad: Adding META Tags
share
My post below describes how to manually add META tags in Advanced Templates. If you want to check how how to add META tags in Basic Templates, read Teresa Boardman's post here Typepad and Meta Tags ( http://ActiveRain. com/blogsview/93520/Typepad… more
Five Essential Photoshop Tools And Where To Find Them
share
If you are anything like me, you can figure out how to use most Photoshop tools pretty quickly on your own, thank you very much, but the challenge is finding where in the menu structure the BLEEPIN' tool is buried in the the first place. And "… more
Getting Acquainted With A New Camera
share
Eva Wilson's post here: Just got a new digital camera! got me thinking. Many people, when they buy a new camera, feel like they should should read through the camera manual from cover to cover. It always seems like it would be a great idea, but… more
Creating A Simple Blog Banner In Photoshop
share
OK. Let's walk through creating a very VERY simple banner/header for your new blog. I'll use Phtoshop 7 for this, since that's convenient for me. You can use any version of Photoshop, Photoshop Elements, Paint Shop Pro, or similar software. 1. … more
TypePad: Adding A Custom Banner
share
First of all, you will need to create your banner in Photoshop, Photoshop Elements, Paint Shop Pro, or another image editor of your choice. If you've never done this before, stand by, I'll give some links and ideas in another post. For now, you… more
TypePad: Editing The Elements
share
Editing The Elements You can accomplish a good deal of customization in TypePad by simply using the "Customize Your Theme" wizards, without ever touching the CSS or HTML. Tip: Even if you intend to convert to Advanced Templates in order… more
TypePad: Step One - Setting Up Your Account
share
There are several blogging platforms available for the start up blogger. Everyone here is obviously familiar with ActiveRain as a blogging platform. Blogger, now owned by Google is free and widely used. Squarespace has received favorable… more