Until now, Coppermine has always been my go-to photo gallery... I am fairly knowledgeable in my php as far as editing... so this is perplexing me..
http://www.insaneshaneparty.com/photos
I am simply trying to center the album in the category... and I have tried everything from editing the CSS to going through the index.php file in both the template and the sample, editing, etc, with no Success. Any help greatly appreciated. All I really need is a point in the right direction!
Thanks so much!
You can't center the album without editing the table structure. Go to your custom themes theme.php and edit these sections.
/******************************************************************************
** Section <<<$template_album_list>>> - START
******************************************************************************/
// 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 tableb_alternate">
<!-- 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}">{ALBUM_TITLE}</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" 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 tableb_alternate">
{ADMIN_MENU}
<p>{ALB_DESC}</p>
<p class="album_stat">{ALB_INFOS}<br />{ALB_HITS}</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">
</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 tableb_alternate">
<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 tableb_alternate">
<!-- 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;
/******************************************************************************
** Section <<<$template_album_list>>> - END
******************************************************************************/
/******************************************************************************
** Section <<<$template_album_list_cat>>> - START
******************************************************************************/
// 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 tableb_alternate">
<!-- 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}">{ALBUM_TITLE}</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" 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 tableb_alternate">
{ADMIN_MENU}
<p>{ALB_DESC}</p>
<p class="album_stat">{ALB_INFOS}<br />{ALB_HITS}</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">
</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 tableb_alternate" >
<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 tableb_alternate">
<!-- 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;
/******************************************************************************
** Section <<<$template_album_list_cat>>> - END
******************************************************************************/
Here is the issue I am running into with that:
The Theme I am using, rainy_day, says only THIS in the theme file:
<?php
/*************************
Coppermine Photo Gallery
************************
Copyright (c) 2003-2011 Coppermine Dev Team
v1.0 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.5.12
$HeadURL: https://coppermine.svn.sourceforge.net/svnroot/coppermine/trunk/cpg1.5.x/themes/rainy_day/theme.php $
$Revision: 8154 $
**********************************************/
// ------------------------------------------------------------------------- //
// This theme has had all redundant CORE items removed //
// ------------------------------------------------------------------------- //
define('THEME_HAS_RATING_GRAPHICS', 1);
define('THEME_HAS_PROGRESS_GRAPHICS', 1);
// HTML template for sys_menu
$template_sys_menu = <<<EOT
<div class="topmenu">
<table border="0" cellpadding="0" cellspacing="0">
<tr>
{BUTTONS}
</tr>
</table>
</div>
EOT;
// HTML template for template sys_menu buttons
$template_sys_menu_button = <<<EOT
<!-- BEGIN {BLOCK_ID} -->
<td><img src="images/spacer.gif" width="5" height="25" border="0" alt="" /></td>
<td><img src="themes/rainy_day/images/button1_r1_c1.gif" width="5" height="25" border="0" alt="" /></td>
<td style="background-image:url(themes/rainy_day/images/button1_r1_c2.gif)">
<a href="{HREF_TGT}" title="{HREF_TITLE}">{HREF_LNK}</a>
</td>
<td><img src="themes/rainy_day/images/button1_r1_c3.gif" width="5" height="25" border="0" alt="" /></td>
<!-- END {BLOCK_ID} -->
EOT;
?>
That is it, nothing more.. so can I simply add the above code? Or must I edit the sample template's theme file?
Add the two sections I pasted into your theme.php right above the closing ?>
Please read the docs on theme editing http://documentation.coppermine-gallery.net/en/theme_create.htm#theme_create
<?php
/*************************
Coppermine Photo Gallery
************************
Copyright (c) 2003-2011 Coppermine Dev Team
v1.0 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.5.12
$HeadURL: https://coppermine.svn.sourceforge.net/svnroot/coppermine/trunk/cpg1.5.x/themes/rainy_day/theme.php $
$Revision: 8154 $
**********************************************/
// ------------------------------------------------------------------------- //
// This theme has had all redundant CORE items removed //
// ------------------------------------------------------------------------- //
define('THEME_HAS_RATING_GRAPHICS', 1);
define('THEME_HAS_PROGRESS_GRAPHICS', 1);
// HTML template for sys_menu
$template_sys_menu = <<<EOT
<div class="topmenu">
<table border="0" cellpadding="0" cellspacing="0">
<tr>
{BUTTONS}
</tr>
</table>
</div>
EOT;
// HTML template for template sys_menu buttons
$template_sys_menu_button = <<<EOT
<!-- BEGIN {BLOCK_ID} -->
<td><img src="images/spacer.gif" width="5" height="25" border="0" alt="" /></td>
<td><img src="themes/rainy_day/images/button1_r1_c1.gif" width="5" height="25" border="0" alt="" /></td>
<td style="background-image:url(themes/rainy_day/images/button1_r1_c2.gif)">
<a href="{HREF_TGT}" title="{HREF_TITLE}">{HREF_LNK}</a>
</td>
<td><img src="themes/rainy_day/images/button1_r1_c3.gif" width="5" height="25" border="0" alt="" /></td>
<!-- END {BLOCK_ID} -->
EOT;
/******************************************************************************
** Section <<<$template_album_list>>> - START
******************************************************************************/
// 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 tableb_alternate">
<!-- 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="center" valign="top" class="tableh2">
<span class="alblink"><a href="{ALB_LINK_TGT}">{ALBUM_TITLE}</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" 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="center" class="tableb tableb_alternate">
{ADMIN_MENU}
<p>{ALB_DESC}</p>
<p class="album_stat">{ALB_INFOS}<br />{ALB_HITS}</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">
</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 tableb_alternate">
<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 tableb_alternate">
<!-- 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;
/******************************************************************************
** Section <<<$template_album_list>>> - END
******************************************************************************/
/******************************************************************************
** Section <<<$template_album_list_cat>>> - START
******************************************************************************/
// 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 tableb_alternate">
<!-- 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}">{ALBUM_TITLE}</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" 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 tableb_alternate">
{ADMIN_MENU}
<p>{ALB_DESC}</p>
<p class="album_stat">{ALB_INFOS}<br />{ALB_HITS}</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">
</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 tableb_alternate" >
<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 tableb_alternate">
<!-- 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;
/******************************************************************************
** Section <<<$template_album_list_cat>>> - END
******************************************************************************/
?>
I have done as you suggested, edited everything to center, and still, you can see on this website http://www.insaneshaneparty.com/photos that this has not centered anything. I have also read that link you posted, yet after editing, still nothing has changed regarding centering. =/
I assume you want to display the album thumbnail centered to your whole website? If so, as long as one column has a width of 100% it will moves the rest to the far left/right. Just decrease the width of that column(s).
http://insaneshaneparty.com/photos/
EXCELLENT to the both of you. I simply continued to edit the width of columns and centering until I achieved the desired effect. Much appreciation to the both of you! =)
Thank you again.
SOLVED =)