Google Sites html table help
Google Sites html table help
In the absence of any other way, it appears I am stuck with editing the html on my gallery page.
I need to add the borders around the bottom few photos and I cannot get it right - I end up with some lines but not in the right place. Can anyone tell me what to add where to get lines around the photos I have just added? (Google makes a horrible mess of the html, so it's never simple)
Is there any application/software etc that would do a better job for me than tussling with the Google software? I would love smaller images that can be clicked on to enlarge. If it could also be incorporated in another (wordpress) site, even better.
I need to add the borders around the bottom few photos and I cannot get it right - I end up with some lines but not in the right place. Can anyone tell me what to add where to get lines around the photos I have just added? (Google makes a horrible mess of the html, so it's never simple)
Is there any application/software etc that would do a better job for me than tussling with the Google software? I would love smaller images that can be clicked on to enlarge. If it could also be incorporated in another (wordpress) site, even better.
- Harborfields
- Posts: 358
- Joined: Tue Jul 05, 2011 11:29 pm
- Location: West Boothbay Harbor, Maine
- Contact:
Looking at the source code for the page briefly, it appears that your second group of photos are not in the same table as the first group of photos -- there looks to be a </table> tag buried in there, so you need to copy and paste all the table rows with your new photos to be above that tag (or move that tag to below your new photos). Does this make any sense?
I understand what you're saying so that's a start but.....!
I have played around removing varying bits of code, but can't find exactly which bits to remove. Just the </table tag> doesn't work, but removing other bits does not achieve the end result either. Have to say I go way out of my depth once it comes to the horrible html that Google produces.
I have played around removing varying bits of code, but can't find exactly which bits to remove. Just the </table tag> doesn't work, but removing other bits does not achieve the end result either. Have to say I go way out of my depth once it comes to the horrible html that Google produces.
It is really hard to read/decipher generated code - much easier if it's been hand coded - but not many people do that any more (me included).Nemo wrote:Have to say I go way out of my depth once it comes to the horrible html that Google produces.
As Harborfields says, you appear to have created two tables: the first having the border attribute you want and the second having none. You should be able to fix this by deleting the second table and adding the photos to the first table.
This is the relevant HTML:
<div>
<div style="text-align: center; margin: 5px 0px 0px 10px; display: inline;">
<table cellspacing="0" bordercolor="#888888" border="1" style="border-color: rgb(136, 136, 136); border-width: 1px; border-collapse: collapse;">
<tbody>
<tr>
</tr>
<tr>
</tr>
<tr>
</tr>
<tr>
</tr>
<tr>
</tr>
<tr>
</tr>
</tbody>
</table>
</div>
<table>
<tbody>
<tr>
</tr>
<tr>
</tr>
</tbody>
</table>
The bit in red is the "extra" table.
I don't see exactly what you see unfortunately.
At the end of my last photo before the new one I have this.
</DIV>
</TD>
</TR>
</TBODY>
</TABLE>
</DIV>
<TABLE>
<TBODY>
<TR>
<TD style="WIDTH: 381px; HEIGHT: 295px"> >
<DIV style="TEXT-ALIGN: left; DISPLAY: block">
<DIV style="TEXT-ALIGN: center; ZOOM: 1; DISPLAY: block; MARGIN-LEFT: auto; MARGIN-RIGHT: auto">
<DIV style="TEXT-ALIGN: center; ZOOM: 1; DISPLAY: block; MARGIN-LEFT: auto; MARGIN-RIGHT: auto">
I am assuming I need to remove the end of the last table and the beginning of the new one, then leave the end of the table at the end of all the photos? So I've tried removing varying bits here as per your suggestions, but Google just gives me an error message and reverts back to the original two tables.
I didn't knowingly create another table;I thought I was adding rows below but apparently not.
I'm thinking I may have to remove the table altogether and start again, but I cannot remember how I added the lines in the first place. Google really tries to stop you editing the html, so I don't think I'd manage it via html. I just know I wasted hours.
At the end of my last photo before the new one I have this.
</DIV>
</TD>
</TR>
</TBODY>
</TABLE>
</DIV>
<TABLE>
<TBODY>
<TR>
<TD style="WIDTH: 381px; HEIGHT: 295px"> >
<DIV style="TEXT-ALIGN: left; DISPLAY: block">
<DIV style="TEXT-ALIGN: center; ZOOM: 1; DISPLAY: block; MARGIN-LEFT: auto; MARGIN-RIGHT: auto">
<DIV style="TEXT-ALIGN: center; ZOOM: 1; DISPLAY: block; MARGIN-LEFT: auto; MARGIN-RIGHT: auto">
I am assuming I need to remove the end of the last table and the beginning of the new one, then leave the end of the table at the end of all the photos? So I've tried removing varying bits here as per your suggestions, but Google just gives me an error message and reverts back to the original two tables.
I didn't knowingly create another table;I thought I was adding rows below but apparently not.
I'm thinking I may have to remove the table altogether and start again, but I cannot remember how I added the lines in the first place. Google really tries to stop you editing the html, so I don't think I'd manage it via html. I just know I wasted hours.
Do you have access to the html - some of these apps allow you to click on a "source" button to edit the underlying code
If so then you could try replacing the tag that starts the second table in line 222
<table>
with
<table border="1" bordercolor="#888" cellspacing="0" style="BORDER-BOTTOM-COLOR:#888;BORDER-RIGHT-WIDTH:1px;BORDER-TOP-COLOR:#888;BORDER-COLLAPSE:collapse;BORDER-TOP-WIDTH:1px;BORDER-BOTTOM-WIDTH:1px;BORDER-RIGHT-COLOR:#888;BORDER-LEFT-COLOR:#888;BORDER-LEFT-WIDTH:1px">
which is the code that starts your first one.
Otherwise you could just delete the
</tbody></table></div>
<table>
<tbody>
from lines 221-223
I THINK that would do the trick as it would merge the two tables together.
PM me if you need more detail.
If so then you could try replacing the tag that starts the second table in line 222
<table>
with
<table border="1" bordercolor="#888" cellspacing="0" style="BORDER-BOTTOM-COLOR:#888;BORDER-RIGHT-WIDTH:1px;BORDER-TOP-COLOR:#888;BORDER-COLLAPSE:collapse;BORDER-TOP-WIDTH:1px;BORDER-BOTTOM-WIDTH:1px;BORDER-RIGHT-COLOR:#888;BORDER-LEFT-COLOR:#888;BORDER-LEFT-WIDTH:1px">
which is the code that starts your first one.
Otherwise you could just delete the
</tbody></table></div>
<table>
<tbody>
from lines 221-223
I THINK that would do the trick as it would merge the two tables together.
PM me if you need more detail.
It's horrible code to debug i'm afraid Nemo. I've spent 10 minutes going round in circles - the last 4 images are a bit of a mess to debug as there are so many different bits of styling on the page.
Sorry but I think you might be better off starting the table again (or doing yourself a Wordspress site )
Sorry but I think you might be better off starting the table again (or doing yourself a Wordspress site )