the thumbnails have class image just like the images from display media
can I apply another class to the thumbnails?
I did not found class image in thumbnails.php or in theme_display_thumbnails to replace it with my new class
thanks
Open include/functions.inc.php, find
$thumb_list[$i]['image'] = '<img src="' . $pic_url . '" class="image" ' . $image_size['geom'] . ' border="0" alt="' . $row['filename'] . '" title="' . $pic_title . '" />';
and replace the class to your needs.
It's probably a good idea for the next Coppermine release to add an additional class (e.g. "thumbnail") to the thumbnails.
thanks.worked
Added CSS class "thumbnail" to thumbnail images on thumbnails.php pages in SVN revision 8618.
Hello André,
I suppose that this change also requires making a change in the index.php file
this one twice:
$user_thumb = "<img src=\"" . $pic_url . "\" class=\"image\" {$image_size['geom']} border=\"0\" alt=\"\" />";
$user_thumb = '<img src="' . $cpg_nopic_data['thumb'] . '" ' . $cpg_nopic_data['whole'] . ' class="image" border="0" alt="" />';
twice:
$alb_list[$alb_idx]['thumb_pic'] = "<img src=\"" . $pic_url . "\" class=\"image\" {$image_size['geom']} border=\"0\" alt=\"{$picture['filename']}\" />";
$alb_list[$alb_idx]['thumb_pic'] = '<img src="' . $cpg_nopic_data['thumb'] . '" ' . $cpg_nopic_data['whole'] . ' class="image" border="0" alt="" />';
$alb_list[$alb_idx]['thumb_pic'] = '<img src="' . $cpg_privatepic_data['thumb'] . '" ' . $cpg_privatepic_data['whole'] . ' class="image" border="0" alt="" />';
Regards.
Quote from: Αndré on September 20, 2013, 03:00:14 PM
Open include/functions.inc.php, find
$thumb_list[$i]['image'] = '<img src="' . $pic_url . '" class="image" ' . $image_size['geom'] . ' border="0" alt="' . $row['filename'] . '" title="' . $pic_title . '" />';
and replace the class to your needs.
It's probably a good idea for the next Coppermine release to add an additional class (e.g. "thumbnail") to the thumbnails.
I found a simple way to add diffrent style to thumbnails without editing coppermine files:
all images (thumbnails and intermediate pictures) have the same class: .image but they are in tables,tr,td or divs with diffrent css class.
In the curve theme the classes for .image are:
.image {
border-style:solid;
border-width:1px;
border-color:#000000;
margin:2px;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
border-radius: 5px;
}
/* pseudo-classes for image links */
a:link .image{
border-style:solid;
border-width:1px;
border-color:#000000;
margin:2px;
}
a:visited .image{
border-style:solid;
border-width:1px;
border-color:#840084;
margin:2px;
}
a:focus .image{
border-style:solid;
border-width:1px;
border-color:#000000;
margin:2px;
}
a:hover .image{
border-style:solid;
border-width:1px;
border-color:#0033CC;
margin:2px;
}
a:active .image{
border-style:solid;
border-width:1px;
border-color:#000000;
margin:2px;
}
because the thumbnails images are in a tr with class .thumbnails you can override the image class like this:
add to style.css:
.thumbnails .image{
border:none;
margin:2px;
-moz-border-radius: 0px;
-webkit-border-radius: 0px;
border-radius: 0px;
}
.thumbnails a:link .image{
border:none;
margin:2px;
}
.thumbnails a:visited .image{
border:none;
margin:2px;
}
.thumbnails a:focus .image{
border:none;
margin:2px;
}
.thumbnails a:hover .image{
border:5px solid #cccccc;
margin:2px;
}
.thumbnails a:active .image{
border:none;
margin:2px;
}
you can add your custom styles to code above like background,opacity,border etc .
to override the image class for intermediate pictures:
.display_media .image{
border-style:solid;
border-width:5px;
border-color:#444444;
border-radius: 0px;
}
.display_media a:link .image{
border-style:solid;
border-width:5px;
border-color:#444444;
margin:2px;
}
.display_media a:visited .image{
border-style:solid;
border-width:5px;
border-color:#444444;
margin:2px;
}
.display_media a:focus .image{
border-style:solid;
border-width:5px;
border-color:#444444;
margin:2px;
}
.display_media a:hover .image{
border-style:solid;
border-width:5px;
border-color:#900;
margin:2px;
}
.display_media a:active .image{
border-style:solid;
border-width:5px;
border-color:#444444;
margin:2px;
}
bacuse the intermediate pictures has the class .image and is inside a td with class .display_media
to override the image class for category:
.catrow .image{
border:none;
margin:2px;
-moz-border-radius: 0px;
-webkit-border-radius: 0px;
border-radius: 0px;
}
.catrow a:link .image{
border:none;
margin:2px;
}
.catrow a:visited .image{
border-style:solid;
border-width:1px;
border-color:#840084;
margin:2px;
}
.catrow a:focus .image{
border-style:solid;
border-width:1px;
border-color:#000000;
margin:2px;
}
.catrow a:hover .image{
border-style:solid;
border-width:1px;
border-color:#0033CC;
margin:2px;
}
.catrow a:active .image{
border-style:solid;
border-width:1px;
border-color:#000000;
margin:2px;
}
the class for empty category is .catrow_noalb.
an empty category has no thumbnail but you can add thumbnail image with bbcode in the category description:
[img]http://www.allvip.us/cpg/z/themes/zimbio/imgs_cat/beyonce.jpg[/img]
and style it like this:
.catrow_noalb img{
border:1px dotted red;
}
to override the image class for albums thumbnails:
.tableb_alternate .thumbnails .image{
border:10px solid #000000;
margin:2px;
-moz-border-radius: 2px;
-webkit-border-radius: 2px;
border-radius: 2px;
}
.tableb_alternate .thumbnails a:link .image{
border:10px solid #000000;
margin:2px;
}
.tableb_alternate .thumbnails a:visited .image{
border:10px solid #000000;
margin:2px;
}
.tableb tableb_alternate .thumbnails a:focus .image{
border:10px solid #000000;
margin:2px;
}
.tableb_alternate .thumbnails a:hover .image{
border:10px solid #000000;
margin:2px;
}
.tableb_alternate .thumbnails a:active .image{
border:10px solid #000000;
margin:2px;
}
because the images for the albums thumbnails are in a td with class .thumbnails and the td is in a tr with class .tableb_alternate.
Quote from: Niecher on November 05, 2013, 10:56:09 PM
I suppose that this change also requires making a change in the index.php file
Added CSS class "thumbnail" to album thumbnails in SVN revision 8619.