Page 1 of 1

Help/advice making 2-column layout of userprofiles plugin ?

Posted: Tue Sep 14, 2010 2:21 am
by adensmore
Hi,

This is a followup to my original post that Garvin mostly helped with,
http://board.s9y.org/viewtopic.php?f=2&t=16759

I've got s9y working as advised by embedding my custom code into it (ie NOT using s9y embedding), and here is the staging link to the s9y blog on our custom website:

http://www.gulfcoastmag.org/blog/

(I created a custom "gulf" template/theme based on Serendipity v2.3 theme, and edited gulfcoas\blog\templates\gulf\config.inc.php, gulfcoas\blog\templates\gulf\index.tpl, and gulfcoas\blog\templates\gulf\style.css, for the custom header/footer code, etc...)

I'm still somewhat far from my ultimate goal though, which is to have a custom layout with each post accompanied by an author photo and short bio (ie author profiles), in a very specific two-column layout, as shown in this comp:

http://gulfcoastmag.org/blogcomp.jpg

Garvin suggested I install the serendipity_event_userprofiles plugin, and I have and it is working, but by default it wraps the post *around* the author profile in a single column layout.

Can anyone give me advice about how hard it's going to be to adjust this plugin so that it's in a two-column layout, and possibly how to go about doing it? I feel like maybe I should be able to find this and figure it out myself, but I'm pretty intimidated by the code so far.

Any help/advice is greatly appreciated !
And thanks for all the help that got me this far,
Alan

Re: Help/advice making 2-column layout of userprofiles plugi

Posted: Tue Sep 14, 2010 9:41 am
by garvinhicking
Hi!

Basically, the CSS for .serendipity_authorpic would need adjustment. But I'm not solid enough with CSS to know how to put a specific column for the picture to the left; I only know how to float it left or right, but then the text would wrap around it.

If nobody else knows the proper CSS for that (if it exists), I would go this route:

1. Edit style.css to put

Code: Select all

.serendipity_authorpic {
display: none
}

.realauthorpic .serendipity_authorpic {
display: block !important;
}
into the code, to hide the userprofile default output completely.

2. Edit entries.tpl to put the author picture in the place you want it. Since I don't know the CSS code required for column usage, I would need to use a HTML table.

Look for the place where {$entry.body} gets put, and instead use this code at its place:

Code: Select all

<table width="100%">
<tr>
<td width="20%" class="realauthorpic">
{$entry.authorpic}
</td>
<td width="80%">
{$entry.body}
</td>
</tr>
</table>
Maybe this is a start at least :)

Regards,
Garvin

Re: Help/advice making 2-column layout of userprofiles plugi

Posted: Tue Sep 14, 2010 8:31 pm
by adensmore
Garvin this looks like an awesome start ; you are absolutely the best. !
Let me play with it and followup, thank you thank you !