HTML Logo by World Wide Web Consortium (www.w3.org). Click to learn more about our commitment to accessibility and standards.

Moving forward with Composr

ocPortal has been relaunched as Composr CMS, which is now in beta. ocPortal 9 will be superseded by Composr 10.

Head over to compo.sr for our new site, and to our migration roadmap. Existing ocPortal member accounts have been mirrored.


Too much text makes thumbnail description boxes display too tall

Login / Search

 [ Join | More ]
 Add topic 
Posted
Rating:
#58445 (In Topic #12741)
Avatar

Community saint

I need an option to choose what part of the description to display on the thumbnail page

My question is about the description boxes in the galleries. It's a great feature for use in describing the images displayed with the added benefit that these comments also show up when you mouse over the thumbnails. I have used the box to also contain an extended copyright notice which shows up in both places.

My predicament is that I would like to say more about the images but I find what I add to the full image description box also shows up on the thumbnail but in a BIG TALL box so that if there is a lot of text included it will extend way above the top of the page where it is not readable and you cannot scroll or usefully control the text in the box.

I am wondering if there is some way to make a tag or something that would select only the text you want to show up on the thumbnail while excluding other text not selected - or a vice-versa scenario.

This would allow the descriptions to be greatly expanded, if desired, and make it an even more versatile tool for the View Image page. Any ideas how to do this?

I am also interested in adding the titles under the thumbnails as visible page text also.



Art and Imagination
of David L Friend

http://davidlfriend.com

  My Art Gallery
powered by ocPortal
Back to the top
 
Posted
Rating:
#58456
Avatar

Well-settled

One way would be via CSS. The GALLERY_REGULAR_MODE_SCREEN template has:

Code

{+START,IF_NON_EMPTY,{DESCRIPTION}}
   {+START,BOX}
      {DESCRIPTION}
   {+END}
   <br />
{+END}
which could change to…

Code

{+START,IF_NON_EMPTY,{DESCRIPTION}}
   {+START,BOX}
      <div class="full_description_shows">{DESCRIPTION}</div>
   {+END}
   <br />
{+END}

Then in your CSS you could add:

Code

.full_description {
   display: none; /* Makes .full_description invisible */
}

.full_description_shows .full_description {
   display: block !important; /* Overrides .full_description to be visible, for anything under .full_description_shows */
}

Then in your Comcode you could do like:

Code

Blah blah blah this always shows.
[surround="full_description"]
This bit only shows on the gallery screen.
[/surround]
Back to the top
 
Posted
Rating:
#58539
Avatar

Community saint

Thanks Duder911 for the idea. So far I haven't been able to get it to work.

I modified the GALLERY_REGULAR_MODE_SCREEN template as suggested, added the CSS code to galleries.css (tried it in global.css too - no difference) and added the surround tag in the description box of the page I was testing it out on. Then cleared caches but nothing. I'm sure I'm missing something.

any clue…


Art and Imagination
of David L Friend

http://davidlfriend.com

  My Art Gallery
powered by ocPortal
Back to the top
 
Posted
Rating:
#58543
Avatar

Hi,

Personally if I was debugging this I would do as follows…

  1. Use Firebug's inspect tool on the description.
  2. Verify that <div class="full_description"> is there in the HTML higher in the HTML tree.
  3. Click on that HTML node and verify the display:none style is shown by it; it should be there on both…
  4. but crossed out on the full gallery view
  5. Verify that <div class="full_description_shows"> is there in the HTML higher in the HTML tree, on the full gallery view only.

The results of these tests should give clues.


Become a fan of ocPortal on Facebook or add me as a friend. Add me on on Twitter.
Was I helpful?
  • If not, please let us know how we can do better (please try and propose any bigger ideas in such a way that they are fundable and scalable).
  • If so, please let others know about ocPortal whenever you see the opportunity.
  • If my reply is too Vulcan or expressed too much in business-strategy terms, and not particularly personal, I apologise. As a company & project maintainer, time is very limited to me, so usually when I write a reply I try and make it generic advice to all readers. I'm also naturally a joined-up thinker, so I always express my thoughts in combined business and technical terms. I recognise not everyone likes that, don't let my Vulcan-thinking stop you enjoying ocPortal on fun personal projects.
  • If my response can inspire a community tutorial, that's a great way of giving back to the project as a user.
Back to the top
 
Posted
Rating:
#58550
Avatar

Community saint

friendly said

Then cleared caches but nothing.
"nothing" isn't quite acurate - more like results not as expected. The "Blah blah blah this always shows." part, indeed does show up on the thumnails box and the view image description. But the text which is supposed to be seen only on the view image page remains unseen.

Chris Graham said

2.Verify that <div class="full_description"> is there in the HTML higher in the HTML tree.
When the view image page description box is inspected with firebug the "<div class="full_description">" shows up but this;"<div class="full_description">This bit only shows on the gallery screen. </div>" shows up in paler type, see screen shot. On the thumbnail page you can see the inspection screenshot here

Chris Grahm said

none style is shown by it
I cannot see any reference to this


Art and Imagination
of David L Friend

http://davidlfriend.com

  My Art Gallery
powered by ocPortal
Back to the top
 
Posted
Rating:
#58577
Avatar

Hi,

I can see dude911 made a couple of mistakes.

1) The first change he said would have needed doing on GALLERY_FLOW_MODE_SCREEN.tpl also.

2) Actually he misunderstood a bit. He thought you were trying to apply this to gallery descriptions, so links to galleries showed less details than you see within the galleries. I think you're actually trying to apply to image/video descriptions, so links to images/videos show less details than what you see within the galleries.

Actually all you need is to use Comcode like this…

Code

Blah blah blah this always shows.
{+START,IF,{$OR,{$MATCH_KEY_MATCH,_WILD:galleries:image},{$MATCH_KEY_MATCH,_WILD:galleries:video}}}
This bit only shows on the image/video screens.
{+END}
[/surround]
(untested)


Become a fan of ocPortal on Facebook or add me as a friend. Add me on on Twitter.
Was I helpful?
  • If not, please let us know how we can do better (please try and propose any bigger ideas in such a way that they are fundable and scalable).
  • If so, please let others know about ocPortal whenever you see the opportunity.
  • If my reply is too Vulcan or expressed too much in business-strategy terms, and not particularly personal, I apologise. As a company & project maintainer, time is very limited to me, so usually when I write a reply I try and make it generic advice to all readers. I'm also naturally a joined-up thinker, so I always express my thoughts in combined business and technical terms. I recognise not everyone likes that, don't let my Vulcan-thinking stop you enjoying ocPortal on fun personal projects.
  • If my response can inspire a community tutorial, that's a great way of giving back to the project as a user.
Back to the top
 
Posted
Rating:
#58614
Avatar

Community saint

This works. I tested this and you can select what you want to show and what you want hidden on the thumbnail display as proposed and discussed before. I am calling it the SELECTIVE TEXT tag

I did have to include the |surround| opening tag. It is added at the beginning of the "Blah blah blah…" part.

Thanks Duder911 for the getting us started and to Chris Graham for getting the meat of the code to work and polishing it off. So cool, ocPortal is getting better every day.

Astounding and well done!


Art and Imagination
of David L Friend

http://davidlfriend.com

  My Art Gallery
powered by ocPortal
Back to the top
 
Posted
Rating:
#58618
Avatar

Whoops, in my post I accidentally left [/surround] in there. If you remove that, the opening tag for surround is not needed either.


Become a fan of ocPortal on Facebook or add me as a friend. Add me on on Twitter.
Was I helpful?
  • If not, please let us know how we can do better (please try and propose any bigger ideas in such a way that they are fundable and scalable).
  • If so, please let others know about ocPortal whenever you see the opportunity.
  • If my reply is too Vulcan or expressed too much in business-strategy terms, and not particularly personal, I apologise. As a company & project maintainer, time is very limited to me, so usually when I write a reply I try and make it generic advice to all readers. I'm also naturally a joined-up thinker, so I always express my thoughts in combined business and technical terms. I recognise not everyone likes that, don't let my Vulcan-thinking stop you enjoying ocPortal on fun personal projects.
  • If my response can inspire a community tutorial, that's a great way of giving back to the project as a user.
Back to the top
 
Posted
Rating:
#58630
Avatar

Community saint

Makes it even easier without the surround tags. Thanks for the correction.


Art and Imagination
of David L Friend

http://davidlfriend.com

  My Art Gallery
powered by ocPortal
Back to the top
 
Posted
Rating:
#64079
Avatar

Community saint

I have been re-reading this topic and I am not sure I did as I was directed back then. I was given a snazzy piece of code to mask certain parts of description text from showing on the description box that displays when you mouseover the thumbnails.

I have been using this on each description box on each page where I felt I needed this function but as I re-read the posts here I am thinking I should modify the GALLERY_REGULAR_MODE_SCREEN.TPL and use a CSS tag in the description box. Perhaps one of you code-jockeys can better enlighten me as to a more excellent way than the (clumbsy) way I have been doing it.

This is the code I have been using

Code

ANY TEXT YOU WANT TO SHOW IS HERE OR YOU CAN PUT IT AFTER THE END TAG{+START,IF,{$OR,{$MATCH_KEY_MATCH,_WILD:galleries:image},{$MATCH_KEY_MATCH,_WILD:galleries:video}}} HIDDEN TEXT IS PUT HERE {+END}
I went back to this topic after I noticed a couple of new GALLERIES.CSS tags ".full_description" and ".full_description_shows .full_description" - I can see that the ".full_description" removes visibility from the description box itself as well as the thumbnail box - I guess it is kind of a way of commenting out certain text.

I am just looking to streamline the process of placing comments for images without making the thumbnail description box huge - BTW on my site the thumbnail description length has been lengthened from the default.


Art and Imagination
of David L Friend

http://davidlfriend.com

  My Art Gallery
powered by ocPortal
Back to the top
 
Posted
Rating:
#64174
Avatar

Community saint

...Anyone?


Art and Imagination
of David L Friend

http://davidlfriend.com

  My Art Gallery
powered by ocPortal
Back to the top
 
Posted
Rating:
#64202
Avatar

I think you could add a Custom Comcode tag with this as the replacement text:

Code

{+START,IF,{$OR,{$MATCH_KEY_MATCH,_WILD:galleries:image},{$MATCH_KEY_MATCH,_WILD:galleries:video}}} {content}{+END}
And then just use that tag. No tag parameters needed.

That's basically exactly what you just said, put through the lens of a Custom Comcode tag.


Become a fan of ocPortal on Facebook or add me as a friend. Add me on on Twitter.
Was I helpful?
  • If not, please let us know how we can do better (please try and propose any bigger ideas in such a way that they are fundable and scalable).
  • If so, please let others know about ocPortal whenever you see the opportunity.
  • If my reply is too Vulcan or expressed too much in business-strategy terms, and not particularly personal, I apologise. As a company & project maintainer, time is very limited to me, so usually when I write a reply I try and make it generic advice to all readers. I'm also naturally a joined-up thinker, so I always express my thoughts in combined business and technical terms. I recognise not everyone likes that, don't let my Vulcan-thinking stop you enjoying ocPortal on fun personal projects.
  • If my response can inspire a community tutorial, that's a great way of giving back to the project as a user.
Back to the top
 
1 guests and 0 members have just viewed this: None
Control functions:

Quick reply   Contract

Your name:
Your message: