Donate
While I don't maintain stripShow for a living, I wouldn't say no to a little donation, if you think the plugin is worth it...
Advertisements
-
RSS Links
-
Meta
Recent Forum Posts
-
Stripshow 3.0 killed all my comics!
posted in forum Support Requests by Li-An on January 18, 2012 at 3:45 am
-
Call User error message.
posted in forum Support Requests by lesbionix on November 27, 2011 at 7:38 pm
-
This post is a comic - not working
posted in forum Support Requests by Brad on November 27, 2011 at 1:17 pm
-
Getting The Side Bar Besides The Comic In Either Sandbox Or AutoComic
posted in forum Support Requests by Brad on November 16, 2011 at 6:26 am
-
"Your comics directory is not writable by the web server"
posted in forum Support Requests by Brad on August 18, 2011 at 5:59 am
-
Stripshow 3.0 killed all my comics!
Forums | Template tags
Template tags
12:17 am
August 4, 2010
spanio
posts 6
Post edited 1:08 am – August 4, 2010 by spanio
A few questions for your great alternative to ComicPress.
Do the template tags control the presence of the navigation buttons?
Currently, the navigation just appears as text, but I'd much rather have custom images for those links. What's the best way to incorporate such at thing?
Also, do you know of any way to remove the blog post from each page. I really only want the comic to appear because I'd like it to speak for itself.
http://paledogstudios.com/gfandman/
This is what I'm working on. Any help would be greatly appreciated.
12:16 pm
August 5, 2010
Brad
posts 233
Well, that depends on how you're using them. The old way to put arrows in template tags was to simply use the HTML for an image in the link text, like:
However, these days, I prefer to do it all in CSS. That's how it's done in stripShow Sandbox.
For instance, your comic has its links wrapped in divs. That's good, that helps.
<div class="first-comic"><a href="http://paledogstudios.com/gfandman/20090618/">First Comic</a></div>
<div class="previous-comic"><a href="http://paledogstudios.com/gfandman/20090618/">Previous Comic</a></div>
<div class="next-comic"><a href="http://paledogstudios.com/gfandman/20090622/">Next Comic</a></div>
<div class="last-comic"><a href="http://paledogstudios.com/gfandman">Last Comic</a></div>
</div>
I find it much easier to use an unordered list. Here's how I have it in stripShow Sandbox:
<li class="first-comic"><?php first_comic('<span class="linktext">First Comic</span>','First Comic'); ?></li>
<li class="previous-comic"><?php previous_comic('<span class="linktext">Previous Comic</span>','Previous Comic'); ?></li>
<li class="next-comic"><?php next_comic('<span class="linktext">Next Comic</span>','Next Comic'); ?></li>
<li class="last-comic"><?php last_comic('<span class="linktext">Last Comic</span>','Last Comic'); ?></li>
</ul>
See, I've got everything wrapped up in an unordered list with the class "stripshow-comic-navbar" on it.
Then the CSS takes care of turning that text into arrows:
width: 135px;
height: 30px;
padding: 0;
margin: 0 auto;
display: block;
}
ul.stripshow-comic-navbar li {
display: block;
height: 30px;
width: 27px;
padding: 0;
margin: 0;
list-style: none;
float: left;
background-image: url(../images/comic-navbar-black.png);
background-repeat: no-repeat;
}
ul.stripshow-comic-navbar li a:link, ul.stripshow-comic-navbar li a:visited, span.nav-widget a, span.nav-widget a:visited {
display: block;
width: 27px;
height: 30px;
}
.linktext { display: none; }
ul.stripshow-comic-navbar li a, span.nav-widget a {
background-image: url(../images/comic-navbar-black.png);
}
/* Regular arrows */
.first-comic a { background-position: 0 -50px;}
.previous-comic a { background-position: -50px -50px;}
.next-comic a { background-position: -100px -50px;}
.last-comic a { background-position: -150px -50px;}
.random-comic a { background-position: -200px -50px;}
/* Disabled arrows */
li.first-comic { background-position: 0 0px;}
li.previous-comic { background-position: -50px 0px;}
li.next-comic { background-position: -100px 0px;}
li.last-comic { background-position: -150px 0px;}
li.random-comic { background-position: -200px 0px;}
/* Active arrows */
.first-comic a:hover { background-position: 0 -100px;}
.previous-comic a:hover { background-position: -50px -100px;}
.next-comic a:hover { background-position: -100px -100px;}
.last-comic a:hover { background-position: -150px -100px;}
.random-comic a:hover { background-position: -200px -100px;}
See, my arrow image is really all the arrows in one. It's got three rows — regular, "hover", and "disabled" — and five columns — one for each arrow and a "random" link.
Is that clear? I've been meaning to make a blog post on this topic, I guess this can serve as a first draft.
That depends on what you're using for a theme.
Hmm. Well, I was going to say that it could be removed in stripShow Sandbox, but it looks like that's a feature I've overlooked. Oops. I'll get on that.
12:20 pm
August 5, 2010
Brad
posts 233
Oh yeah, to illustrate how I laid out the navigation arrow file, here it is:
The full-size version has the arrows at exactly 50-pixel intervals, which is why you see the positions of the arrows shifted by increments of 50 in the CSS.
8:18 pm
August 5, 2010
spanio
posts 6
Thanks for all your help.
You're awesome, man.