Search code examples
htmlgoogle-sites

The id I set in Google Sites for an image doesn't work


Every time I try to add an id to an image in my html script, for my google site, and save the changes it disappears from the html script. Here is an example of what I want:

<div style="text-align:left;display:block;margin-right:auto;margin-left:auto">
<table cellspacing="0">
<tbody>
<tr>
<td style="background-color:rgb(243,243,243);width:320px;height:131px">&nbsp;Welcome!<br>
<hr style="color:#f3f3f3;background-color:#00b0f0;height:2px;width:100%">
<ol><li>Introduction</li>
<li>Contacts &amp; Their Roles</li>
<li>Regular Tasks &amp; Deadlines</li>
<li>Priorities/Initiatives of 2017</li>
<li><a href="https://sites.google.com/">AMERA Finance &amp; Accounting Guidelines</a></li>
</ol>
</td>
</tr>
</tbody>
</table>
</div>
<div style="text-align:left;display:block;margin-right:auto;margin-left:auto"><br>
</div>
<div style="text-align:left;display:block;margin-right:auto;margin-left:auto"><img id="intro" border="0" src="https://sites.google.com/imagelink" style="display:block;margin-right:auto;margin-left:auto;text-align:center"></div>
<div style="text-align:left;display:block;margin-right:auto;margin-left:auto">
<div style="text-align:center"><br>
</div>
<img id="contacts" border="0" src="https://sites.google.com/imagelink" style="display:block;margin-right:auto;margin-left:auto;text-align:center">
<div></div>
<br>
<div style="text-align:left;display:block;margin-right:auto;margin-left:auto"></div>
<div style="text-align:left;display:block;margin-right:auto;margin-left:auto">
<div style="text-align:center"></div>
<div style="text-align:center">
<div style="text-align:left">
<img id="tasks" border="0" src="https://sites.google.com/imagelink" style="display:block;margin-right:auto;margin-left:auto;text-align:center"></div>
<div style="text-align:left"><br>
</div>
</div>
<img id="initiatives" border="0" src="https://sites.google.com/imagelink" style="display:block;margin-right:auto;margin-left:auto;text-align:center">
<br>
</div>
<br>
<div><br>
</div>
</div>

The issue is that when I enter that into my html script it comes out as this:

<div style="text-align:left;display:block;margin-right:auto;margin-left:auto">
<table cellspacing="0">
<tbody>
<tr>
<td style="background-color:rgb(243,243,243);width:320px;height:131px">&nbsp;Welcome!<br>
<hr style="color:#f3f3f3;background-color:#00b0f0;height:2px;width:100%">
<ol><li>Introduction</li>
<li>Contacts &amp; Their Roles</li>
<li>Regular Tasks &amp; Deadlines</li>
<li>Priorities/Initiatives of 2017</li>
<li><a href="https://sites.google.com">AMERA Finance &amp; Accounting Guidelines</a></li>
</ol>
</td>
</tr>
</tbody>
</table>
</div>
<div style="text-align:left;display:block;margin-right:auto;margin-left:auto"><br>
</div>
<div style="text-align:left;display:block;margin-right:auto;margin-left:auto"><img border="0" src="https://sites.google.com/imagelink" style="display:block;margin-right:auto;margin-left:auto;text-align:center"></div>
<div style="text-align:left;display:block;margin-right:auto;margin-left:auto">
<div style="text-align:center"><br>
</div>
<img border="0" src="https://sites.google.com/imagelink" style="display:block;margin-right:auto;margin-left:auto;text-align:center">
<div></div>
<br>
<div style="text-align:left;display:block;margin-right:auto;margin-left:auto"></div>
<div style="text-align:left;display:block;margin-right:auto;margin-left:auto">
<div style="text-align:center"></div>
<div style="text-align:center">
<div style="text-align:left">
<img border="0" src="https://sites.google.com/imagelink" style="display:block;margin-right:auto;margin-left:auto;text-align:center"></div>
<div style="text-align:left"><br>
</div>
</div>
<img border="0" src="https://sites.google.com/imagelink" style="display:block;margin-right:auto;margin-left:auto;text-align:center">
<br>
</div>
<br>
<div><br>
</div>
</div>

I don't know why it does this, I am probably making a basic mistake and could really use any help!


Solution

  • I have solved the issue with the help of a friend. To solve this issue you just add a section before your <img> with <a name="anchorname"></a>. As an id="anchorname" doesn't work in Google Sites.

    Then you just need to make the hyperlink for this section be https://sitename.com/pagename#anchorname

    Hope this helps anybody needing the answer to my previous question.