Center Album Thumbnails & Titles

[ShiversOfHorror]

I'm currently running 1.4.18 (which will be updated after I get the template the way I want it) it is password protected right now so nobody can access it and mess with it.

My theme is a theme I started a few months back.

On thumbnail view for albums (inside a catagory), I would like to make images centered, and the title of the albums centered (but do not want to make catagories on the main page centered)

How do I go about doing this?

Please note, I have searched and found a few posts refering to this, but they are older versions, a tad confusing, and mostly unsolved.

I have learned that what needs to be edited is in theme.php of my theme. However, my theme.php doesn't contain much, and since its been a few months since I was able to work on this, I'm not sure if I have already edited whats there. (in other words, I'm not sure that I should go about replacing stuff in there with stuff from the sample theme.php)

Here is my theme.php

Code Select Expand

// HTML template for template sys_menu spacer
$template_sys_menu_spacer ='::';

// HTML template for title row of the thumbnail view (album title + sort options)
$template_thumb_view_title_row = <<<EOT

                        <table width="100%" cellpadding="0" cellspacing="0">
                        <tr>
                                <td width="100%" class="statlink"><h2>{ALBUM_NAME}</h2></td>
                               
                        </tr>
                        </table>

EOT;

?>



http://forum.coppermine-gallery.net/index.php/topic,47700.0.html - I tried copying this to my theme.php, it did nothing

Any help would be great, as I need this up and running for the public on the 12th of Feb.

[ShiversOfHorror]

Any ideas please?

[Ludo]

Center the <h2> containing album name in $template_thumb_view_title_row, and do basicly the same on $template_thumbnail_view (which you need to copy and paste from sample theme).

[ShiversOfHorror]

Ok, I'll see if I can figure that out.

Thanks

[ShiversOfHorror]

Center the <h2> containing album name in $template_thumb_view_title_row, and do basicly the same on $template_thumbnail_view (which you need to copy and paste from sample theme).

Just finally got back to editing this. Site never went up.

Anyhow, I centered the <h2> didn't seem to do anything probably because I haven't figured out which part to copy for the $template_thumbnail_view I don't know where to start copying it, where to end, or where to center it?

[Joachim Müller]

Code Select Expand

// HTML template for thumbnails display
$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">
                                        <a href="{LINK_TGT}">{THUMB}<br /></a>
                                        {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;

[ShiversOfHorror]

Thanks, tried that but it didn't center it. Still looks like this:

[Joachim Müller]

Haven't said that this is the code to make things centered. Above mentioned code is the answer to the question

I haven't figured out which part to copy for the $template_thumbnail_view I don't know where to start copying it, where to end

.
Let me remind you of board rules as well - you agreed to respect them when signing up. In your special case: post a link to your gallery. Additionally, zip your custom theme folder an attach the zip to your next posting.

[ShiversOfHorror]

As for the code, I saw many align center codes, so assumed it was edited to align the areas I needed aligned.

My gallery is currently password protected - it isn't live so to speak - so that people don't see it, plus I hadn't updated it till a day or two ago, didn't want hackers to mess it up before I had the chance to fix it. I can attach the zip files of my theme, and I can PM you a password to the gallery, but for obvious reasons I don't want to post the username/password on the forum. Let me know if you want one.

All I am trying to do is center the Text and Photo in that image attached above.

Here is the theme zipped.

[ShiversOfHorror]

With a little guess work, I got the titles to center by adding center code to the following area on $template_album_list

Code Select Expand

                        <span class="alblink"><a href="{ALB_LINK_TGT}"><b><center>{ALBUM_TITLE}</center></b></a></span>

I still however cannot figure out how to center the thumbnails on the same page. I've tried adding the center code to different areas of $template_thumbnail_view like suggested above. I assumed it would go

Code Select Expand

                                        <center><a href="{LINK_TGT}">{THUMB}<br /></a></center>
OR

Code Select Expand

<a href="{LINK_TGT}"><center>{THUMB}</center><br /></a>

But that doesn't work either. Instead it seems to expand one of the tables.

I also tried to add the center code to $temmplate_album_list here:

Code Select Expand

                        <a href="{ALB_LINK_TGT}" class="albums"><center>{ALB_LINK_PIC}</center><br /></a>

But that didn't work.

I'm sure someone out there somewhere has figured this out and can tell me where to enter the center code.

This is my theme.php

Code Select Expand

<?php
/*************************
  Coppermine Photo Gallery
  ************************
  Copyright (c) 2003-2008 Dev Team
  v1.1 originally written by Gregory DEMAR

  This program is free software; you can redistribute it and/or modify
  it under the terms of the GNU General Public License version 3
  as published by the Free Software Foundation.
  
  ********************************************
  Coppermine version: 1.4.16
  $HeadURL: https://coppermine.svn.sourceforge.net/svnroot/coppermine/trunk/cpg1.4.x/themes/camp_blood/theme.php $
  $Revision: 4233 $
  $Author: gaugau $
  $Date: 2008-02-02 09:23:58 +0100 (Sa, 02 Feb 2008) $
**********************************************/



// HTML template for template sys_menu spacer
$template_sys_menu_spacer ='::';

// HTML template for title row of the thumbnail view (album title + sort options)
$template_thumb_view_title_row = <<<EOT

                        <table width="100%" cellpadding="0" cellspacing="0">
                        <tr>
                                <td width="100%" class="statlink"><h2>{ALBUM_NAME}</h2></td>
                                
                        </tr>
                        </table>

EOT;

// HTML template for the album list
$template_album_list = <<<EOT

<!-- BEGIN stat_row -->
        <tr>
                <td colspan="{COLUMNS}" class="tableh1" align="center"><span class="statlink">{STATISTICS}</span></td>
        </tr>
<!-- END stat_row -->
<!-- BEGIN header -->
        <tr class="tableb_compact">
<!-- END header -->
<!-- BEGIN album_cell -->
        <td width="{COL_WIDTH}%" valign="top">
        <table width="100%" cellspacing="0" cellpadding="0">
        <tr>
                <td colspan="3" height="1" align="left" valign="top" class="tableh2">
                        <span class="alblink"><a href="{ALB_LINK_TGT}"><b><center>{ALBUM_TITLE}</center></b></a></span>
                </td>
        </tr>
        <tr>
                <td colspan="3">
                        <img src="images/spacer.gif" width="1" height="1" border="0" alt="" /><br />
                </td>
        </tr>
        <tr>
                <td align="center" valign="middle" class="thumbnails">
                        <img src="images/spacer.gif" width="{THUMB_CELL_WIDTH}" height="1" class="image" style="margin-top: 0px; margin-bottom: 0px; border: none;" alt="" /><br />
                        <a href="{ALB_LINK_TGT}" class="albums">{ALB_LINK_PIC}<br /></a>
                </td>
                <td>
                        <img src="images/spacer.gif" width="1" height="1" border="0" alt="" />
                </td>
                <td width="100%" valign="top" align="left" class="tableb_compact">
                        {ADMIN_MENU}
                        <p>{ALB_DESC}</p>
                </td>
        </tr>
        </table>
        </td>
<!-- END album_cell -->
<!-- BEGIN empty_cell -->
        <td width="{COL_WIDTH}%" valign="top">
        <table width="100%" cellspacing="0" cellpadding="0">
        <tr>
                <td height="1" valign="top" class="tableh2">
                        <b>&nbsp;</b>
                </td>
        </tr>
        <tr>
                <td>
                        <img src="images/spacer.gif" width="1" height="1" border="0" alt="" /><br />
                </td>
        </tr>
        <tr>
                <td width="100%" valign="top" class="tableb_compact">
                    <div class="thumbnails" style="background-color:transparent"><img src="images/spacer.gif" width="1" height="1" border="0" class="image" style="border:0;margin-top:1px;margin-bottom:0" alt="" /></div>
                </td>
        </tr>
        </table>
        </td>
<!-- END empty_cell -->
<!-- BEGIN row_separator -->
        </tr>
        <tr class="tableb_compact">
<!-- END row_separator -->
<!-- BEGIN footer -->
        </tr>
<!-- END footer -->
<!-- BEGIN tabs -->
        <tr>
                <td colspan="{COLUMNS}" 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;

// HTML template for the album list
$template_album_list_cat = <<<EOT

<!-- BEGIN c_stat_row -->
        <tr>
                <td colspan="{COLUMNS}" class="tableh1" align="center"><span class="statlink">{STATISTICS}</span></td>
        </tr>
<!-- END c_stat_row -->
<!-- BEGIN c_header -->
        <tr class="tableb_compact">
<!-- END c_header -->
<!-- BEGIN c_album_cell -->
        <td width="{COL_WIDTH}%" valign="top">
        <table width="100%" cellspacing="0" cellpadding="0">
        <tr>
                <td colspan="3" height="1" valign="top" class="tableh2">
                        <span class="alblink"><a href="{ALB_LINK_TGT}"><b>{ALBUM_TITLE}</b></a></span>
                </td>
        </tr>
        <tr>
                <td colspan="3">
                        <img src="images/spacer.gif" width="1" height="1" border="0" alt="" /><br />
                </td>
        </tr>
        <tr>
                <td align="center" valign="middle" class="thumbnails">
                        <img src="images/spacer.gif" width="{THUMB_CELL_WIDTH}" height="1" class="image" style="margin-top: 0px; margin-bottom: 0px; border: none;" alt="" /><br />
                        <a href="{ALB_LINK_TGT}" class="albums">{ALB_LINK_PIC}<br /></a>
                </td>
                <td>
                        <img src="images/spacer.gif" width="1" height="1" border="0" alt="" />
                </td>
                <td width="100%" valign="top" class="tableb_compact">
                        {ADMIN_MENU}
                        <p>{ALB_DESC}</p>
                </td>
        </tr>
        </table>
        </td>
<!-- END c_album_cell -->
<!-- BEGIN c_empty_cell -->
        <td width="{COL_WIDTH}%" valign="top">
        <table width="100%" cellspacing="0" cellpadding="0" >
        <tr>
                <td height="1" valign="top" class="tableh2">
                        <b>&nbsp;</b>
                </td>
        </tr>
        <tr>
                <td>
                        <img src="images/spacer.gif" width="1" height="1" border="0" alt="" /><br />
                </td>
        </tr>
        <tr>
                <td width="100%" valign="top" class="tableb_compact" >
                      <div class="thumbnails" style="background-color:transparent"><img src="images/spacer.gif" width="1" height="1" border="0" class="image" style="border:0;margin-top:1px;margin-bottom:0" alt="" /></div>
                </td>
        </tr>
        </table>
        </td>
<!-- END c_empty_cell -->
<!-- BEGIN c_row_separator -->
        </tr>
        <tr class="tableb_compact">
<!-- END c_row_separator -->
<!-- BEGIN c_footer -->
        </tr>
<!-- END c_footer -->
<!-- BEGIN c_tabs -->
        <tr>
                <td colspan="{COLUMNS}" style="padding: 0px;">
                        <table width="100%" cellspacing="0" cellpadding="0">
                                <tr>
                                       {TABS}
                                </tr>
                        </table>
                </td>
        </tr>
<!-- END c_tabs -->
<!-- BEGIN c_spacer -->
        <img src="images/spacer.gif" width="1" height="7" border="" alt="" /><br />
<!-- END c_spacer -->

EOT;

// HTML template for thumbnails display
$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">
                                        <a href="{LINK_TGT}">{THUMB}<br /></a> 
                                        {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;

?>


[ShiversOfHorror]

Anyone? I need this working within the next 24hrs...it looks very stupid the way it is now.

[Nibbler]

Difficult to tell without seeing the actual site, but I think you need to add a width="100%" on these:

Code Select Expand


<td align="center" valign="middle" class="thumbnails">


[ShiversOfHorror]

Thanks will give that a try right now.

I can always give a test password/user name to those that need to see it through PM.

[ShiversOfHorror]

Thank you, so much!

That edit worked. There were two places I could have added the code, I added it to the first place which was within $template_album_list