[Plugin: Auto ThickBox Plus] only the cover for a gallery ?

I think the easiest way to show only a cover of gallery is using empty link tag that does not contain any texts and tags.

<a href="cover.jpg" rel="gallery-id"><img src="cover-thumb.jpg" alt="Cover" /></a>
<a href="page1.jpg" rel="gallery-id"></a>
<a href="page2.jpg" rel="gallery-id"></a>
<a href="page3.jpg" rel="gallery-id"></a>

If you use [gallery] shortcode, you can hide images other than a cover with the following styles.

<style type="text/css">
 dl.gallery-item { display: none; }
 dl.gallery-item:first-child { display: block; }
</style>
[gallery link="file"]

You may use “columns/size” option to change cover style.
ref. https://codex.www.ads-software.com/Gallery_Shortcode#Options

Note: “:first-child” pseudo-class is supported on IE7 and Firefox3 or later.
ref. https://developer.mozilla.org/en/CSS/%3Afirst-child#Browser_compatibility

Thanks a lot for your answer.

The second solution works well, but leaves blank lines above and under the cover, which don’t appear in html code, i don’t know how delete them ?

For the first one, i don’t understand very well how to use it, like that ?

<img src=”URLOFcover-thumb.jpg” alt=”Cover” />

?

Thanks again for your help

<a href="urlofcover.jpg" rel="gallery id = xxx"><img src="urlofcover-thumb.jpg" alt="Cover" /></a>

?

In first solution, you need to write empty link tags as below. These links are not displayed because they does not have any contents (i.e. texts and tags).

<a href="page1.jpg" rel="gallery-id"></a>
<a href="page2.jpg" rel="gallery-id"></a>
<a href="page3.jpg" rel="gallery-id"></a>

In second solution, add “div.gallery br { display: none; }” style to remove blank lines.

Hello, thanks a lot, it works well, i put this code :

<style type=”text/css”>
dl.gallery-item { display: none; }
dl.gallery-item:first-child { display: block; }
[gallery id="123"]
div.gallery br { display: none; }
.entry-title {display:none;}
</style>

But blank spaces still remains, I don’t know how to limit them :
https://nsa29.casimages.com/img/2012/06/23/120623031509573941.jpg

an idea ?

Where are blank spaces? Are they four (top/bottom/left/right) spaces around the image?

If you want to use larger image, use “size” option.

You may use “columns/size” option to change cover style.
ref. https://codex.www.ads-software.com/Gallery_Shortcode#Options

And you should write [gallery] shortcode on the outside of <style> tag.

I would like to reduce the blank spaces around the image yes, as u can see on the image, but i think i’ve to modify the file style.css of my template in fact (graphene).

I don’t think this is in relation with the plugin ?

I installed Graphene theme. The blank spaces are margin/padding of the image? If so, you can remove the margin/padding with the following styles.

<style type="text/css">
  dl.gallery-item {
    display: none;
    margin: 0 !important;
    width: 150px !important;
  }
  dl.gallery-item:first-child { display: block; }
  dt.gallery-icon { margin-top: 0; }
  img.attachment-thumbnail { margin: 0; }
  div.gallery br { display: none; }
</style>

In my opinion, this is a request on writing CSS if you use “thumbnail” image size.

All the problems have been resolved by exchanging e-mails.