New TLS Front Page

[Cthulhu]

Yeah, definitely. If there's any default webfont you like, or another font that's free to use, I'd much prefer that over using images. Thanks for the .zip, I'll try and do something about the site during the week.

 

[Cthulhu]

also, comments section designs, go.

 

[Flintlock]

Are we still going to use comment sections? I don't remember the outcome of that discussion.

 

[LicoriceAllsorts]

Can I say something about the preview site? You have a section under "Contents" called "fanworks", but they're not really 'fanworks', they're fan translations of canon material.

I could well be wrong about this, but I always thought 'fanworks' meant fanart, fanfiction, fan games, fan AMVs etc... - works created by fans. If I am wrong, please let me know.

 

[Shademp]

Are we still going to use comment sections? I don't remember the outcome of that discussion.

We are still going to use it for newsposts at the very least. While there were criticisms against the WordPress comment system, we are still keeping it but we will continue to promote in the newsposts themselves that people visit the forums and comment.

The disagreement was as to whether "Content Pages", such as translations or essays, should have comment sections. For now, let's just have people do as they like to. I will post my content without comment sections, but each time create a separate newspost that highlights and links to the newly published feature.

also, comments section designs, go.

Were we not going to include a Facebook "Like" feature in these? I don't remember.

I only have one complaint in regards to the functionality of the WP comments section. It is too difficult to navigate your way to the final page of comments to an article. See the prime example

Instead of the "Newer Comments" link at the bottom (which simple moves you to the next "page" of comments) it would be more convenient to
a) have a "Show All Comments" option, YouTube style, or
b) click on numbered pages, such as page 2, 3, 4 ... 11 (forum style) to get to the section of comments you want to look at.

I would not blame you Yop if you decide to ignore the above issue though since the WordPress comments aren't really of high priority.

I could well be wrong about this, but I always thought 'fanworks' meant fanart, fanfiction, fan games, fan AMVs etc... - works created by fans. If I am wrong, please let me know.

You are correct.
Fan Works -> Fanart, Fanfics, etc.

You have a section under "Contents" called "fanworks", but they're not really 'fanworks', they're fan translations of canon material.

I don't know how clicking on Fan Works led you to translations. =/

Although it is true that at present, in the preview site, links are not perfectly updated and so each link under Content leads to the FFVII Compendium. Fan Works is *meant* to lead to this page.

 

[Cthulhu]

Social sharing link stuff can be added, would be good for promoting the site etc. Do keep reminding me I need to unlazy myself with this regularly,

 

[Lex]

I only have one complaint in regards to the functionality of the WP comments section. It is too difficult to navigate your way to the final page of comments to an article. See the prime example

Instead of the "Newer Comments" link at the bottom (which simple moves you to the next "page" of comments) it would be more convenient to
a) have a "Show All Comments" option, YouTube style, or
b) click on numbered pages, such as page 2, 3, 4 ... 11 (forum style) to get to the section of comments you want to look at.

I would not blame you Yop if you decide to ignore the above issue though since the WordPress comments aren't really of high priority.

I agree with this. Maybe it would be better to have them showing in reverse order (newest comments first?) - there has to be a simple option for that somewhere in WP.

 

[Cthulhu]

Yeah, iirc showing 'newest first' is easy enough. Can probably be combined with 'nested' comments too, either with 'thread with latest reply first' or 'latest new thread first'.

 

[Cthulhu]

fyi, I did the comments section just now: http://fhtagn.thelifestream.net/final-fantasy-vii/12150/site-goals-set-down-tls-now-recruiting/

* comments listing
* Nested comments
* Comment form

Eh. I think the 'bright' heading color needs toning down or tweaking.

 

[Shademp]

Does "comments listing" mean that you've solved the issue of articles with many comments being difficult to navigate? I can't tell in this example.

 

[Cthulhu]

No, I just did some styling.

 

[Flintlock]

^ Which I think looks pretty good. Nice work. Not sure what you meant about the header colour though, could you elaborate?

 

[Cthulhu]

I mean the bright blueish color currently used for article titles and whatnot.

 

[Shademp]

To-do list for Yop:


#1: Add Entries RSS icon and link in preview page, to the right of the search bar like it is in Flintlock's Flintlock's image

#2: Remove "Site Usage" link in About dropdown menu.

#3: Rename "Highlight" into "Highlights" in the dropdown thingy.

#4: Remove the link "News & Updates" under "Highlights" and add these placeholder links instead:
- Timeline of the Compilation
- Guide to FFVII Canon
- End of the LTD
- History of Deepground
- The Unused Text Series
- Case of Tifa Audiobook
- ACC Commentary


#5: Task phrased by Fangu: "little speech bubbles on archive pages that shows how many comments a post has, example. The speech bubble should have the same color around it as the background"

#6: Correct the coding for the Unused Text articles, in this case make it so that text like Boutique Owner and Shopkeeper all rest immediately adjacent to the relevant table. Like it does in the present version.

 

[Cthulhu]

Right.

#1, #2, #3 and #4 are done
#5 I'm gonna need a design / colors for the speech bubble; image is at http://fhtagn.thelifestream.net/wp-content/themes/childTest/images/comment-bubble.png, background color (regular/on hover) is done with CSS.

#6, what I tried was to change the code:

<table><sub><b>Boutique Owner</b></sub></table>
<table border="4">
<tr>
<td>&#8220;hm, hm, hm, and?&#8221;</td>
<td>&#12300;&#12405;&#12435;&#12405;&#12435;&#12289;&#12381;&#12428;&#12391;&#65311;&#12301;</td>
</tr>
</table>

to

<table border="4">
<tr>
  <th colspan="2">Boutique Owner</th>
</tr>
<tr>
<td>&#8220;hm, hm, hm, and?&#8221;</td>
<td>&#12300;&#12405;&#12435;&#12405;&#12435;&#12289;&#12381;&#12428;&#12391;&#65311;&#12301;</td>
</tr>
</table>

From there I can fix up the look / feel with CSS, or just make it bold like it is now. I'm inclined to hand-edit the HTML and remove styling (like border, inline styles etc) and add classes for this kind of translation, so all you'd have to do in the html would be to do <table class="translation-table"> (for example). How's that sound?

I can make the HTML edits with some fancy find / replace work, but here's where we decide where and when to do it. The current front page is leading in terms of content, after all.

 

[Shademp]

@Yop

1: In the preview, the code <table> is interpreted as a table with a visible border. This is not so in the present version of TLS. Having a visible border does not look right, as I have some images inside tables (that are meant to be without visible borders).

Scroll down in Part 5 preview and you'll find images which have visible borders around them.

Notice also that these tables are meant to be centered, as the code align="center" is written for the tables. But because the tables expand to cover the full width of the article space, no centering occurs.

Can you fix these two things, both remove the visible border around images and make it so the tables actually get centered?

2: Near the bottom of the article you can find the section title "The Transformation of the Password Challenge". This type of text within <h3></h3> code should be thicker, in the style of the present version.



Next step: Need to agree on font-style for dropdown menus. Is the present Times New Roman(?) font good enough? Should we go for Trajan Pro(?) like in Flintlock's preview? We probably need to discuss this in the chat.

 

[Lex]

As far as I can see, Times New Roman isn't anywhere to be seen on that page? But maybe I'm missing something.

 

[Fangu]

Demps I remember you told me in which cases you use tags like 'table border=4', but I can't remember what separates Unused Text dialogue/choices from the 'normal' ones, and so forth. I think it would be a good help if you linked to an article (on the current site) and pointed out an example where all of your different options are used. And at the same time, link all the different small stuff you use for you tables, like

table border=4
table align="center"

etc.

I was going to give Yop a recap last night in IRC after you left (I was busy with the game at that moment, sorry) but realized I had forgotten all of it and stupidly hadn't written it down.

I think our only good solution, if you want to keep using hard coded HTML tags, is to use a duality, such as 'table class="border4" border=4'. That way, it will still look the same when you copy the code to GlitterBerri's site, but when the article is on TLS, the CSS class border4 will kick in, because that class excists on TLS. Of course you have to make sure GlitterBerri doesn't have a "border4" class in hers. Protip here is to call it "UnusedTextBorder4" or something specific instead. (Making the class is something Yop or I do, you don't have to worry about any of that.)

I think that's a workable solution. I've been chewing on it for the longest time and I think it would be an ad-hoc solution that could work.

 

[Shademp]

Demps I remember you told me in which cases you use tags like 'table border=4', but I can't remember what separates Unused Text dialogue/choices from the 'normal' ones, and so forth. I think it would be a good help if you linked to an article (on the current site) and pointed out an example where all of your different options are used. And at the same time, link all the different small stuff you use for you tables, like

table border=4
table align="center"

Example article: UT Part 3

The examples below are from the very first text tables in said article.

1) Used text:
“You…you’ve seen the news, right?
AVALANCHE says there’ll be more bombings.”
“Only devoted employees like me
would go to Midgar on a day like today.”
Code used is

table border="1"

with bolded text to emphasize that this text is used.


2) Unused text that is unlockable:
{Tifa}
“What are you talking about?
Right about now, AVALANCHE is famous.”

Code used is

table border="1"

Lack of bolded text emphasizes that text within this table is unused.


3) Unused text that is "not" unlockable

Spoiler

as in, it is not related to any flag within the game script aside from the text entry list itself

{Barret}
“Huh? Wait a minute!”
“Did we make a terrorist threat?”

Code used is

table border="4"

---------------------------------------

I do not center the text tables. However if I want an image inside a table, I will center the table (as I described before).

align="center"

Aside from that, I can't think of other special functions I use for tables.

I was going to give Yop a recap last night in IRC after you left (I was busy with the game at that moment, sorry) but realized I had forgotten all of it and stupidly hadn't written it down.

I think our only good solution, if you want to keep using hard coded HTML tags, is to use a duality, such as 'table class="border4" border=4'. That way, it will still look the same when you copy the code to GlitterBerri's site, but when the article is on TLS, the CSS class border4 will kick in, because that class excists on TLS. Of course you have to make sure GlitterBerri doesn't have a "border4" class in hers. Protip here is to call it "UnusedTextBorder4" or something specific instead. (Making the class is something Yop or I do, you don't have to worry about any of that.)

I think that's a workable solution. I've been chewing on it for the longest time and I think it would be an ad-hoc solution that could work.

I feel a bit more inclined to call this new table class "UTBorder4". Quicker to write.

With "duality", you are essentially saying that I include the coding that works for both the new TLS WordPress html coding AND what works for GlitterBerri's WordPress? If so it sounds easier in my mind, when I give the code to GlitterBerri (or her representative) to just say
"Search for all class="border4" and replace with border=4"

The convertion from TLS to GlitterBerri's site is not that pressing a matter btw, since neither GlitterBerri or her second-in-command webmaster has much time nowadays to publish the UT articles. We can in fact ignore this issue for now. Compatibility and conversion between our formats may in fact not be a problem that I ever have to raise with you.

As far as I can see, Times New Roman isn't anywhere to be seen on that page? But maybe I'm missing something.

Yeah it was just a guess of mine. I can see I'm wrong now, but I still don't know what the present font is.

 

[Cthulhu]

And I vote against giving hints about what it should look like in class names, . Call it "unusedText", or something. Basically, categorize tables with a generic name. if that makes any sense.

Also no, what Fangu meant is that the tables have both. With the class, we can style it for TLS. On GlitterBerri's site, there will be no CSS attached to tables with that given class, so it'll be ignored. Kinda like a fallback thing.

Alternatively, some CSS can be added to GB's site, which is the ideal situation imho. HTML should contain data and semantics, CSS determines style and how it looks. etc.

 

[Fangu]

And I vote against giving hints about what it should look like in class names, . Call it "unusedText", or something. Basically, categorize tables with a generic name. if that makes any sense.

My thought was that it'll be easier for Shademp to look up which class he should use for each tag if they have separate names. He can't just go "okay I'll put a div in the top of my article" because he uses at least two different styles for the table tag, and they have to be separated somehow anyway.

But what I think you may have meant was, instead of UnusedTextArticlesBorder4, call it UnusedTextArticlesUnusedText. Or, err. As in, don't use "Border4" but some name that describes that this is unused dialogue etc.

HTML should contain data and semantics, CSS determines style and how it looks. etc.

A-fucking-men.

 

[Cthulhu]

<font color="red"><strong>Fuck yeah!</strong></font>

 

[Fangu]

<quote><font size=5 color="red"><strong><i><u>Fuck yeah!</u></i></strong></font></quote>

 

[Cthulhu]

<marquee></marquee>

 

[Shademp]

Suggested class names (for Fangu to implement) for tables of the UT series:

"UsedScript". Thin table border where the text is in bold.

"UnlockedScript". Thin table border (same as UsedScript) except now the text is NOT in bold.

"UnflaggedScript". Thick table border. Both UnlockedScript and UnflaggedScript are unused text, but the latter exists only in the list of text IDs and is never referred to elsewhere in the game code.


Then there are the tables I use to store images inside. I use these, with two rows, so that the upper row is used for images and the lower row is used for comments about the adjacent image(s). For this I suggest the class name:

"ImageTable". Borders should be invisible. The text for the image comments should have the effect of <sup> and <b> per default.