accomplishedThis is really only basic HTML, but as it's getting pretty popular, here is the HTML/code one can use to make one of these components for themselves.
What it does is creates a scrolling component, within which is a table whose rows alternate between two different background colours - in each row is a column for a picture of a TV show gimmick/book cover/CD cover - whatever you want, as well as a column for a title. You can see this code in action in the component titled 'Books I'm Reading' in my journal.
I'm assuming that you've implemented the code of the Additional Components tutorial - you'll need to put that code into your layer before this.
print_comp_header("COMPONENT TITLE");
"""
<div id="Layer1" style="position:relative; width:100%; height:175px; z-index:1; overflow: auto; overflow-x: hidden;">
<table width="100%" cellpadding="3" cellspacing="0">
<tr bgcolor="$*main_bgcolor">
<td align="left">
<img src="THE IMAGE URL" border="0" style="border: 1px solid #000" alt="IF YOU WANT TEXT TO SHOW UP WHEN YOU HOVER THE POINTER, PUT IT HERE" title="AS WELL AS HERE, FOR THOSE WITHOUT INTERNET EXPLORER" /></td>
<td align="left"><b>THE TITLE GOES HERE</b><br> </td>
</tr>
<tr bgcolor="$*comp_bgcolor">
<td align="left">
<img src="THE URL OF THE IMAGE" border="0" style="border: 1px solid #000" alt="ALTERNATE TEXT" title="ALTERNATE TEXT" /></td>
<td align="left"><b>TITLE</b><br> </td>
</tr>
<tr bgcolor="$*main_bgcolor">
<td align="left">
<img src="IMAGE URL" border="0" style="border: 1px solid #000" alt="ALTERNATE TEXT" title="ALTERNATE TEXT"/></td>
<td align="left"><b>TITLE</b><br> </td>
</tr>
<tr bgcolor="$*comp_bgcolor">
<td align="left">
<img src="IMAGE URL" border="0" style="border: 1px solid #000" alt="ALTERNATE TEXT" title="ALTERNATE TEXT"/></td>
<td align="left"><b>TITLE</b><br> </td>
</tr>
""";#Copy and paste as required - you can also delete this line"""
</table>
</div>
""";
print_comp_footer();
#} #If this is your last component, decomment the } sign.
Edit: After realising that if I changed my journal colours, I'd never be able to be bothered to go to the code and change the hexadecimals, I went a-hunting through the LiveJournal source code and came up with my fix. Now that I've changed it, the code automatically changes the colour. That, ladies and gents, is the power of
At the moment, it is the main page background colour and the component background colour that are being used, but you may change the red pieces to any of the colour properties shown on this page - the colour will automatically change with whichever variable you choose.
Edit II: If you try to put this through and your problem is:
print_comp_header("COMPONENT TITLE"); - that line, it is highly probable that you haven't implemented the Additional Components tutorial properly. Go there first. I'm not going to explain how to implement additional components because you should know that before coming here.
Also, this is not the best tutorial for your Music/Book/TV needs; this tutorial by
kunzite1 is easier, s2 compatible and doesn't require farting about with HTML. (And kunzite1 is slightly [read: a lot] better with Component than I am and is therefore better equipped to help when things go tits up)