Gallery Description formatting

Comments

• Options

  Allen Registered Users Posts: 10,011 Major grins

  March 19, 2014 edited March 19, 2014

  geohsia wrote: »

  Hi,
  Does anyone know if there is an easy way to format the Gallery Description? I like the way it is laid out:
  
  http://geohsia.smugmug.com/Website/Photo-Essays/Lizboa/
  
  The only issue is that because I have a background the text is not easy to see. I wan to create a text box similar to what I have in my About:
  
  http://geohsia.smugmug.com/About
  
  What I would want to do though is wrap around both the Gallery Title and the Description. If it's just the Description that's fine as I can add the title in manually using HTML.
  
  Is there an easy way to set the framing around the Gallery description without having to stuff a bunch of HTML into the Gallery description?
  
  I am trying to set up a system so that in future galleries I can just add the description and it gets formatted properly. I am trying to avoid moving around too much text. I'm not much of a programmer and I know I'll forget how to do it in a few weeks. Thanks!

  This gets a quick background. Add to "all galleries" CSS.

  .sm-gallery-description {
     background: rgba(12, 126, 173, .30);
     padding: 12px; /* spacing from edges */
  }
  

  Might also add color for text so it can be seen.
  color:#999;

  Al - Just a volunteer here having fun
  My Website index | My Blog

  0
• Options

  geohsia Registered Users Posts: 31 Big grins

  March 19, 2014 edited March 19, 2014

  Hi Allen,
  Thanks! Works great. A few questions to follow-up:
  
  a) How do I include the Gallery Title? I tried .sm-gallery-title but that didn't work. How do I find out what CSS object (not sure if this is the right term) the Title content block is?
  b) How do I add a border / rounded edges?
  
  Thanks!

  0
• Options

  Allen Registered Users Posts: 10,011 Major grins

  March 19, 2014 edited March 19, 2014

  geohsia wrote: »

  Hi Allen,
  Thanks! Works great. A few questions to follow-up:
  
  a) How do I include the Gallery Title? I tried .sm-gallery-title but that didn't work. How do I find out what CSS object (not sure if this is the right term) the Title content block is?
  b) How do I add a border / rounded edges?
  
  Thanks!

  Start with this and tweak from here.

  .sm-gallery-description {
  background:rgba(28,28,28,.80);
  padding:12px;
  border: 4px solid #292929;
  border-radius: 18px;
  }
  
  .sm-page-title {
  background:rgba(28,28,28,.80);
  border-radius: 18px;
  border: 4px solid #292929;
  padding: 0 10px;
  }
  

  Al - Just a volunteer here having fun
  My Website index | My Blog

  0
• Options

  geohsia Registered Users Posts: 31 Big grins

  March 19, 2014 edited March 19, 2014

  Thanks again Allen. Sorry, last question. Is there a way to wrap the title / description into the same box? Or somehow drop the title into the description?

  0
• Options

  Allen Registered Users Posts: 10,011 Major grins

  March 19, 2014 edited March 19, 2014

  geohsia wrote: »

  Thanks again Allen. Sorry, last question. Is there a way to wrap the title / description into the same box? Or somehow drop the title into the description?

  Looks like if you set a % width they stay equal stretching the browser back and forth. Did this real
  quick so not sure if it really works.

  .sm-gallery-description {
  background:rgba(28,28,28,.80);
  padding:12px;
  border: 4px solid #292929;
  border-radius: 18px;
  [COLOR=Red]width:74%;[/COLOR]
  }
  
  .sm-page-title {
  background:rgba(28,28,28,.80);
  border-radius: 18px;
  border: 4px solid #292929;
  padding: 0 10px;
  [COLOR=Red]width:74%;[/COLOR]
  }
  

  Al - Just a volunteer here having fun
  My Website index | My Blog

  0
• Options

  geohsia Registered Users Posts: 31 Big grins

  March 19, 2014 edited March 19, 2014

  Hi Allen,
  Thanks. I am trying to avoid two text boxes. I think I'll just type the name manually into the description manually. I jsut need to figure out how to give it the "Heading" format. Thanks for your help

  0