HTML Logo by World Wide Web Consortium (www.w3.org). Click to learn more about our commitment to accessibility and standards.
Proud to be a PHP Open Source CMS
Learn more

> Home » Forum home » Deploying » View topic
Skip navigation

Too much text makes thumbnail description boxes display too tall

Login / Search

[ Join | More ]
 [More]
Posted 23 February 2010, 8:53 PM
#58445
friendly
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.

Prehistorics Illustrated
http://prehistoricsillustrated.com
Another ocPortal powered website &
The Fascinating World of Dinosaurs
& Prehistoric Creatures of all Kinds
Back to the top
 
Posted 24 February 2010, 12:58 PM
#58456
duder911
Avatar

Fan in action

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 27 February 2010, 1:23 AM
#58539
friendly
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…
Prehistorics Illustrated
http://prehistoricsillustrated.com
Another ocPortal powered website &
The Fascinating World of Dinosaurs
& Prehistoric Creatures of all Kinds
Back to the top
 
Posted 27 February 2010, 10:16 AM
#58543
Chris Graham
Avatar

ocStaff (admin)

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.

Expand: Was I helpful? Was I helpful?

Expand: Follow me on Twitter Follow me on Twitter


If I answered something that you think should be in the documentation, please take the initiative and add it to the community documentation. We really need people to help out here and build a well-organised large support resource.
Back to the top
 
Posted 27 February 2010, 7:04 PM
#58550
friendly
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
Prehistorics Illustrated
http://prehistoricsillustrated.com
Another ocPortal powered website &
The Fascinating World of Dinosaurs
& Prehistoric Creatures of all Kinds
Back to the top
 
Posted 01 March 2010, 11:26 AM
#58577
Chris Graham
Avatar

ocStaff (admin)

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.

Expand: Was I helpful? Was I helpful?

Expand: Follow me on Twitter Follow me on Twitter


If I answered something that you think should be in the documentation, please take the initiative and add it to the community documentation. We really need people to help out here and build a well-organised large support resource.
Back to the top
 
Posted 02 March 2010, 5:42 PM
#58614
friendly
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!
Prehistorics Illustrated
http://prehistoricsillustrated.com
Another ocPortal powered website &
The Fascinating World of Dinosaurs
& Prehistoric Creatures of all Kinds
Back to the top
 
Posted 02 March 2010, 6:31 PM
#58618
Chris Graham
Avatar

ocStaff (admin)

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.

Expand: Was I helpful? Was I helpful?

Expand: Follow me on Twitter Follow me on Twitter


If I answered something that you think should be in the documentation, please take the initiative and add it to the community documentation. We really need people to help out here and build a well-organised large support resource.
Back to the top
 
Posted 02 March 2010, 10:27 PM
#58630
friendly
Avatar

Community saint

Makes it even easier without the surround tags. Thanks for the correction.
Prehistorics Illustrated
http://prehistoricsillustrated.com
Another ocPortal powered website &
The Fascinating World of Dinosaurs
& Prehistoric Creatures of all Kinds
Back to the top
 
Posted 26 October 2010, 9:57 AM
#64079
friendly
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.
Prehistorics Illustrated
http://prehistoricsillustrated.com
Another ocPortal powered website &
The Fascinating World of Dinosaurs
& Prehistoric Creatures of all Kinds
Back to the top
 
Posted 29 October 2010, 3:05 AM
#64174
friendly
Avatar

Community saint

...Anyone?
Prehistorics Illustrated
http://prehistoricsillustrated.com
Another ocPortal powered website &
The Fascinating World of Dinosaurs
& Prehistoric Creatures of all Kinds
Back to the top
 
Posted 29 October 2010, 5:21 PM
#64202
Chris Graham
Avatar

ocStaff (admin)

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.

Expand: Was I helpful? Was I helpful?

Expand: Follow me on Twitter Follow me on Twitter


If I answered something that you think should be in the documentation, please take the initiative and add it to the community documentation. We really need people to help out here and build a well-organised large support resource.
Back to the top
 
1 guests and 0 members have just viewed this: None
Control functions:
 Add topic 
> Forum home » Deploying

Quick reply   Contract
Your name:
Your message:
( First post )




   

Back to the top ocPortal.com  Keyboard shortcuts
 
Copyright © ocProducts Ltd, 2011
Privacy · Feedback · Web Hosting Services provided by eLief