Multiple Chapters in Drop-Down/Archives?

[RavynneNevyrmore]

Hi,

I haven't updated my comic(s) on SJ in about two years, and it seems that either some things were added since then, or I just never noticed them before.

Today I noticed for the first time that I am able to categorize my pages into chapters. I'd love to use the website's categorization system for chapters since previously I just titled each page "Page 36 . [Chapter 1 — Beloved]" or some such and it would be nice to do away with the extra clutter. The first 6 pages of my comic are unchaptered— a prologue, if you will. So, I left those pages and the Volume 1 cover "unchaptered" and created a "Chapter 1" (which I then renamed "Chapter 1 — Beloved") and put the rest of the existing pages in that chapter.

However, now when I view my comic, it only shows the cover and Pages 1-6 (all the "un-chaptered" pages) and it looks as though nothing beyond that exists at all. There is no Chapter 1 on the drop-down menu OR the archives page— it looks as though my comic only consists of 6 pages. However, the "Latest Comic" link still takes you to page 36, and clicking "Next" on page 6 still takes you to page 7, which is the first page of Chapter 1. Then when I'm viewing a page in Chapter 1, the drop-down menu only shows pages in Chapter 1 and none of the prologue or the cover.

So, how do I get my drop-down menu to behave like it does is the examples? Like with the Chapter category headings in bold italics and then all the choices within that category displayed beneath it as a selectable option? How can I make all the chapters accessible no matter what chapter I'm currently viewing?

I suspect maybe this is behaving oddly because it might be a feature that's newer than my CSS template (chosen over 2 years ago), and maybe the old CSS isn't cooperating with the new feature? I have no idea if this is true but it's a thought. Either way, I don't know enough about CSS to fix that myself. Can anyone help me fix this?

Oh, here's the comic I'm currently having trouble with: http://ff7-redemption.smackjeeves.com/

- K

[eishiya]

That's intended behaviour if you use {JUMPBOX.formatted} in your template. If you click the chapter headings, it'll take you to the first page of that chapter, and you can select the other pages from there.


If you wait a regular list of pages in the jumpbox, you can use this code:

Code: Select all

<form name="jumpbox" method="GET">
<input type="hidden" name="url" value="{SITE_URL}">
<input type="hidden" name="page" value="comic">
<select name="url" onchange="if(this.options[this.selectedIndex].value != -1){ window.location = this.options[this.selectedIndex].value; }">
<option value="-1">------ Jump To ------</option>
<!-- BEGIN jumpbox -->
<option value="{jumpbox.COMIC_URL}">{jumpbox.COMIC_TITLE}</option></div>
<!-- END jumpbox -->
</select>
</form>

However, this will not show chapter headings, I think.

[RavynneNevyrmore]

That's intended behaviour if you use {JUMPBOX.formatted} in your template. If you click the chapter headings, it'll take you to the first page of that chapter, and you can select the other pages from there.

Hmm, what is the intended behavior you're talking about exactly? Because my drop-down isn't displaying chapter headings at all. Did you look at my drop-down menu and that's what you're describing as "intended"? Or are you going by my description? Because I may not have described it properly and we might be talking about two different things. What you're describing sounds like what I want, not what I currently have.

Where would I find the tag you're talking about and where would I put the code you gave me?

[eishiya]

Sorry, I did go by your description. Looks like I misunderstood.

The code you're looking for is in the Comic Page template, search for "<form name="jumpbox" method="GET">"
Everything between that and </form> (including those lines) make up your jump box. Try replacing that with {JUMPBOX_FORMATTED}

If that isn't what you want, then try the code I gave above.

[RavynneNevyrmore]

Hmm, that did get me a bit closer! At least now it shows the Chapter headings.

But, can I get it to look/behave like this?:

Un-Chaptered
- Volume 1 — cover
- Page 1
- Page 2
- Page 3
- Page 4
- Page 5
- Page 6
Chapter 1 — Beloved
- Page 7
- Page 8 (etc.)
- Page 42
- Page 43
Chapter 2 — Living Life
- Page 44

In other words, I would like all the chapter headings and all pages visible at the same time, and be able to select any page from any chapter regardless of which chapter I'm currently viewing.

[eishiya]

From what I understand, there is no practical way. Either you get the collapsed chapters with {JUMPBOX_FORMATTED}, or you have no chapter headings at all using the code I gave you in my first post.

[RavynneNevyrmore]

Okay, thank you! =)

Also, my archive list still only lists unchaptered pages. Is there a similar tag to get it to show the rest?

[eishiya]

No. It looks like your archive uses the old system. Can you please post your archive page code? That way I can adjust it for you without making you lose your formatting.

Also, since this is template stuff, I'm moving this topic to the Template Development & Support section.

[RavynneNevyrmore]

This is my Comic Archive template:

Code: Select all

<style type="text/css"><!--

table.sort td
{padding: 3;
border-left: 1px solid #9aa1bf;
border-bottom: 1px solid #9aa1bf; }

table.sort th
{padding: 3;
border-bottom: 1px solid #9aa1bf; }

--></style>


<table cellpadding="4" class="sort">

   <tr>
<th><font color=#9aa1bf>#</font></th>
<th><font color=#9aa1bf>Title</font></th>
<th><font color=#9aa1bf>Date Released</font></th>
<th><font color=#9aa1bf>Comments</font></th>
  </tr>
   
   <!-- BEGIN archive_list -->
   <tr>
<td><center><font color=#9aa1bf>{archive_list.COMIC_NUMBER}</font></center></td>

<td><center><font color=#9aa1bf><a href="{archive_list.COMIC_URL}">{archive_list.COMIC_TITLE}</a></font></center></td>

<td><center><font color=#9aa1bf>{archive_list.DATE_RELEASED}</font></center></td><td><center><font color=#9aa1bf><a href="{archive_list.COMIC_URL}">{archive_list.NUMBER_COMMENTS} Comments</font></a></center></td>
   </tr>
   <!-- END archive_list -->
   
</table>

[eishiya]

Looks like I was right, your archive page does use the old code. Here's the corrected version. This cycles through the comics correctly and has chapter headings, but you may want to style the chapter headings. Other than that, I think this works.

Code: Select all

    <style type="text/css"><!--

    table.sort td
    {padding: 3;
    border-left: 1px solid #9aa1bf;
    border-bottom: 1px solid #9aa1bf; }

    table.sort th
    {padding: 3;
    border-bottom: 1px solid #9aa1bf; }

    --></style>


    <table cellpadding="4" class="sort">

       <tr>
    <th><font color=#9aa1bf>#</font></th>
    <th><font color=#9aa1bf>Title</font></th>
    <th><font color=#9aa1bf>Date Released</font></th>
    <th><font color=#9aa1bf>Comments</font></th>
      </tr>
       
<!-- BEGIN archive_chapters -->
<!-- BEGIN switch_comic_has_chapters -->
<tr><td colspan="4" class="chapter_title"><center><font color=#9aa1bf><a name="ch_{archive_chapters.CHAPTER_ID}"><h2>{archive_chapters.CHAPTER_TITLE}</h2></a></font></center></td></tr>
<!-- END switch_comic_has_chapters -->
<!-- BEGIN archive_comics -->
       <tr>
    <td><center><font color=#9aa1bf>{archive_chapters.archive_comics.COMIC_NUMBER}</font></center></td>

    <td><center><font color=#9aa1bf><a href="{archive_chapters.archive_comics.COMIC_URL}">{archive_chapters.archive_comics.COMIC_TITLE}</a></font></center></td>

    <td><center><font color=#9aa1bf>{archive_chapters.archive_comics.DATE_RELEASED}</font></center></td><td><center><font color=#9aa1bf><a href="{archive_chapters.archive_comics.COMIC_URL}">{archive_chapters.archive_comics.NUMBER_COMMENTS} Comments</font></a></center></td>
       </tr>
<!-- END archive_comics -->
<!-- END archive_chapters -->
    </table>

[RavynneNevyrmore]

That did work. Thank you!