Gallery Title line break

psenior1

I'm trying to create a SM page based blog, I'm getting there but can't work out how to split the gallery title over two (or even 3) lines.

For example - http://www.snrmac.com/Blog/Farnham-Wedding-Photographer, Ideally I'd like the couples name as the first line with the venue date underneath, both centered. I've tried using <br> tags but they just get removed.

Help! Thanks....

ChancyRat

What happens if you add the additional text, using a comma or a dash?
I believe recent code changes now will push and show text over more than one line. I added code to make this behavior happen before the SM behavior code change, so I'm not sure if you will just get the result you want, or if you'll have to add CSS to nudge it along.

psenior1

ChancyRat wrote: »

What happens if you add the additional text, using a comma or a dash?
I believe recent code changes now will push and show text over more than one line. I added code to make this behavior happen before the SM behavior code change, so I'm not sure if you will just get the result you want, or if you'll have to add CSS to nudge it along.

It does wrap the text over the two lines, with just the last word or two on the second line, depending on browser size.

ChancyRat

That's good, at least. I tested to add
in a gallery title, and SM stripped it out, so I'm assuming HTML isn't allowed in gallery titles. I'm at a loss as to whether what you want is achievable, so I'm interested to hear others.

Jtring

psenior1 wrote: »

I'm trying to create a SM page based blog, I'm getting there but can't work out how to split the gallery title over two (or even 3) lines.

For example - http://www.snrmac.com/Blog/Farnham-Wedding-Photographer, Ideally I'd like the couples name as the first line with the venue date underneath, both centered. I've tried using <br> tags but they just get removed.

One trick that I've used is to insert non-breaking spaces (ALT-0160 on a PC) to force words to stay together. Non-breaking spaces don't get stripped. Inserting them means the line wraps have occur only at the normal spaces. For example, on the first gallery title on the page you linked, you could have non-breaking spaces inside "Nicky and Richard", then have a normal space, and then put non-breaking spaces inside "7 February 2016" (or whatever).

Just think hard about what things will look like on variously sized screens (or mobile). Odd things can happen if the blocks with non-braking spaces exceed the room available. It's also possible to generate some choppy line breaks. Screenfly (quirktools.com/screenfly/) has been recommended around here as a means to check such things out.

To see my non-breaking spaces in action, take a look at my main browse page (which is actually more like a portfolio page since it's one step down in the database hierarchy): http://jtringl.smugmug.com/Browser. (Note the extra "r". "Browser" is a folder.) You will see that for the first four sub-folders, "Hiking the Wilds:" is on the first line, then something else follows. With some screen sizes, everything fits on one line. With most screen sizes, the line break always occurs after the colon even though there might be space for one or two of the words from the second group.

psenior1

Jtring wrote: »

One trick that I've used is to insert non-breaking spaces (ALT-0160 on a PC) to force words to stay together. Non-breaking spaces don't get stripped. Inserting them means the line wraps have occur only at the normal spaces. For example, on the first gallery title on the page you linked, you could have non-breaking spaces inside "Nicky and Richard", then have a normal space, and then put non-breaking spaces inside "7 February 2016" (or whatever).

Just think hard about what things will look like on variously sized screens (or mobile). Odd things can happen if the blocks with non-braking spaces exceed the room available. It's also possible to generate some choppy line breaks. Screenfly (quirktools.com/screenfly/) has been recommended around here as a means to check such things out.

To see my non-breaking spaces in action, take a look at my main browse page (which is actually more like a portfolio page since it's one step down in the database hierarchy): http://jtringl.smugmug.com/Browser. (Note the extra "r". "Browser" is a folder.) You will see that for the first four sub-folders, "Hiking the Wilds:" is on the first line, then something else follows. With some screen sizes, everything fits on one line. With most screen sizes, the line break always occurs after the colon even though there might be space for one or two of the words from the second group.

Thanks for the detailed reply and help. That works well on most devices (thanks for the screenfly tip), on some phones (Galaxy S5 and older iPhones) it tends to place the text on one line still. If there's not enough space it just substitutes some of the characters for '....' which is fine.

If its not possible to code something then this is the way I'll go, thanks again

For those with mac's - non-breaking spaces are done with opt+space