Advanced search  

News:

cpg1.5.48 Security release - upgrade mandatory!
The Coppermine development team is releasing a security update for Coppermine in order to counter a recently discovered vulnerability. It is important that all users who run version cpg1.5.46 or older update to this latest version as soon as possible.
[more]

Pages: [1]   Go Down

Author Topic: Thumbnail and Info Alignment  (Read 5893 times)

0 Members and 1 Guest are viewing this topic.

guygar

  • Coppermine novice
  • *
  • Offline Offline
  • Posts: 26
Thumbnail and Info Alignment
« on: April 06, 2011, 03:37:06 pm »

site: coppermine.guygar.com

I am currently modifying coppermine to suit my own needs.

On the thumbnail display issue, I would like the thumbnails to be centred (when the size is small) and the describing text aligned with rest of the content. (Presently the text moves up, when the thumbnail is small).

How do I rearrange the presentation please?

Thank you.

PS: I have searched this forum but I think I'm not using the right terms. Sorry about this because I am sure such a point has been asked before.
Logged

Αndré

  • Administrator
  • Coppermine addict
  • *****
  • Country: de
  • Offline Offline
  • Gender: Male
  • Posts: 15764
Re: Thumbnail and Info Alignment
« Reply #1 on: April 06, 2011, 04:30:43 pm »

I assume you want to center your thumbnails vertically. What is your setting for 'Use dimension (width or height or max aspect for thumbnail)'? Maybe we can add a box with a fixed height and center the thumbnails inside that box. But that only works if you have a fixed thumbnail height.
Logged

guygar

  • Coppermine novice
  • *
  • Offline Offline
  • Posts: 26
Re: Thumbnail and Info Alignment
« Reply #2 on: April 06, 2011, 04:43:01 pm »

I am using 'Max Aspect' at the moment.

I have tried fixed values but that just turns out something not nice to look at.

I am sure tables are not used for this.

Is there any way I could tweak the CSS style somehow so all the thumbnails are aligned i.e. fixed space for thumbnail and comments below?

Thank you.
Logged

Αndré

  • Administrator
  • Coppermine addict
  • *****
  • Country: de
  • Offline Offline
  • Gender: Male
  • Posts: 15764
Re: Thumbnail and Info Alignment
« Reply #3 on: April 06, 2011, 04:47:56 pm »

I am using 'Max Aspect' at the moment.
That's something we can work with :)

The idea is the following. With your 'max aspect' setting your thumbnails have a defined maximum height (that's what I meant in my last post). Now we can add a box width that fixed height to each thumbnail and center your thumbnails inside that box. The result: the meta data (title, description, ...) will be displayed below that box, i.e. all meta data will printed at the same level.

I think this is what you asked for?
Logged

guygar

  • Coppermine novice
  • *
  • Offline Offline
  • Posts: 26
Re: Thumbnail and Info Alignment
« Reply #4 on: April 06, 2011, 04:53:07 pm »

Yes I believe you got the picture correctly.

How could I go about doing so?

Thanks.
Logged

guygar

  • Coppermine novice
  • *
  • Offline Offline
  • Posts: 26
Re: Thumbnail and Info Alignment
« Reply #5 on: April 07, 2011, 12:42:45 pm »

hi andre,

would appreciate your input on this topic please.

thank you.
Logged

Αndré

  • Administrator
  • Coppermine addict
  • *****
  • Country: de
  • Offline Offline
  • Gender: Male
  • Posts: 15764
Re: Thumbnail and Info Alignment
« Reply #6 on: April 07, 2011, 01:33:56 pm »

Please respect that this is no hotline and we're all volunteers. I'll help you asap.
Logged

guygar

  • Coppermine novice
  • *
  • Offline Offline
  • Posts: 26
Re: Thumbnail and Info Alignment
« Reply #7 on: April 07, 2011, 01:49:33 pm »

Yes of course. I realize that and also very grateful for your priceless guidance.

Thanks as always.
Logged

guygar

  • Coppermine novice
  • *
  • Offline Offline
  • Posts: 26
Re: Thumbnail and Info Alignment
« Reply #8 on: April 19, 2011, 07:21:02 pm »

greetings,

i was wondering if there would be further help on this issue?

best regards.
Logged

Αndré

  • Administrator
  • Coppermine addict
  • *****
  • Country: de
  • Offline Offline
  • Gender: Male
  • Posts: 15764
Re: Thumbnail and Info Alignment
« Reply #9 on: May 04, 2011, 01:48:27 pm »

Copy the following code to your theme's theme.php file:
Code: [Select]
$template_thumbnail_view = <<<EOT

<!-- BEGIN header -->
        <tr>
<!-- END header -->
<!-- BEGIN thumb_cell -->
        <td valign="top" class="thumbnails" width ="{CELL_WIDTH}" align="center">
                <table width="100%" cellpadding="0" cellspacing="0">
                        <tr>
                                <td align="center" height="{$CONFIG['thumb_width']}">
                                        <a href="{LINK_TGT}">{THUMB}</a>
                                </td>
                        </tr>
                        <tr>
                                <td align="center">
                                        {CAPTION}
                                        {ADMIN_MENU}
                                </td>
                        </tr>
                </table>
        </td>
<!-- END thumb_cell -->

<!-- BEGIN empty_cell -->
                <td valign="top" class="thumbnails" align="center">&nbsp;</td>
<!-- END empty_cell -->
<!-- BEGIN row_separator -->
        </tr>
        <tr>
<!-- END row_separator -->
<!-- BEGIN footer -->
        </tr>
<!-- END footer -->
<!-- BEGIN tabs -->
        <tr>
                <td colspan="{THUMB_COLS}" style="padding: 0px;">
                        <table width="100%" cellspacing="0" cellpadding="0">
                                <tr>
                                       {TABS}
                                </tr>
                        </table>
                </td>
        </tr>
<!-- END tabs -->
<!-- BEGIN spacer -->
        <img src="images/spacer.gif" width="1" height="7" border="" alt="" /><br />
<!-- END spacer -->

EOT;
Logged

guygar

  • Coppermine novice
  • *
  • Offline Offline
  • Posts: 26
Re: Thumbnail and Info Alignment
« Reply #10 on: May 04, 2011, 03:09:01 pm »

website: http://coppermine.guygar.com

hi Αndré,

thank you for your help.

i have added the code as you suggested but there is an alignment problem  :(

as can be seen from the attached image.

would it be possible to correct this by any chance?

many thanks.
Logged

Αndré

  • Administrator
  • Coppermine addict
  • *****
  • Country: de
  • Offline Offline
  • Gender: Male
  • Posts: 15764
Re: Thumbnail and Info Alignment
« Reply #11 on: May 04, 2011, 04:01:04 pm »

Try to replace the code I gave you with the following code:
Code: [Select]
$image_height = $CONFIG['thumb_width'] + 5;
$template_thumbnail_view = <<<EOT

<!-- BEGIN header -->
        <tr>
<!-- END header -->
<!-- BEGIN thumb_cell -->
        <td valign="top" class="thumbnails" width ="{CELL_WIDTH}" align="center">
                <table width="100%" cellpadding="0" cellspacing="0">
                        <tr>
                                <td align="center" height="$image_height">
                                        <a href="{LINK_TGT}">{THUMB}</a>
                                </td>
                        </tr>
                        <tr>
                                <td align="center">
                                        {CAPTION}
                                        {ADMIN_MENU}
                                </td>
                        </tr>
                </table>
        </td>
<!-- END thumb_cell -->

<!-- BEGIN empty_cell -->
                <td valign="top" class="thumbnails" align="center">&nbsp;</td>
<!-- END empty_cell -->
<!-- BEGIN row_separator -->
        </tr>
        <tr>
<!-- END row_separator -->
<!-- BEGIN footer -->
        </tr>
<!-- END footer -->
<!-- BEGIN tabs -->
        <tr>
                <td colspan="{THUMB_COLS}" style="padding: 0px;">
                        <table width="100%" cellspacing="0" cellpadding="0">
                                <tr>
                                       {TABS}
                                </tr>
                        </table>
                </td>
        </tr>
<!-- END tabs -->
<!-- BEGIN spacer -->
        <img src="images/spacer.gif" width="1" height="7" border="" alt="" /><br />
<!-- END spacer -->

EOT;
Logged

guygar

  • Coppermine novice
  • *
  • Offline Offline
  • Posts: 26
Re: Thumbnail and Info Alignment
« Reply #12 on: May 04, 2011, 04:21:07 pm »

website: http://coppermine.guygar.com

thanks Andre,

but it still is not lined up  :-[

it is a slight difference i know but would like it to line up correctly.

kind regards.
Logged

Αndré

  • Administrator
  • Coppermine addict
  • *****
  • Country: de
  • Offline Offline
  • Gender: Male
  • Posts: 15764
Re: Thumbnail and Info Alignment
« Reply #13 on: May 04, 2011, 05:36:45 pm »

Just further increase the bold number in the first line:
Quote
$image_height = $CONFIG['thumb_width'] + 5;
Logged

guygar

  • Coppermine novice
  • *
  • Offline Offline
  • Posts: 26
Re: Thumbnail and Info Alignment
« Reply #14 on: May 04, 2011, 05:44:49 pm »

sooooooo perfect!

thank you for taking the time for your guidence  ;D

it is working well!

best regards.
Logged
Pages: [1]   Go Up
 

Page created in 0.021 seconds with 20 queries.