Comic Press Stuff

Things I’ve learned with comic press

comic press has been an amazing tool,  I’ve really enjoyed working with it and it has been the answer to my questions about how to actually code a webcomic with proper functionality.  I even briefly spoke with Frump on twitter about a minor issue I had.

Comic Easel

The main things I’ve learned is that Comic Easel is the real secret.  it is a plugin that you inject into any WordPress theme, and it does work very well with comic press.  So I combined them both.  I haven’t tried using comic easel on any other WordPress them but i am tempted to try.

the comic must be the FEATURED image, and not just in the blog area haha. the actual WordPress post is meant to be the blog and not the comic!  once you have that.

the navigation widgets are a bit weird.  I had to do a bunch of custom CSS to get mine to display on the right hand side of the comic.  but again, some of the buggyness was due to my lack of understanding of the featured image problem.

archives

Archives in comic press are done with short code. but I was never really satisfied with how it came out.  So instead I have opted to use WP Show Posts Which is a really nice plugin which via short code can also show posts on any page.  so i was able to get my extra posts like you see here, and my comics posts displaying as thumbnails on my archives.

fonts

I’ve been using easy google fonts which is an excellent plugin to control all my header, and paragraph text.  its been wonderful not having to worry about how anything will look as long as I choose the right type of text to display,  my site will automatically pull from my font choices to make everything look just right.

share buttons

You may have have noticed these little share buttons and something that looks like an ad! that was done with a plugin widget called Add to any share buttons, which is, as it says, adds share buttons to a page, and the random image was done with Random Banner! which is a super cool way to get random images, gifs and even swf files to play on the side bar of my site! I want to eventually get all the really cool adult comic links working there.

boxed layout

I chose the boxed layout option for comic press, with a right side bar at 200 px, and then the interior media to be set to 196px or something like that. I’ve always liked the way the right and left side bar looked on older webcomics like mac hall or oglaf. so I took those as inspiration for my own. The buttons and color styling were inspired from Oh joy Sex toy, since everything Erica does is pink and green

WordPress

On the whole, I really love WordPress, I cant imagine myself using any other CMS, I just cant stand the rates of places like squarespace and the lack of openness on those platforms. I much prefer to do things the old school way, heck if I hadn’t found comicpress and comic easel, I would have just coded this site by hand using htlm and css. or this super cool minimal webcomic front end call Rarebit

Using widgets, installing plugins, and adjusting the css has been such a treat. I’m not really a fan of responsive web design or even just the notion of optimizing for mobile viewers, so I hard coded a bit of CSS into the site to keep the page width static. I feel like it still displays just fine on a phone, but I really wanted the site to be a true desktop experience like the webcomics of old.

css

CSS has been a major part of getting the site to look the way it does. I used a border radios to add the rounded edges and nudge around the spacing, font color, menu overlays and really everything you see. I even programmed the side buttons by adding custom CSS and then calling it up using HTML in the side bar area.

#sidebar-right {
    width: 196px;
}
body.scheme-sandy h1 a, body.scheme-boxed h1 a {
    text-shadow: 1px 2px 2px #ab246a;
}
.menu ul li a, .footmenu ul li a {
    font-family: 'telex';
}
#sidebar-left, #sidebar-right {
    display: inline-block;
    padding: 0px;
    padding-top: 15px;
	  padding-right: 10px;
}
.textarea#comment {
    width: 90%;
    height: 80px;
}

body {
    margin: 0;
    font-size: 14px;
    color: #777777;
}
.sidebutton {
	background-color:#ff77a9;
	border-radius:9px;
	display:inline-block;
	cursor:pointer;
	color:#ffffff;
	text-align: center;
	font-family:pangolin;
	font-size:15px;
	margin-bottom:5px;
	padding:9px;
	width: 90%;
	text-decoration:none;
}

.copyright-info {
    clear: both;
    text-align: center;
    margin-right: 20px;
    font-size: 11px;
}
body.scheme-boxed #page {
    border: 1px solid #79184b;
    box-shadow: 1px 2px 15px #000000;
    background: #ffffff;
    border-radius: 20px;
}

.copyright-info {
    color: #efc9d6!important;
    clear: both;
    text-align: center;
    margin-right: 20px;
    font-size: 11px;
}

Here is just sample of some of the CSS I added. I just customized it using the right click + inspect, and then messing around with the values in chrome.

block editor

by now you’ve probably realized that I am ordering a lot of this post using images next to text in blocks! I’ve been experimenting with the new WordPress block editor for certain posts and pages. I don’t think its totally ideal, and I don’t care much for fancy ui’s that hide basic html from the user, (I’m a web2.0 kind of gal) but it is useful for turning on and off and achieving certain kinds of formatting. I have a classic editor plugin that allows me to switch to the legacy way to write posts so I can jump in between versions depending on the formatting I want to achieve.

here is a list because I like lists

• Plugins are amazing! but too many can make your site slow
• WordPress is a game of checking of radio buttons and seeing if anything changes
• Don’t touch hard code if you don’t have to, most things can be done with the custom css editor
• SSD hosting is a must.
• Next Gen Gallery is the best! I use it on all my sites
• comicpress was made before Instagram so I made my own Instagram icon to replace the Facebook icon!
• wp-file manager is a must to get into the actual files of your site!