A more efficient way of writing my table code.

  • 1
  • Question
  • Updated 7 years ago
  • Answered
I'm sure that there is a better way of writing this code than what I have done so far. Any ideas for you HTML experts out there? The reason I have two columns is because I want the dates to line up properly.

You can see on my web site when you click on Radio Shows that I have my show in a table format. I just want it to look like the Month followed by the date. I'm just playing around with different options. Any ideas would very welcome, even it involves doing something completely different. :)

www.mcran.com




<html>
<body>

<table border="0" bordercolor="#FFCC00" style="background-color:#F9FFE8" width="110" cellpadding="0" cellspacing="0">
<tr><th>2011</th><th></th></tr>
<tr><th>Month</th><th>Date</th></tr>
<tr><td><a href="http://sd.mcran.com/assets/shows/2011/ITJAN0211.mp3">January</a></td><td><a href="http://sd.mcran.com/assets/shows/2011/ITJAN0211.mp3">02</a></td></tr>
<tr><td><a href="http://sd.mcran.com/assets/shows/2011/ITJAN0911.mp3">January</a></td><td><a href="http://sd.mcran.com/assets/shows/2011/ITJAN0211.mp3">09</a></td></tr>
<tr><td><a href="http://sd.mcran.com/assets/shows/2011/ITJAN1611.mp3">January</a></td><td><a href="http://sd.mcran.com/assets/shows/2011/ITJAN0211.mp3">16</a></td></tr>
<tr><td><a href="http://sd.mcran.com/assets/shows/2011/ITJAN2311.mp3">January</a></td><td><a href="http://sd.mcran.com/assets/shows/2011/ITJAN0211.mp3">23</a></td></tr>
<tr><td><a href="http://sd.mcran.com/assets/shows/2011/ITJAN3011.mp3">January</a></td><td><a href="http://sd.mcran.com/assets/shows/2011/ITJAN0211.mp3">30</a></td></tr>

</table>

</body>
</html>

Photo of Randy

Randy

  • 643 Posts
  • 8 Reply Likes
  • thankful

Posted 7 years ago

  • 1
Photo of Andi North, Mangopear Media

Andi North, Mangopear Media

  • 782 Posts
  • 111 Reply Likes
Hello Randy,

Firstly, instead of creating the code manually, have you thought about ading the following code to 5 different text widgets (by clicking on the HTML button in the Text Toolbar).

<!---

<table width="600" border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="100">Month:</td>
<td width="100">2000</td>
<td width="100">2001</td>
<td width="100">2002</td>
<td width="100">2003</td>
<td width="100">2004</td>
</tr>
<tr>
<td>January</td>
<td>1st 5th 27th</td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td>February</td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td>March</td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td>April</td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td>May</td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td>June</td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td>July</td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td>August</td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td>September</td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td>October</td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td>November</td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td>December</td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
</table>

--->

If you add that codeu using the HTML button, you will be able to edit the table's text without having to manually code it. You will be able to use all of the usual Yola Text Toolbar tools - like font, colour, highlighting and links.

As you will see, I have changed the dates from 02 06 11 27 to 2nd 6th 11th 27th. It makes it clearer to the users that these are dates.

Hope this helps.

Andi
Photo of Kevin

Kevin

  • 475 Posts
  • 29 Reply Likes
Great Job Andi!

Kevin
Photo of Nazlie

Nazlie

  • 1721 Posts
  • 51 Reply Likes
Thanks for helping out with this one, Andi. Much appreciated!
Photo of Andi North, Mangopear Media

Andi North, Mangopear Media

  • 782 Posts
  • 111 Reply Likes
No problem Guys,

I just want to let everyone know quite how much can be done with the Sitebuilder. Especially the Text Widget. I have added TabbedPanels into them and been able to edit the raw text (www.shamrockandrambler.co.uk/route31..... It is the best editor ever!

Andi
Photo of Randy

Randy

  • 643 Posts
  • 8 Reply Likes
I had no idea you could do this with the text widget using HTML. I was aware of the HTML feature in the text widget but not what you described in your post. You just ruined my Saturday. I was going to go for a walk but now I am very excited to try all of this out. :) Thanks so much Andi!!
Photo of Randy

Randy

  • 643 Posts
  • 8 Reply Likes
I just tried it out and it works great except for one thing. I can't click on a date so that I can listen to the show for that date. This is what I have now when you click on my Radio Shows link on my web site.
Photo of Andi North, Mangopear Media

Andi North, Mangopear Media

  • 782 Posts
  • 111 Reply Likes
Hello Randy,

I did not add the links. Sorry, you can just ad them using the Link button. That will work!

Andi
Photo of Randy

Randy

  • 643 Posts
  • 8 Reply Likes
Thanks Andi. I didn't know that the text widget had all this functionality. Pretty cool.
Photo of Andi North, Mangopear Media

Andi North, Mangopear Media

  • 782 Posts
  • 111 Reply Likes
No problem Randy,

Glad it worked!

Kind Regards,

Andi