Okay, here's what I did and the results:
1. I reset plugins for TinyMCE. (Please see before and after screenshots.)
2. I created a global content block and inserted the code there. (See screenshot.)
3. I checked page defaults. (See screenshot.)
4. I checked the templates. (See screenshot.) Code from the only one used is below.
5. I did not edit any page except the Population page at this time.
6. I replaced the global content block code with the one given above and loaded page again.
Nothing made any difference, except the last one that caused code to appear on the page. (Check it out for yourself.)
CSSMenu Top + 2 columns:
{process_pagedata}<!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" xml:lang="en" lang="en">
{* Change lang="en" to the language of your site *}
{* note: anything inside these are smarty comments, they will not show up in the page source *}
<head>
<title>{sitename} - {title}</title>
{* The sitename is changed in Site Admin/Global settings. {title} is the name of each page *}
{metadata}
{* Don't remove this! Metadata is entered in Site Admin/Global settings. *}
{cms_stylesheet}
{* This is how all the stylesheets attached to this template are linked to it *}
{cms_selflink dir="start" rellink=1}
{cms_selflink dir="prev" rellink=1}
{cms_selflink dir="next" rellink=1}
{* Relational links for interconnections between pages, good for accessibility and Search Engine Optimization *}
{* the literal below and the /literal at the end are needed whenever there are {"curly brackets"} as smarty will think it's something to process and will throw an error *}
{literal}
<__script__ type="text/JavaScript">
<!--
//pass min and max - measured against window width
function P7_MinMaxW(a,b){
var nw="auto",w=document.documentElement.clientWidth;
if(w>=b){nw=b+"px";}if(w<=a){nw=a+"px";}return nw;
}
//-->
</__script>
<!--[if lte IE 6]>
<style type="text/css">
#pagewrapper {width:expression(P7_MinMaxW(720,950));}
#container {height: 1%;}
</style>
<![endif]-->
{/literal}
{* The min and max page width for Internet Explorer is set here. For other browsers it's in the stylesheet "Layout: Top menu + 2 columns" *}
<!--[if lte IE 6]>
<__script__ type="text/javascript" src="modules/MenuManager/CSSMenu.js"></__script>
<![endif]-->
{* The above JavaScript is required for CSSMenu to work in IE *}
</head>
</__body>
<div id="pagewrapper">
{* start accessibility skip links, anything with the class of accessibility is hidden with CSS from visual browsers *}
<ul class="accessibility">
<li>{anchor anchor='menu_vert' title='Skip to navigation' accesskey='n' text='Skip to navigation'}</li>
<li>{anchor anchor='main' title='Skip to content' accesskey='s' text='Skip to content'}</li>
</ul>
{* end accessibility skip links *}
<hr class="accessibility" />
{* Horizontal ruler that is hidden for visual browsers by CSS *}
{* Start Header, with logo image that links to the default start page. Logo image is changed in the stylesheet "Layout: Top menu + 2 columns" *}
<div id="header">
{* this holds the name of the site on the right side *}
<h2 class="headright">{sitename}</h2>
{* a link back to home page and the header left image/logo, text is hidden using CSS *}
<h1>{cms_selflink dir="start" text="$sitename"}</h1>
<hr class="accessibility" />
</div>
{* End Header *}
{* Start Navigation *}
<div id="menu_vert">
{* stylesheet "Navigation: CSSMenu - Horizontal" *}
<h2 class="accessibility">Navigation</h2>
{menu loadprops=0 template='cssmenu.tpl'}
<hr class="accessibility" />
</div>
{* End Navigation *}
{* Start Search, the input "Submit" is using an image, CSS: input.search-button *}
<div id="search">
{search}
</div>
{* End Search *}
{* Start Breadcrumbs *}
<div class="crbk">
{* holds the right image, we need 2 divs to be able to make this site fluid, if it was fixed width we could use one div, one image *}
<div class="breadcrumbs">
{cms_breadcrumbs root='Home'}
<hr class="accessibility" />
</div>
</div>
{* End Breadcrumbs *}
{* Start Content *}
<div id="content">
{* Start Sidebar *}
<div id="sidebar">
<div id="sidebarb">
{content block='Sidebar'}
{* Start News, stylesheet "Module: News" *}
<div id="news">
<h2>News</h2>
{news number='3' detailpage='news'}
</div>
{* End News *}
</div>
</div>
{* End Sidebar *}
{* Start Content Area, the back1, back2, back3, hold the 3 outside images, main holds the 4th one, to make the box complete, if the template were fixed width not fluid we could use just 2 divs and 2 images, 1 top 1 bottom *}
<div class="back1">
<div class="back2">
<div class="back3">
<div id="main">
<div style="float: right;">{print showbutton=true script=true}</div>
<h2>{title}</h2>
{content}
<br />{* to insure space below content *}
{* Start relational links *}
{* note this is the right side, when you float: divs you need to have float: right; divs first *}
<div class="right49">
<p>{anchor anchor='main' text='^ Top'}</p>
</div>
<div class="left49">
<p> {cms_selflink dir="previous" label="Previous page: "}
{* The label parameter doesn't need to be there if you're using English, but is here to show how it's used if you don't want the English text "Previous page" *}
<br />
{cms_selflink dir="next"}
</p>
</div>
{* End relational links *}
<hr class="accessibility" />
<div class="clear"></div>
</div>
</div>
</div>
</div>
{* End Content Area *}
</div>
{* End Content *}
{* Start Footer. Edit the footer in the Global Content Block called "footer" *}
<div class="footback">
<div id="footer">
{* stylesheet "Navigation: FatFootMenu" *}
<div id="fooleft">
{menu loadprops=0}
</div>
<div id="footrt">
{global_content name='footer'}
</div>
<div class="clear"></div>
</div>
</div>
{* End Footer *}
</div>
{* end pagewrapper *}
<__body>
</__html>