Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with HTTPS or Subversion.

Download ZIP

Loading…

Archives Template - able to borrow from Archimedes? #119

Closed
pslo opened this Issue · 23 comments

3 participants

@pslo

Hi Michael,

At the risk of opening another can of worms... I've been trying to see if I can borrow the structure of Archimedes' "Archives" template into my site at www.pslo.net .

(To recap, my site is built using a video portfolio theme, and I'm trying to incorporate as much of Webcomic into it as I'm able.)

I've not even seen Archimedes' "Archives" template, I'm just examining the file and it looks like it would lay out the Webcomic information I'm keen to display: a single page overview of all the Storylines, Collections, Posts / comics, etc.

How I've approached this (so far) is to duplicate my site's existing Archives template (a pretty simple one, comparatively) and copy & paste the bulk of Arch's Archives code into the relevant place. Something tells me this is a pretty foolish stretch to hope this might work, and sure enough -- the test page is not showing anything:

http://www.pslo.net/archives/comics-archives/

(For the record, even knowing this was likely to cause problems, I ended up having to remove the two lines referencing "archimedes_posts_nav" for the template to show up as an option for this test page in the first place.) (Hope that made sense.)

Even if my current approach is all wrong.... is there a way to achieve what I've listed above -- a single page overview of all the current Storylines, Collections, Posts / comics, etc -- without using Archimedes?

As always, thank you for whatever help you're able to offer. Please let me know when these requests for customization assistance are asking too much.

@mgsisk
Owner

I'd probably steal Inkblot's webcomic/template-archive.php, which is designed for showing single page archives. Then you can just assign that template to an existing page and it should work, for the most part. The only trick would be these three lines at the top:

$webcomic_group      = get_post_meta( get_the_ID(), 'inkblot_webcomic_group', true );
$webcomic_image      = get_post_meta( get_the_ID(), 'inkblot_webcomic_image', true );
$webcomic_collection = get_post_meta( get_the_ID(), 'webcomic_collection', true );

Inkblot includes custom settings for controlling those options, but you could just set them to whatever you want directly in the file, like:

$webcomic_group      = true; // show webcomics groups by collection, storyline, or character; false to just list collections, storylines, or characters
$webcomic_image      = true; // show webcomic preview images; false to hide them
$webcomic_collection = 'storyline'; // storyline archive; use 'character' for a character archive, or true for a collection archive
@pslo

Hi Michael,

Thanks so much for writing back to me; I had assumed this was a topic you'd preferred I'd solve on my own. That may still yet be the case, though...

Could you please take a look at the template that I've created and tell me where I'm going wrong? (I presume you're able to view that through this link: http://www.pslo.net/comics-archives/ )

In that template, I've tried to:

1) start from the inkblot template archive, as you suggest
2) copy over the page-header & div class styling from my WP theme's archive template, and then
3) modify those three lines you suggested

...to absolutely no success.

(Actually, the maddening thing is I did get success somewhere along the way... but a) something was still missing in the mix, possibly to do with the page-header and b) I can't seem to recreate that success, at all.)

Thanks very much -- P.

@mgsisk
Owner

Can you post the source for your modified template?

@pslo

Hi, certainly. Do you prefer code embedded into this comment box, or links to a .php template file?

@mgsisk
Owner

Embedded code is preferable.

@pslo

I'll begin by breaking down the pieces of what I'm currently using for the template, and where it came from.

The first of three parts is pretty much from Inkblot, with your recommendations on those three lines:

/**
* Template Name: Archive Inkblot 3
*
* Useful for creating a more traditional webcomic archive page.
*
* @package Inkblot
*/

if ( !webcomic() ) {
    get_template_part( 'page' );
    return;
}

get_header();
$webcomic_group      = true;
$webcomic_image      = true;
$webcomic_collection = 'storyline';
?>

The second of three parts is the only carryover from my theme's template styling:


            <!--BEGIN .page-header -->
            <div class="page-header">
                <h1 class="page-title"><?php the_title(); ?></h1>

            <!--END .page-header -->
            </div>

The third of three parts is, once again, straight from Inkblot:

<main role="main">
    <?php while ( have_posts() ) : the_post(); ?>
        <?php get_template_part( 'content', 'page' ); ?>
    <?php endwhile;?>
    <?php if ( 'character' === $webcomic_group ) : ?>
        <?php webcomic_list_characters( array( 'webcomics' => true, 'target' => 'first', 'webcomic_image' => $webcomic_image, 'collection' => $webcomic_collection ) ); ?>
    <?php elseif ( 'storyline' === $webcomic_group ) : ?>
        <?php webcomic_list_storylines( array( 'webcomics' => true, 'target' => 'first', 'webcomic_image' => $webcomic_image, 'collection' => $webcomic_collection ) ); ?>
    <?php else : ?>
        <?php webcomic_list_collections( array( 'webcomics' => true, 'target' => 'first', 'webcomic_image' => $webcomic_image, 'collection' => $webcomic_collection ) ); ?>
    <?php endif; ?>
    <?php comments_template( '', true ); ?>
</main>

<?php get_sidebar(); ?>
<?php get_footer(); ?>
@pslo

And here is the archive template straight from my theme:

<?php
/*
Template Name: Archives
*/
?>

<?php get_header(); ?>

            <!--BEGIN .page-header -->
            <div class="page-header">
                <h1 class="page-title"><?php the_title(); ?></h1>
                <?php if ( current_user_can( 'edit_post', $post->ID ) ): 
                    edit_post_link( __('edit', 'framework'), '<span class="edit-post">[', ']</span>' );
                endif; ?>
            <!--END .page-header -->
            </div>

            <!--BEGIN #primary .hfeed-->
            <div id="primary" class="hfeed">
            <?php if (have_posts()) : while (have_posts()) : the_post(); ?>

                <!--BEGIN .hentry -->
                <div <?php post_class() ?> id="post-<?php the_ID(); ?>">

                    <!--BEGIN .entry-content -->
                    <div class="entry-content">
                        <?php the_content(__('Read more...', 'framework')); ?>
                        <?php wp_link_pages(array('before' => '<p><strong>'.__('Pages:', 'framework').'</strong> ', 'after' => '</p>', 'next_or_number' => 'number')); ?>
                    <!--END .entry-content -->
                    </div>

                    <!--BEGIN .archive-lists -->
                    <div class="archive-lists">

                        <div class="one_half">
                            <h4><?php _e('Last 30 Posts', 'framework') ?></h4>

                            <ul>
                            <?php $archive_30 = get_posts('numberposts=30');
                            foreach($archive_30 as $post) : ?>
                                <li><a href="<?php the_permalink(); ?>"><?php the_title();?></a></li>
                            <?php endforeach; ?>
                            </ul>
                        </div>

                        <div class="one_half column-last">
                            <h4><?php _e('Archives by Month:', 'framework') ?></h4>

                            <ul>
                                <?php wp_get_archives('type=monthly'); ?>
                            </ul>

                            <h4><?php _e('Archives by Subject:', 'framework') ?></h4>

                            <ul>
                                <?php wp_list_categories( 'title_li=' ); ?>
                            </ul>
                        </div>

                    <!--END .archive-lists -->
                    </div>

                <!--END .hentry-->  
                </div>

                <?php endwhile; else: ?>

                <!--BEGIN #post-0-->
                <div id="post-0" <?php post_class() ?>>

                    <h1 class="entry-title"><?php _e('Error 404 - Not Found', 'framework') ?></h1>

                    <!--BEGIN .entry-content-->
                    <div class="entry-content">
                        <p><?php _e("Sorry, but you are looking for something that isn't here.", "framework") ?></p>
                    <!--END .entry-content-->
                    </div>

                <!--END #post-0-->
                </div>

            <?php endif; ?>
            <!--END #primary .hfeed-->
            </div>


<?php get_sidebar(); ?>

<?php get_footer(); ?>
@pslo

Hi again Michael,
Assuming you're not deterred by my modifications, I have one last / related question to this archive: ideally I would like to replace the the code for the "random webcomic" in my nav buttons to direct people to this archive page. As I'm sure you know, currently the code for that button (in its relevant templates) looks like this:

<?php random_webcomic_link(); ?>

Is it easy enough to change this to link to my archives page at http://www.pslo.net/comics-archives/ ?


Please note, if you're likely to prioritze, this question isn't anywhere near as important as actually setting up that archive page in the first place. :) Thanks again.

@mgsisk mgsisk was assigned
@ashikai

Wow, ok. After a couple hours of fiddling with this, I think I've finally figured out how this works... Rather, I've finally figured out the Actions/Filters documentation (and how the calls work. Would be nice to see which arguments you can use per call though).

Here is the world's simplest archive page:

<?php
/**

  • Template Name: Archive */

get_header(); ?>

<?php webcomic_list_storylines(); ?>

<?php comments_template( '', true ); ?>

<?php get_sidebar(); ?>
<?php get_footer(); ?>

@ashikai

Edit by Mike: I don't usually edit other peoples posts, but a few things mentioned here are incorrect. Please read my reply below for an explanation.

After several hours of fiddling with this archive issue, I finally got something I can work with. BEHOLD! The simplest archive page EVER!
(BTW, the Actions/Filters page is seriously difficult to read. It's nicely formatted, but it would be nice to know what arguments each call can take and what each call does. Most are kinda self-explanatory, but I'm not ashamed to admit that I still had no idea how to use them (and I develop wordpress sites professionally.).).

<?php
/**
 * Template Name: Archive
 */

get_header(); ?>

<main role="main">

<?php webcomic_list_storylines(); ?>

<?php comments_template( '', true ); ?>
</main>

<?php get_sidebar(); ?>
<?php get_footer(); ?>

This archive template page is located in a sub-folder of my theme directory (and named "webcomic"). It's a surprisingly important thing.

Anyway, by using the calls on this page https://github.com/mgsisk/webcomic/wiki/Actions-and-Filters and by following the simple template I posted, you shouldn't have any problems at least getting the lists of links you want to display. The rest is div magic and styling.

You can see my working demo on my custom theme here: http://shamrock.talesstudio.com/archive/

Hope this helps somebody!

@mgsisk
Owner

@psio Assuming the three parts you posted are all contained in a single template that you're using for your archive page I'm not sure why it wouldn't work. You could try removing the conditions so you're just calling the specific type of archive you want, like:

<main role="main">
    <?php while ( have_posts() ) : the_post(); ?>
        <?php get_template_part( 'content', 'page' ); ?>
    <?php endwhile;?>
    <?php webcomic_list_collections( array( 'webcomics' => true, 'target' => 'first', 'webcomic_image' => $webcomic_image, 'collection' => $webcomic_collection ) ); ?>
    <?php comments_template( '', true ); ?>
</main>

@ashikai I think you're confusing Actions and Filters with Template Tags; I'm honestly not sure how you figured anything out by looking at the Actions and Filters page, but congrats. XD Actions and Filters are meant for advanced modification to the plugin (like modifying Webcomic's Open Graph output, for example). All you need to build an archive page–like your example–are basic template tags (like webcomic_list_storylines). All of Webcomic's template tags are fully documented with what arguments they accept and at least two or three examples per a template tag on how to use them.

There's also no need to put the archive template in a webcomic subdirectory the way you've set it up (as a Page Template); you could just create a Page and assign that file as the template. If you want to modify WordPress' generated archives (like collection, storyline, or character archives), however, that's the place to put them (and you should probably leave off the page template part). It should be noted that webcomic/archive.php affects all of those archives; you should use conditional tags or separate archive templates (webcomic/collection.php, webcomic/storyline.php, webcomic/character.php) to make sure you don't screw up other archive pages. A full list of custom templates Webcomic supports is also available.

@mgsisk
Owner

@psio I'm not sure why I didn't notice this, but the biggest problem is probably that the $webcomic_collection variable is set incorrectly (my fault; my example was incorrect). It needs to be set to a collection ID, like:

$webcomic_collection = 'webcomic1';
@ashikai

Ahhahaha! Hey, whatever works, right? XD

Honestly, I didn't realize that there was a difference between the two pages, so I just stuck with the other page. Probably could have got a lot more done if I had sat down and paid attention...

I was using the webcomic/archive.php format because I wanted to keep a blog separate from the comics. That and it was easier for me to keep track of what page did what at a glance. I didn't know that about the specific archive pages though. For my purposes (since I'm only going to be filtering via storyline) I'll stick with just the archive template unless there's a serious detriment to doing that. So far it seems that both the Blog's archives and the webcomic's archives are working, so hopefully it'll stay that way.

Thanks for the speedy reply, by the way! :D

@mgsisk
Owner

At least you know now. XD I've tried to make the Template Tags page as complete as possible; feedback (on that or any part of the Beginner's Guide) is always appreciated, though.

Your archive template is fine. The only problem you might have is if you wanted to, say, have your storyline archive pages look different. With just the one webcomic/archive.php template, all of your storyline (and character) archives will use that same template and just display out the list of storylines (which might be fine in your case). To get around that, though, you can just create a new webcomic/storyline.php template, in which case that template will be used instead of webcomic/archive.php (since it's more specific).

@ashikai

Roger that! Thanks for the help!

One more quick question before I stop hijacking this thread:

I've been working with the webcomic_list_terms() calls, specifically, webcomic_list_storylines(). The problem is that when you click on a storyline, the page reloads with a list of links, but the links are listed before the storylines. I can't really figure out a way to control the way they appear. I've read through the pertinent Archimedes and Inkblot themes for reference but I still can't quite figure it out. My Archive is here: http://shamrock.talesstudio.com/archive/

If there was a way to even assign a class to the links, I could take care of the positioning with CSS. Any thoughts?

@mgsisk
Owner

Can you share the source of your webcomic/archive.php file (assuming it's different from what you posted above)?

@ashikai

Ahh, I figured it out... sort of. Sorry for the trouble! :D

@pslo

Hello again,

Thank you both so much for all your help! I seem to have been able to make some progress here, thanks to the suggestions you both have provided, and to just extended playing around with the code to see what each little bit does. It's a long way 'round to understanding PHP, but I'm getting there. Maybe. :)

Overall, I've been able to achieve what I was going for: an archive page that will keep current with all the collections, storylines and webcomics I add. At this point, there are only two things I'd still like to do with this page. As usual, feel free to ignore or decline these questions if they fall into the category of "too much detail".

1) Obviously I'm happy to have the archive template provide all the information I've asked for: Collections, Storylines, Webcomics. Is there any easy way to alter HOW the template presents this information, for formatting's sake? If you look at the page (http://www.pslo.net/comics-archives/) you can see I've kept two parts to this template: the Webcomic code, and the pre-existing "Last 30 posts" etc that my theme's original archive template had. This shows how the latter portion is formatted with the h4 heading, ul entries, etc.

If I study the Webcomic code, it seems like it might have something to do with how the webcomic_list_collections command accompanied by an array of parameters...? Meaning, one line of php code that retrieves & presents all the archive information. Any formatting I have tried affects the entire display of webcomic information retrieved & presented (hope that made sense). Here's the main line of code I'm trying to break down:

<?php webcomic_list_collections( array( 'webcomics' => true, 'target' => 'first', 'show_description' => true ) ); ?>

At the very least, is there any way to adjust the formatting so that the webcomic Collection title is in bold / h4?

2) This is a repeat of an earlier question, which I'm still trying to address. I'd like to replace the the code for the "random webcomic" in my nav buttons to direct people to this archive page. That means changing this:

<?php random_webcomic_link(); ?>

Can you tell me how to change this to link to my archives page at http://www.pslo.net/comics-archives/ ?

@pslo
  1. Lastly, I'm noticing "stray periods" preceding the Collection titles and Collection descriptions. Any guesses what that might harken from? No worries if not. I can live with it.
@mgsisk
Owner
  1. There are a lot of options for the archive template tags, but there's no easy way to alter their HTML output; they're designed to be used "as is." That said, you can make them look just about anyway you want with the right CSS. To get the collection titles in line with your <h4>'s, for example, try something like:

    .webcomic-collections .webcomic-collection-name {
        font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
        font-weight: bold;
    }
  2. Assuming that will always be the link to your archive page you can just replace <?php random_webcomic_link(); ?> with a hardcoded link, like:

    <a href="http://www.pslo.net/comics-archives/">Archive</a>
  3. This is a styling issue; your anchor tags have a dotted border, and for some reason those borders aren't rendering properly for the collection links (they're only one pixel wide, which is why they look like periods). You could probably just remove them, like:

    .webcomic-collections .webcomic-collection-link { border: 0; }
@pslo

Wonderful! This is a huge help, Michael - thanks so much!

The solution for point 2 is what I'm currently working with, though as a text link it does clash somewhat with the placed images (thru CSS) that serve as links to the other pages. I tried swapping out an image, but couldn't get that to match the same positioning style as the other ones (my link's image was lower than the other buttons, for starters). (You can see it in the top webcomic nav bars at the bottom of this page: http://www.pslo.net/.)

Out of curiosity, in a line of code like this:

<?php random_webcomic_link(); ?>

I get that "random_webcomic_link" is a template tag, and that's what the PHP is acting on. Is that also somehow invoking a "class" in the CSS, to be customized?

I should probably just let this thread close, you've done plenty to help me here. If you want to comment I'll happily take it but you can also consider my main questions answered. Thank you so much for all your time!

@mgsisk
Owner

You could just add a CSS class to that link and style it appropriately:

<a href="http://www.pslo.net/comics-archive/" class="webcomic-archive-link">Archive</a>

Most of Webcomic's template tags add various CSS classes to make it easier to style their output, yes.

@pslo

Hi Michael --

This has helped solve my issue completely. Thank you so much for all your time & help -- it's greatly appreciated.

Paul

@pslo pslo closed this
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Something went wrong with that request. Please try again.