In Silence Archive help?

Working on a new template and need help? Come here for support.

Moderator: Help Desk Team

In Silence Archive help?

Postby littaly » April 11th, 2019, 8:50 am

Hello, I'd like to preface this by saying I'm very much not well-versed in advanced CSS. I know enough to float along, but I've been struggling to figure out how to make one thing possible, if it is at all.

I heavily tweaked the "In Silence" base code (mostly changing text to images & setting the background to a solid cover) and reconstructed the homepage to be more of a big splash image.

But, one thing I'd love to do is alter the Archive code so that it displays thumbnails in a grid, similar to "Geometric Western" or "Sketchbook".

Anyone have tips on how to do it? Or if it's even possible?

Thanks!

(I don't know much about using forums either, so if this is in the wrong place, sorry about that!)
User avatar
littaly
 
Posts: 3
Joined: June 23rd, 2013, 10:49 pm

Re: In Silence Archive help?

Postby eishiya » April 11th, 2019, 9:25 am

It's possible, but you'd need to get rid of all or at least most of the Archive code already in there, and replace it with code that serves up thumbnails. This is a very minimal example with no styling, but if you know basic CSS, you should manage to get it looking nice:

First part, the chapter list at the top, to skip down to the appropriate chapter:
Code: Select all
<!-- BEGIN switch_comic_has_chapters -->
<span class="chapterList">
   <!-- BEGIN archive_chapters -->
      <a class="href="#ch_{archive_chapters.CHAPTER_ID}">{archive_chapters.CHAPTER_TITLE}</a>
   <!-- END archive_chapters -->
</span>
<!-- END switch_comic_has_chapters -->


Second part, the archive itself, with images linking to the pages:
Code: Select all
<!-- BEGIN archive_chapters -->
   <!-- BEGIN switch_comic_has_chapters -->
   <a name="ch_{archive_chapters.CHAPTER_ID}"></a><h2 class="archiveChapterTitle">{archive_chapters.CHAPTER_TITLE}</h2>
   <!-- END switch_comic_has_chapters -->

   <!-- BEGIN archive_comics -->
      <a class="archiveEntry" href="{archive_chapters.archive_comics.COMIC_URL}"><img src="{archive_chapters.archive_comics.THUMBNAIL_IMG_SRC}" alt="{archive_chapters.archive_comics.COMIC_TITLE}" title="{archive_chapters.archive_comics.COMIC_TITLE}" /></a>
   <!-- END archive_comics -->
<!-- END archive_chapters -->


Style chapterList, archiveChapterTitle and archiveEntry as desired :D
If your images are all the same size, these will be in a grid on their own. if they're all different, then you'll want to give archiveEntry a fixed width and height. Adding a border will help things look more grid-like, as well.
Image
User avatar
eishiya
 
Posts: 9728
Joined: December 5th, 2009, 11:17 am

Re: In Silence Archive help?

Postby littaly » April 11th, 2019, 10:02 am

Thank you so much, this has helped a lot already!! I appreciate it. I'll use this as a base and work on it a bit more in the future
User avatar
littaly
 
Posts: 3
Joined: June 23rd, 2013, 10:49 pm


Return to Template Development & Support

Who is online

Users browsing this forum: No registered users and 7 guests