With “\Components\Quick update” I am receiving the error, “Master page and Child page have different editable areas” for all tested pages. To debug this error I have saved my master.html to master_as_page_template_10a.html. Then in the latter I only changed –
<html data-pgc-set-master>
to
<html data-pgc-master="master.html">
Now master_as_page_template_10a.html should have exactly the same editable areas as master.html (see code below). However, I still get the same error.
When I click on the main-content link in the error message I get the following highlighted in master_as_page_template_10a.html–
The tree shows –
Thanks,
Don C.
======== master.html ========
<!doctype html>
<html data-pgc-set-master>
<head>
<meta charset="utf-8"/>
<meta http-equiv="X-UA-Compatible" content="IE=Edge"/>
<meta name="viewport" content="width=device-width"/>
<!-- 5/29/2015 - from http://realfavicongenerator.net/ for favicon.ico -->
<link rel="apple-touch-icon" sizes="57x57" href="/apple-touch-icon-57x57.png"/>
<link rel="apple-touch-icon" sizes="60x60" href="/apple-touch-icon-60x60.png"/>
<link rel="apple-touch-icon" sizes="72x72" href="/apple-touch-icon-72x72.png"/>
<link rel="apple-touch-icon" sizes="76x76" href="/apple-touch-icon-76x76.png"/>
<link rel="apple-touch-icon" sizes="114x114" href="/apple-touch-icon-114x114.png"/>
<link rel="apple-touch-icon" sizes="120x120" href="/apple-touch-icon-120x120.png"/>
<link rel="apple-touch-icon" sizes="144x144" href="/apple-touch-icon-144x144.png"/>
<link rel="apple-touch-icon" sizes="152x152" href="/apple-touch-icon-152x152.png"/>
<link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon-180x180.png"/>
<link rel="icon" type="image/png" href="/favicon-32x32.png" sizes="32x32"/>
<link rel="icon" type="image/png" href="/android-chrome-192x192.png" sizes="192x192"/>
<link rel="icon" type="image/png" href="/favicon-96x96.png" sizes="96x96"/>
<link rel="icon" type="image/png" href="/favicon-16x16.png" sizes="16x16"/>
<link rel="manifest" href="/manifest.json"/>
<meta name="msapplication-TileColor" content="#2d89ef"/>
<meta name="msapplication-TileImage" content="/mstile-144x144.png"/>
<meta name="theme-color" content="#ffffff"/>
<!-- End: favicon.ico -->
<!-- TemplateBeginEditable name="doctitle" -->
<title> | Ultrasonic Resonators</title>
<!-- TemplateEndEditable -->
<script type="text/javascript" src="../p7ehc/p7EHCscripts.js"></script>
<!-- Comment away the next to see the pages in print format. -->
<link href="../p7csspbm2/p7csspbm2_09.css" rel="stylesheet" type="text/css"/>
<!-- DRC - 19/Apr/2015 9:56 - moved below after all other stylesheets so that this overrides any conflicts -->
<!--
<link href="../p7csspbm2/p7csspbm2_print.css" rel="stylesheet" type="text/css" media="print">
-->
<!--[if lte IE 7]>
<style>
.menutop li {display: inline;}
div, .menuside a {zoom: 1;}
.masthead .banner, .masthead .banner img {width: 100%;}
</style>
<![endif]-->
<link href="../p7tm3/p7TM3-10.css" rel="stylesheet" type="text/css" media="all"/>
<script type="text/javascript" src="../p7tm3/p7TM3scripts.js"></script>
<link href="../p7tm3/p7TM3-01.css" rel="stylesheet" type="text/css" media="all"/>
<link href="../_drc/drc1a.css" rel="stylesheet" type="text/css"/>
<!-- DRC - 19/Apr/2015 9:57 - moved from above -->
<link href="../p7csspbm2/p7csspbm2_drc_print.css" rel="stylesheet" type="text/css" media="print"/>
<!-- 2016-01-04 - mathjax for displaying equations -->
<script src="../templates/mathjax_renum_equations_2a.js"></script>
<!-- 2016-01-04 - works OK but above has simpler code
2015-12-30
<script src="../templates/mathjax_renum_equations_1a.js"></script>
-->
<!-- The following uses a local mathjax config file, in addition to the std cdn (Content Delivery Network) mathjax config file. In order to do this:
1. Must add "&delayStartupUntilConfig" to the end of the cdn.
2. Must add "MathJax.Hub.Configured();" to the end of the local mathjax config file to let the cdn know that the mathjax configuration has completed.
See (near end of link page) -
https://groups.google.com/forum/embed/#!topic/mathjax-users/J-36V22-G9Q
Use latex_demo_100a.html with local.js to debug (from above link but modified).
-->
<script type="text/javascript" async src="https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.7/MathJax.js?config=TeX-MML-AM_CHTML">
</script>
<!-- Obsolete 2021-12-13 ; replaced by above from
https://docs.mathjax.org/en/v2.7-latest/start.html.
See ! Warning at https://docs.mathjax.org/en/v2.7-latest/start.html --
cdn.mathjax.org was retired in April, 2017.
<script type="text/javascript"
src="http://cdn.mathjax.org/mathjax/latest/MathJax.js?config=TeX-AMS-MML_HTMLorMML&delayStartupUntilConfig"></script>
-->
<script src="../templates/mathjax_config_2a.js"></script>
<!-- TemplateBeginEditable name="localstyles" -->
<style type="text/css">
/* 2/16/2015 - Insert over-riding local styles or external style sheets here */
</style>
<!-- TemplateEndEditable -->
<!-- TemplateBeginEditable name="head" -->
<style type="text/css">
<!-- 1/27/2015 - Insert over-riding external or local styles here -->
<!-- 2/16/2015 - currently not used -->
</style>
<!-- TemplateEndEditable -->
</head>
<body>
<div class="content-wrapper">
<div class="masthead">
<div class="logo">
<h1><span style="font-size: 1.2em">U</span>ltrasonic <span style="font-size: 1.2em">R</span>esonators</h1>
</div>
<!--
<div class="banner"><img src="../p7csspbm2/img/pbm-mast.jpg" alt="">
</div>
-->
</div> <!-- masthead -->
<div class="menutop-wrapper">
<div class="menutop-button-wrapper">
<ul class="menutop" role="menubar">
<li><a href="../index.html" title="Home" target="_self">Home</a></li>
<li><a href="../contents.html" title="Contents" target="_self">Contents</a></li>
<!-- 26/Mar/2016 12:56 - now in Contents
<li><a href="../design_info.html" title="Design info" target="_self">Design info</a></li>
-->
<!-- 1/16/2015 - try to set focus on current button. See current1 in p7csspbm2_09.css
<li><a href="../index.html" class="current1" title="Home" target="_self">Home</a></li>
<li><a href="../design_info.html" class="current2" title="Design info" target="_self">Design info</a></li>
-->
<!-- 2016-06-12
<li><a href="../design_help.html" title="Design help" target="_self">Design help</a></li>
-->
<li><a href="../notes.html" title="Notes" target="_self">Notes</a></li>
<li><a href="../contacts.html" title="Contact" target="_self">Contact</a></li>
</ul>
</div>
<!-- put google translate below -->
<!-- Insert in dwt file
1/17/2015: For the following, see
https://support.google.com/translate/#topic=2534534 - to add the translator
Various layout options are available.
Notes:
1. Set autoDisplay:true if the website should automataically translate is the visitor's website is set to a foreigh language
-->
<div class="google_translate-wrapper">
<div id="google_translate_element"></div> <!-- displays the google drop-down menu. DW flags this as an empty div. -->
</div>
<script type="text/javascript">
function googleTranslateElementInit() {
new google.translate.TranslateElement({
pageLanguage: 'en',
layout: google.translate.TranslateElement.InlineLayout.SIMPLE
}, 'google_translate_element');
}
</script>
<script type="text/javascript" src="http://translate.google.com/translate_a/element.js?cb=googleTranslateElementInit"></script>
<!-- 1/17/2015 - The following was taken from https://support.google.com/translate/answer/2534601?hl=en&ref_topic=2534534 but doesn't work. Note the difference in src. Also, this site requires additional meta data to be entered. Must log in at https://accounts.google.com/ServiceLoginAuth and fill in required info.
</script>
<script type="text/javascript" src="//translate.google.com/translate_a/element.js?cb=googleTranslateElementInit"></script>
-->
</div> <!-- menutop-wrapper -->
<div class="columns-wrapper">
<div class="main-content" data-pgc-field="main_content">
<!-- TemplateBeginEditable name="main-content" -->
<div class="content p7ehc-1">
<h1 class="page-topper">Topic</h1>
<p>Content</p>
</div> <!-- "content p7ehc-1" -->
<!-- TemplateEndEditable -->
</div> <!-- "main-content" -->
<div class="sidebar"> <!-- 26/Mar/2016 12:38 -->
<!-- TemplateBeginEditable name="sidebar" -->
<!-- TemplateEndEditable -->
</div> <!-- "sidebar" -->
</div> <!-- "columns-wrapper" -->
<!-- =========================================================================== -->
<div class="footer" role="contentinfo">
<table class="_table_footer">
<!--
<table width="104%" border="0" align="center">
-->
<colgroup span="3">
<col width="98%"/>
<col width="1%"/> <!-- Can set this to a very small value & cell will always be wide enough to fit the text when "table-layout: auto;" in _table_footer. Then col 1 has max width to accommodate the copyright notice as the window is narrowed -->
<col width="1%"/>
</colgroup>
<tr>
<td align="left" class="copyright">XCopyright © 2015-<script type="text/javascript">
document.write(new Date().getFullYear());
</script> - Ultrasonic Resonators</td>
<!-- 2021-12-30 - see https://support.knowledgeowl.com/help/automatic-copyright-year for the above script
which automatically updates the year to the current year.
<td align="left" class="copyright">Copyright © 2015-2021 - Ultrasonic Resonators</td>
-->
<td align="right" class="copyright">Page revised on </td>
<div class="footer" data-pgc-field="date_revised">
<td align="left" class="copyright">20yy‑mm‑dd</td>
</div> <!-- footer -->
</tr>
</table>
<!--
<p class="copyright">© 2015 <a href="#">Ultrasonic Resonators</a></p>
-->
</div> <!-- footer -->
</div> <!-- "content-wrapper" -->
</body>
</html>
======== master_as_page_template_10a.html ========
<!doctype html>
<html data-pgc-master="master.html">
<head>
<meta charset="utf-8"/>
<meta http-equiv="X-UA-Compatible" content="IE=Edge"/>
<meta name="viewport" content="width=device-width"/>
<!-- 5/29/2015 - from http://realfavicongenerator.net/ for favicon.ico -->
<link rel="apple-touch-icon" sizes="57x57" href="/apple-touch-icon-57x57.png"/>
<link rel="apple-touch-icon" sizes="60x60" href="/apple-touch-icon-60x60.png"/>
<link rel="apple-touch-icon" sizes="72x72" href="/apple-touch-icon-72x72.png"/>
<link rel="apple-touch-icon" sizes="76x76" href="/apple-touch-icon-76x76.png"/>
<link rel="apple-touch-icon" sizes="114x114" href="/apple-touch-icon-114x114.png"/>
<link rel="apple-touch-icon" sizes="120x120" href="/apple-touch-icon-120x120.png"/>
<link rel="apple-touch-icon" sizes="144x144" href="/apple-touch-icon-144x144.png"/>
<link rel="apple-touch-icon" sizes="152x152" href="/apple-touch-icon-152x152.png"/>
<link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon-180x180.png"/>
<link rel="icon" type="image/png" href="/favicon-32x32.png" sizes="32x32"/>
<link rel="icon" type="image/png" href="/android-chrome-192x192.png" sizes="192x192"/>
<link rel="icon" type="image/png" href="/favicon-96x96.png" sizes="96x96"/>
<link rel="icon" type="image/png" href="/favicon-16x16.png" sizes="16x16"/>
<link rel="manifest" href="/manifest.json"/>
<meta name="msapplication-TileColor" content="#2d89ef"/>
<meta name="msapplication-TileImage" content="/mstile-144x144.png"/>
<meta name="theme-color" content="#ffffff"/>
<!-- End: favicon.ico -->
<!-- TemplateBeginEditable name="doctitle" -->
<title> | Ultrasonic Resonators</title>
<!-- TemplateEndEditable -->
<script type="text/javascript" src="../p7ehc/p7EHCscripts.js"></script>
<!-- Comment away the next to see the pages in print format. -->
<link href="../p7csspbm2/p7csspbm2_09.css" rel="stylesheet" type="text/css"/>
<!-- DRC - 19/Apr/2015 9:56 - moved below after all other stylesheets so that this overrides any conflicts -->
<!--
<link href="../p7csspbm2/p7csspbm2_print.css" rel="stylesheet" type="text/css" media="print">
-->
<!--[if lte IE 7]>
<style>
.menutop li {display: inline;}
div, .menuside a {zoom: 1;}
.masthead .banner, .masthead .banner img {width: 100%;}
</style>
<![endif]-->
<link href="../p7tm3/p7TM3-10.css" rel="stylesheet" type="text/css" media="all"/>
<script type="text/javascript" src="../p7tm3/p7TM3scripts.js"></script>
<link href="../p7tm3/p7TM3-01.css" rel="stylesheet" type="text/css" media="all"/>
<link href="../_drc/drc1a.css" rel="stylesheet" type="text/css"/>
<!-- DRC - 19/Apr/2015 9:57 - moved from above -->
<link href="../p7csspbm2/p7csspbm2_drc_print.css" rel="stylesheet" type="text/css" media="print"/>
<!-- 2016-01-04 - mathjax for displaying equations -->
<script src="../templates/mathjax_renum_equations_2a.js"></script>
<!-- 2016-01-04 - works OK but above has simpler code
2015-12-30
<script src="../templates/mathjax_renum_equations_1a.js"></script>
-->
<!-- The following uses a local mathjax config file, in addition to the std cdn (Content Delivery Network) mathjax config file. In order to do this:
1. Must add "&delayStartupUntilConfig" to the end of the cdn.
2. Must add "MathJax.Hub.Configured();" to the end of the local mathjax config file to let the cdn know that the mathjax configuration has completed.
See (near end of link page) -
https://groups.google.com/forum/embed/#!topic/mathjax-users/J-36V22-G9Q
Use latex_demo_100a.html with local.js to debug (from above link but modified).
-->
<script type="text/javascript" async src="https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.7/MathJax.js?config=TeX-MML-AM_CHTML">
</script>
<!-- Obsolete 2021-12-13 ; replaced by above from
https://docs.mathjax.org/en/v2.7-latest/start.html.
See ! Warning at https://docs.mathjax.org/en/v2.7-latest/start.html --
cdn.mathjax.org was retired in April, 2017.
<script type="text/javascript"
src="http://cdn.mathjax.org/mathjax/latest/MathJax.js?config=TeX-AMS-MML_HTMLorMML&delayStartupUntilConfig"></script>
-->
<script src="../templates/mathjax_config_2a.js"></script>
<!-- TemplateBeginEditable name="localstyles" -->
<style type="text/css">
/* 2/16/2015 - Insert over-riding local styles or external style sheets here */
</style>
<!-- TemplateEndEditable -->
<!-- TemplateBeginEditable name="head" -->
<style type="text/css">
<!-- 1/27/2015 - Insert over-riding external or local styles here -->
<!-- 2/16/2015 - currently not used -->
</style>
<!-- TemplateEndEditable -->
</head>
<body>
<div class="content-wrapper">
<div class="masthead">
<div class="logo">
<h1><span style="font-size: 1.2em">U</span>ltrasonic <span style="font-size: 1.2em">R</span>esonators</h1>
</div>
<!--
<div class="banner"><img src="../p7csspbm2/img/pbm-mast.jpg" alt="">
</div>
-->
</div> <!-- masthead -->
<div class="menutop-wrapper">
<div class="menutop-button-wrapper">
<ul class="menutop" role="menubar">
<li><a href="../index.html" title="Home" target="_self">Home</a></li>
<li><a href="../contents.html" title="Contents" target="_self">Contents</a></li>
<!-- 26/Mar/2016 12:56 - now in Contents
<li><a href="../design_info.html" title="Design info" target="_self">Design info</a></li>
-->
<!-- 1/16/2015 - try to set focus on current button. See current1 in p7csspbm2_09.css
<li><a href="../index.html" class="current1" title="Home" target="_self">Home</a></li>
<li><a href="../design_info.html" class="current2" title="Design info" target="_self">Design info</a></li>
-->
<!-- 2016-06-12
<li><a href="../design_help.html" title="Design help" target="_self">Design help</a></li>
-->
<li><a href="../notes.html" title="Notes" target="_self">Notes</a></li>
<li><a href="../contacts.html" title="Contact" target="_self">Contact</a></li>
</ul>
</div>
<!-- put google translate below -->
<!-- Insert in dwt file
1/17/2015: For the following, see
https://support.google.com/translate/#topic=2534534 - to add the translator
Various layout options are available.
Notes:
1. Set autoDisplay:true if the website should automataically translate is the visitor's website is set to a foreigh language
-->
<div class="google_translate-wrapper">
<div id="google_translate_element"></div> <!-- displays the google drop-down menu. DW flags this as an empty div. -->
</div>
<script type="text/javascript">
function googleTranslateElementInit() {
new google.translate.TranslateElement({
pageLanguage: 'en',
layout: google.translate.TranslateElement.InlineLayout.SIMPLE
}, 'google_translate_element');
}
</script>
<script type="text/javascript" src="http://translate.google.com/translate_a/element.js?cb=googleTranslateElementInit"></script>
<!-- 1/17/2015 - The following was taken from https://support.google.com/translate/answer/2534601?hl=en&ref_topic=2534534 but doesn't work. Note the difference in src. Also, this site requires additional meta data to be entered. Must log in at https://accounts.google.com/ServiceLoginAuth and fill in required info.
</script>
<script type="text/javascript" src="//translate.google.com/translate_a/element.js?cb=googleTranslateElementInit"></script>
-->
</div> <!-- menutop-wrapper -->
<div class="columns-wrapper">
<div class="main-content" data-pgc-field="main_content">
<!-- TemplateBeginEditable name="main-content" -->
<div class="content p7ehc-1">
<h1 class="page-topper">ZTopic</h1>
<p>ZContent</p>
</div> <!-- "content p7ehc-1" -->
<!-- TemplateEndEditable -->
</div> <!-- "main-content" -->
<div class="sidebar"> <!-- 26/Mar/2016 12:38 -->
<!-- TemplateBeginEditable name="sidebar" -->
<!-- TemplateEndEditable -->
</div> <!-- "sidebar" -->
</div> <!-- "columns-wrapper" -->
<!-- =========================================================================== -->
<div class="footer" role="contentinfo">
<table class="_table_footer">
<!--
<table width="104%" border="0" align="center">
-->
<colgroup span="3">
<col width="98%"/>
<col width="1%"/> <!-- Can set this to a very small value & cell will always be wide enough to fit the text when "table-layout: auto;" in _table_footer. Then col 1 has max width to accommodate the copyright notice as the window is narrowed -->
<col width="1%"/>
</colgroup>
<tr>
<td align="left" class="copyright">Copyright © 2015-<script type="text/javascript">
document.write(new Date().getFullYear());
</script> - Ultrasonic Resonators</td>
<!-- 2021-12-30 - see https://support.knowledgeowl.com/help/automatic-copyright-year for the above script
which automatically updates the year to the current year.
<td align="left" class="copyright">Copyright © 2015-2021 - Ultrasonic Resonators</td>
-->
<td align="right" class="copyright">Page revised on </td>
<div class="footer" data-pgc-field="date_revised">
<td align="left" class="copyright">20yy‑mm‑dd</td>
</div> <!-- footer -->
</tr>
</table>
<!--
<p class="copyright">© 2015 <a href="#">Ultrasonic Resonators</a></p>
-->
</div> <!-- footer -->
</div> <!-- "content-wrapper" -->
</body>
</html>