Search…

X3 Photo Gallery Support Forums

Search…
 
User avatar
JMM
Experienced
Topic Author
Posts: 154
Joined: 02 Aug 2021, 11:18

Is it possible to force line-breaks in Titles?

17 Feb 2022, 05:30

If possible, I would like to force line-breaks in Settings | Page | Title

If you look at THIS page, I would like to force line-breaks so that Canadian Armed Forces is on one line, followed my the model on the 2nd line.

If that possible?

Thanks in advance.

John
Location: Burlington (Toronto-ish), Ontario, Canada
Self-hosted using Abyss Web Server:   AuroraWings.me   |   GalleryWings.com   |   PanAurora-Studio.com   |
Externally-hosted using LiteSpeed/Apache Web Server:   GenealogyWings.com/galleries   |
 
User avatar
mjau-mjau
X3 Wizard
Posts: 13993
Joined: 30 Sep 2006, 03:37

Re: Is it possible to force line-breaks in Titles?

17 Feb 2022, 22:00

You can use basic html formatting in titles. For line-breaks, you can use <br>:
Code
Canadian Armed Forces<br>CF-104D Starfighter
 
User avatar
JMM
Experienced
Topic Author
Posts: 154
Joined: 02 Aug 2021, 11:18

Re: Is it possible to force line-breaks in Titles?

18 Feb 2022, 22:03

Nope, still not working.  It's doing the same thing that it was doing before I posted this question.

When I use the <br> or even <br />, all it does is display 
Canadian Armed ForcesCF-104D Starfighter
...with no space between Forces & CF-104D.  For some reason, X3 is not interpreting the <br> in Settings | Page | Title
Location: Burlington (Toronto-ish), Ontario, Canada
Self-hosted using Abyss Web Server:   AuroraWings.me   |   GalleryWings.com   |   PanAurora-Studio.com   |
Externally-hosted using LiteSpeed/Apache Web Server:   GenealogyWings.com/galleries   |
 
User avatar
mjau-mjau
X3 Wizard
Posts: 13993
Joined: 30 Sep 2006, 03:37

Re: Is it possible to force line-breaks in Titles?

19 Feb 2022, 01:27

JMM wrote: Nope, still not working.  It's doing the same thing that it was doing before I posted this question.
Do you have a link to the exact location of image and title please? When you say "Settings | Page | Title" that's just a page title, but I assume we speak of images. Image titles display in different locations (layout, popup), and may display differently depending.
 
User avatar
JMM
Experienced
Topic Author
Posts: 154
Joined: 02 Aug 2021, 11:18

Re: Is it possible to force line-breaks in Titles?

19 Feb 2022, 01:55

It's the same page as in the original post, but HERE it is again.

Below is the page where I am trying to force the line-break on, in the Title field.
Image
Location: Burlington (Toronto-ish), Ontario, Canada
Self-hosted using Abyss Web Server:   AuroraWings.me   |   GalleryWings.com   |   PanAurora-Studio.com   |
Externally-hosted using LiteSpeed/Apache Web Server:   GenealogyWings.com/galleries   |
 
User avatar
mjau-mjau
X3 Wizard
Posts: 13993
Joined: 30 Sep 2006, 03:37

Re: Is it possible to force line-breaks in Titles?

19 Feb 2022, 02:16

You are right. I see now <br> tags aren't actually supported in titles, only rich text formatting options like (bold, italic, colors etc). The reason for this, is because it's really just a TITLE, and strying to structure the title from within the title itself, is not really productive and could break layout. For example, on really small screens, it might output then like this, with automatic wrapping (required of course), and then adding your own artificial line breaks:
Code
Canadian Armed
Forces
CF-104D Starfighter
Besides, there is a reason there exists both TITLE, LABEL and DESCRIPTION, so that these combined to create and output. In your case, you are technically trying to separate TITLE into two elements.

Anyway, it can be hacked like this: 1. Go to Settings > Custom > Custom CSS, and add this:
Code
.mybreak {
  display: block;
}
2. Then in your title, you can do this:
Code
Canadian Armed Forces<span class="mybreak">CF-104D Starfighter</span>
 
User avatar
JMM
Experienced
Topic Author
Posts: 154
Joined: 02 Aug 2021, 11:18

Re: Is it possible to force line-breaks in Titles?

19 Feb 2022, 02:41

Perfect... works like a charm, sir.  <small> also works, I discovered.

Thank you, Karl.
Location: Burlington (Toronto-ish), Ontario, Canada
Self-hosted using Abyss Web Server:   AuroraWings.me   |   GalleryWings.com   |   PanAurora-Studio.com   |
Externally-hosted using LiteSpeed/Apache Web Server:   GenealogyWings.com/galleries   |
 
User avatar
JMM
Experienced
Topic Author
Posts: 154
Joined: 02 Aug 2021, 11:18

Re: Is it possible to force line-breaks in Titles?

08 Feb 2023, 06:25

Good day, Karl,

About a year ago, you gave me the following custom code to force line-breaks in titles, which I've been using successfully on some of my folders, and it's been working perfectly:
Code
.mybreak {
  display: block;
}
On THIS page, I can combine a line of text, followed by a line-break, followed by a label with a URL, and that works perfectly (all except the 1st picture).  The code that I use for the above is:
Code
Line-1[size=100]<span class="mybreak">[/size][size=100]<span class="label" style="background-color:#696969;color:#DCDCDC">[/size][size=100]<a href="URL" target="_blank"><span style='color:cyan;'>label_text <i class="fa fa-external-link-square"></i></a></span>[/size]
But recently I've been trying to force 2 line-breaks in the same title, along with a label with a URL, but it's not working out, as you can see above the 1st picture in the above link.

I've tried different combinations of:
Code
Line-1<span class="mybreak">Line-2<span class="mybreak"><span class="label" style="background-color:#696969;color:#DCDCDC"><a href="URL" target="_blank"><span style='color:cyan;'>label_text <i class="fa fa-external-link-square"></i></a></span>
Or is it that X3 can only handle 1 single <span class="mybreak"> per title?

Thanks in advance, and have yourself a good evening.
Location: Burlington (Toronto-ish), Ontario, Canada
Self-hosted using Abyss Web Server:   AuroraWings.me   |   GalleryWings.com   |   PanAurora-Studio.com   |
Externally-hosted using LiteSpeed/Apache Web Server:   GenealogyWings.com/galleries   |
 
User avatar
mjau-mjau
X3 Wizard
Posts: 13993
Joined: 30 Sep 2006, 03:37

Re: Is it possible to force line-breaks in Titles?

08 Feb 2023, 20:48

I am looking at your two codes. First of all, you need to be very careful about opening <span> and closing </span> tags. There needs to be the exact amount of opening tags as closing tags, and any inner nested tags need to be opened and closed inside the current open tag. In your examples, you haven't closed your <span> tags properly, and one of your <a> links has an opening <span> tag inside, and a closing </span> outside. This will cause the browser to modify the html automatically. PS! You might be confusing <span> with <br>, which is one of the few tags which can be placed alone without </br> closing tag.
  • Also, please try your entries without using <a>. Gallery layouts are already  made up of outer <a> anchor links (because each gallery item is clickable), and browsers don't allow nested links <a><a> and will adjust the html appropriately.
  • Were you aware that descriptions can contain <br> tag? The title is meant to be short and concise, whereas description can contain additional tags including line breaks. Why not use description for extensive info like in your case? Or combine with title? This is what the description is meant for.
  • If you want to use <span></span> that should work, but I think you have toms interfering issues as noted above. Essentially, each <span class="mybreak">...</span> goes onto a separate line, it's that simple. But you need to open/close each tag, and add the line-specific content INSIDE. Of course, the content of each <span> could wrap onto multiple lines, but it will never share the same line with other <span> tags.
 
User avatar
JMM
Experienced
Topic Author
Posts: 154
Joined: 02 Aug 2021, 11:18

Re: Is it possible to force line-breaks in Titles?

09 Feb 2023, 01:05

In your examples, you haven't closed your <span> tags properly, and one of your <a> links has an opening <span> tag inside, and a closing </span> outside.
That's what happens after 29 hours straight, sitting here working on this site  :stuck_out_tongue_closed_eyes:.

The title is meant to be short and concise, whereas description can contain additional tags including line breaks. Why not use description for extensive info like in your case? Or combine with title? This is what the description is meant for.
I already have data in my Descriptions which is different than what is displayed on the pages containing the Previews.  Until X4 is released in the coming months/years & which will hopefully have tags with search capabilities, until then I need to include information on the pages containing the Previews that visitors can see on those Preview pages, without them having to instead click on each image to see if those are the people that they're looking for  :thinking:.

There needs to be the exact amount of opening tags as closing tags, and any inner nested tags need to be opened and closed inside the current open tag.
On this SAME page, I have added 3 test images, for illustration-purposes (the first 3 images).

Essentially, each <span class="mybreak">...</span> goes onto a separate line, it's that simple. But you need to open/close each tag, and add the line-specific content INSIDE. Of course, the content of each <span> could wrap onto multiple lines, but it will never share the same line with other <span> tags.

For the 1st image, I have 2 lines in the title (with a single mybreak), and as you can see, the 2 lines display properly, even though I have a <span> within a <span>.  That code is:
Code
<small><small><small><small>
     <b>
          This is line 1 in the title
     </b>
     <span class="mybreak">
          <span class="label" style="background-color:#696969;color:#DCDCDC">
               This is line 2 in the title
          </span>
     </span>
</small></small></small></small>
For the 2nd image, I have 3 lines in the title (with 2 mybreaks), and as you can see, the 3rd line is on top of the 2nd line.  If you look closely, you can see that the 3 is on top of the 2.  That code is:
Code
<small><small><small><small>
     <b>
          This is line 1 in the title
     </b>
     <span class="mybreak">
          This is line 2 in the title
     </span>
     <span class="mybreak">
          This is line 3 in the title
     </span>
</small></small></small></small>
For the 3rd image, and this is what I would like to be able to accomplish, I also have 3 lines in the title (with 2 mybreaks), but with a label on the 3rd line, and as you can see, the 3rd line (the label) is on top of the 2nd line.  As with the 1st image, I have a <span > within a <span > here too.  That code is:
Code
<small><small><small><small>
     <b>
          This is line 1 in the title
     </b>
     <span class="mybreak">
          This is line 2 in the title
     </span>
     <span class="mybreak">
          <span class="label" style="background-color:#696969;color:#DCDCDC">
               This is line 3 in the title
          </span>
     </span>
</small></small></small></small>
So it would appear that what I am trying to do, that X3 is not capable of doing.  Bummer.  :stuck_out_tongue_closed_eyes:
Location: Burlington (Toronto-ish), Ontario, Canada
Self-hosted using Abyss Web Server:   AuroraWings.me   |   GalleryWings.com   |   PanAurora-Studio.com   |
Externally-hosted using LiteSpeed/Apache Web Server:   GenealogyWings.com/galleries   |
 
User avatar
mjau-mjau
X3 Wizard
Posts: 13993
Joined: 30 Sep 2006, 03:37

Re: Is it possible to force line-breaks in Titles?

09 Feb 2023, 04:27

If you must use TITLE instead of descriptions to add extensive description texts, then the title is more limited yes because it's meant to be a basic pre-styled single text. I think the culprit here is your <small> tags, which you have added extensively, and which are affecting the line-height, which causes lines to seem "on top" of each other. Try to remove your <small> tags, and I think you will see the lines work properly.

Then if you need to make text SMALLER, there are better options. For example:
  • Use custom CSS to simply assign a different "font-size" to the entire block, without having to use <small>
  • Create your own class .mycaption { font-size: 12px; } and then wrap titles with <span class="mycaption">everything inside</span>
 
User avatar
JMM
Experienced
Topic Author
Posts: 154
Joined: 02 Aug 2021, 11:18

Re: Is it possible to force line-breaks in Titles?

09 Feb 2023, 21:11

Fantastic.  That works great.

The label is located perfectly, and although there's a little bit of space between the 2 lines of text (lines 1 & 2), it looks OK and I can happily live with that.

Thanks for the fix, it is greatly appreciated.

Have a great day.
Location: Burlington (Toronto-ish), Ontario, Canada
Self-hosted using Abyss Web Server:   AuroraWings.me   |   GalleryWings.com   |   PanAurora-Studio.com   |
Externally-hosted using LiteSpeed/Apache Web Server:   GenealogyWings.com/galleries   |