forum.coppermine-gallery.net
Support => cpg1.3.x Support => Older/other versions => cpg1.3 Themes/Skins/Templates => Topic started by: rubbersoul on March 15, 2005, 04:41:18 am
-
What I'm trying to do is change the color of the random image table's background. If I 'view' the source code of my website I can see that the class of that table is 'maintable' however....I don't want to alter 'maintables' color as that will alter it everywhere maintable is set! I just want to change the color of the random images table....how can this be done? I know that that table is generated somehow as it's not part of any .php table layout that I can see....I'm confused, where can I change it...thanks!
-
Nothing?
-
I think this is possible. First, open up your theme's style.css file and duplicate the maintable section, and give it a unique name (in this example I used maintable234). Then in your theme.php file, change
function starttable($width = '-1', $title = '', $title_colspan = '1')
to
function starttable($width = '-1', $title = '', $title_colspan = '1', $album = '')
and in function theme_display_thumbnails, change
if ($mode == 'thumb') {
starttable('100%', $title, $thumbcols);
to
if ($mode == 'thumb') {
if ($aid == 'random') {
starttable('100%', $title, $thumbcols, $aid);
} else {
starttable('100%', $title, $thumbcols);
}
Now, in function starttable, change
<!-- Start standard table -->
echo <<<EOT
<!-- Start standard table -->
<table align="center" width="$width" cellspacing="1" cellpadding="0" class="maintable">
EOT;
to
if ($aid) {
echo <<<EOT
<!-- Start standard table -->
<table align="center" width="$width" cellspacing="1" cellpadding="0" class="maintable234">
EOT;
} else {
echo <<<EOT
<!-- Start standard table -->
<table align="center" width="$width" cellspacing="1" cellpadding="0" class="maintable">
EOT;
}
This is untested. Make sure to back up your originals first.
-
No cigar! Changed everything as you said....no errors....but no change at all!
-
Post a link to your site.
-
I cant.....hosted locally....no access from the outside yet......do you want the code I changed? I can post that and assure you that it's exactly as you said!
-
OK.....have a link up http://70.80.114.119:498/index.php?cat=0 Let me know....need help on this one!
-
Ok, instead of
if ($aid) {
echo <<<EOT
try
if ($album) {
echo <<<EOT
$aid isn't the variable in starttable, it's $album. My mistake.
-
This is the stuff I'm struggeling to accomplish....
-
Whoa, you were asking to change one meta album's background. Let's get that working first, ok? Try my $aid -> $album fix posted above.
-
OK....I did it...and I used an Orange color for the time being in my CSS just so I could see the change before I use my image.....however....if you look on my site you'll see that it changed a table behind a group of other tables.....I need those to become transparent so that you'll be able to see my image that will be streched across the four cells.....do I make sence? I hope so! Thanks though....your getting there
-
Let's try this:
In your style.css file, copy the thumbnails class and give it a unique name, like thumbrandom. Make your background color/image/whatever changes.
In theme.php, in function theme_display_thumbnails, change this
if ($header == '') {
$thumb_cell = template_extract_block($template_thumbnail_view, 'thumb_cell');
$tabs = template_extract_block($template_thumbnail_view, 'tabs');
$header = template_extract_block($template_thumbnail_view, 'header');
$empty_cell = template_extract_block($template_thumbnail_view, 'empty_cell');
$row_separator = template_extract_block($template_thumbnail_view, 'row_separator');
$footer = template_extract_block($template_thumbnail_view, 'footer');
$spacer = template_extract_block($template_thumbnail_view, 'spacer');
}
to this
if ($header == '') {
if ($aid=='random') {
$thumb_cell = template_extract_block($template_thumbnail_view, 'thumb_cell_random');
$empty_cell = template_extract_block($template_thumbnail_view, 'empty_cell_random');
} else {
$thumb_cell = template_extract_block($template_thumbnail_view, 'thumb_cell');
$empty_cell = template_extract_block($template_thumbnail_view, 'empty_cell');
}
$tabs = template_extract_block($template_thumbnail_view, 'tabs');
$header = template_extract_block($template_thumbnail_view, 'header');
//$empty_cell = template_extract_block($template_thumbnail_view, 'empty_cell');
$row_separator = template_extract_block($template_thumbnail_view, 'row_separator');
$footer = template_extract_block($template_thumbnail_view, 'footer');
$spacer = template_extract_block($template_thumbnail_view, 'spacer');
}
Find this:
$template_thumbnail_view = <<<EOT
Underneath, you'll find
<!-- 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"> </td>
<!-- END empty_cell -->
Copy that chunk and paste it underneath the <!-- END empty_cell --> line. Change class="thumbnails" to class="thumbrandom", and add _random to thumb_cell and empty_cell.
See what damage that does. ;)
-
" and add _random to thumb_cell and empty_cell."
Sorry...what do you mean by this last part?
-
thumb_cell_random
empty_cell_random
-
<!-- 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"> </td>
<!-- END empty_cell -->
becomes
<!-- 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"> </td>
<!-- END empty_cell -->
<!-- BEGIN thumb_cell_random -->
<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_random -->
<!-- BEGIN empty_cell_random -->
<td valign="top" class="thumbnails" align="center"> </td>
<!-- END empty_cell_random -->
-
Very good ;D I take my hat off 2 you.....wow! I would have never got that...you know your PHP....good job!
-
Was great with a colo, but now that I put my image I can see where it's applying it not only to the row...but also to the 4 cells which makes it double up.....if I could set those cells to 'transparent' this would be good!
-
I've actually got a much cleaner way of doing this. I'm still tweaking a bit. I don't understand about the image problem. Can you rephrase that?
-
Ok, let's say, just for a minute, you want to undo the changes you've made so far. Let's even say you want to do this again.
Leave the changes to your style.css sheet, but rename the altered maintable class to random and the altered thumbnails class to thumbrandom.
In theme.php, there's a bunch of changes needed.
Find $template_thumbnail_view = <<<EOT
Under it, find
<td valign="top" class="thumbnails" width ="{CELL_WIDTH}" align="center">
replace with
<td valign="top" class="{THUMB_CLASS}" width ="{CELL_WIDTH}" align="center">
under that, find
<td valign="top" class="thumbnails" align="center"> </td>
replace with
<td valign="top" class="{THUMB_CLASS}" align="center"> </td>
In function starttable:
find
function starttable($width = '-1', $title = '', $title_colspan = '1')
replace with
function starttable($width = '-1', $title = '', $title_colspan = '1', $album='')
find
if ($width == '100%') $width = $CONFIG['main_table_width'];
after, add
if ($album == 'random') {
$style = 'random';
} else {
$style = 'maintable';
}
find
<table align="center" width="$width" cellspacing="1" cellpadding="0" class="maintable">
replace with
<table align="center" width="$width" cellspacing="1" cellpadding="0" class="$style">
In function theme_display_thumbnails:
find
$cat_link = is_numeric($aid) ? '' : '&cat=' . $cat;
before, add
if ($aid == 'random') {
$style = 'thumbrandom';
} else {
$style = 'thumbnails';
}
find
starttable('100%', $title, $thumbcols);
replace with
starttable('100%', $title, $thumbcols, $aid);
find
foreach($thumb_list as $thumb) {
$i++;
if ($mode == 'thumb') {
if ($aid == 'lastalb') {
$params = array('{CELL_WIDTH}' => $cell_width,
'{LINK_TGT}' => "thumbnails.php?album={$thumb['aid']}",
'{THUMB}' => $thumb['image'],
'{CAPTION}' => $thumb['caption'],
'{ADMIN_MENU}' => $thumb['admin_menu']
);
} else {
$params = array('{CELL_WIDTH}' => $cell_width,
'{LINK_TGT}' => "displayimage.php?album=$aid$cat_link&pos={$thumb['pos']}",
'{THUMB}' => $thumb['image'],
'{CAPTION}' => $thumb['caption'],
'{ADMIN_MENU}' => $thumb['admin_menu']
);
}
} else {
$params = array('{CELL_WIDTH}' => $cell_width,
'{LINK_TGT}' => "index.php?cat={$thumb['cat']}",
'{THUMB}' => $thumb['image'],
'{CAPTION}' => $thumb['caption'],
'{ADMIN_MENU}' => ''
);
}
echo template_eval($thumb_cell, $params);
if ((($i % $thumbcols) == 0) && ($i < count($thumb_list))) {
echo $row_separator;
}
}
for (;($i % $thumbcols); $i++) {
echo $empty_cell;
}
replace with
foreach($thumb_list as $thumb) {
$i++;
if ($mode == 'thumb') {
if ($aid == 'lastalb') {
$params = array('{THUMB_CLASS}' => $style,
'{CELL_WIDTH}' => $cell_width,
'{LINK_TGT}' => "thumbnails.php?album={$thumb['aid']}",
'{THUMB}' => $thumb['image'],
'{CAPTION}' => $thumb['caption'],
'{ADMIN_MENU}' => $thumb['admin_menu'],
);
} else {
$params = array('{THUMB_CLASS}' => $style,
'{CELL_WIDTH}' => $cell_width,
'{LINK_TGT}' => "displayimage.php?album=$aid$cat_link&pos={$thumb['pos']}",
'{THUMB}' => $thumb['image'],
'{CAPTION}' => $thumb['caption'],
'{ADMIN_MENU}' => $thumb['admin_menu'],
);
}
} else {
$params = array('{THUMB_CLASS}' => $style,
'{CELL_WIDTH}' => $cell_width,
'{LINK_TGT}' => "index.php?cat={$thumb['cat']}",
'{THUMB}' => $thumb['image'],
'{CAPTION}' => $thumb['caption'],
'{ADMIN_MENU}' => ''
);
}
echo template_eval($thumb_cell, $params);
if ((($i % $thumbcols) == 0) && ($i < count($thumb_list))) {
echo $row_separator;
}
}
for (;($i % $thumbcols); $i++) {
$params = array('{THUMB_CLASS}' => $style);
echo template_eval($empty_cell, $params);
}
Same effect, just better coding. Using this system, you could easily change each thumbnail section's style!
This has been tested with 1.3.2 and a copy of the classic theme.
-
About your background image: It's repeating because you are applying it to the table, so it's repeating itself to fill up your table. To center it on your table without repeating:
background-image: url(images/site_logo.png);
background-repeat: no-repeat;
background-position: center center;
A helpful CSS background image link: http://www.w3schools.com/css/css_background.asp
Here's an example of a picture behind the entire table. Make sure your image is at least large enough for 2 rows by 4 columns.
-
keg-o-beer....good job with the code above! But I would love you to show me how I can use this to alter other tables.....such as the tables from the previous post I uploaded http://forum.coppermine-gallery.net/index.php?topic=15943.0 If you can give me a quick tut on how I can use that code to make changes elsewhere that would be grand! Thanks
-
Zip up your theme.php, template.html, and style.css files and post them here.
-
You got it....
-
I made a few changes you might want. If you go to my site (http://pictures.kazebeer.com/coppermine/index.php) you'll see I have the image just under the thumbnails and not under the album title and thumbnails. If you prefer that, I'll post the changes.
I'll look at your theme stuff tonite or tomorrow.
-
So Keg? Are you willing to give up those coding tricks? I really want to know how to do this http://forum.coppermine-gallery.net/index.php?topic=15943.0 (http://forum.coppermine-gallery.net/index.php?topic=15943.0) Just point me in the right direction ;D