WordPress/ComicPress: Part 2 Alterations? And what’s a child theme?

So now you’re up and running. Here comes the part where it starts to get interesting. For me, I like to know what the code is actually doing. I don’t want to include code that I don’t need for a couple of reasons: 1) It’s code I don’t need (and that means code that the browser doesn’t need); and 2) If I need to come back and make changes months down the line, it makes it confusing. With the WordPress/ComicPress combination, I don’t know what all the extra code is doing exactly. 

For example, there are a lot of ways to change things up, but I wanted to do something simple like take out the down arrow that appears after a menubar item when there are submenu items. I went through the code line-by-line for a couple of days and found that it was just a jumble and the arrow would just not go away. I’m used to coding my own stuff and I try to keep that pretty organized so that I can keep track of it all. The other thing that I’ve found is that I name the parts consistent things in all my sites (so header, navigation, etc.). Since ComicPress has been built by someone else, the naming conventions are slightly different. My assumption is that the menubar is the “menubar at the top” based on looking at the code that’s generated for a page, but maybe I’m way off. In the end, I spent three days trying to make a “simple” edit. Compare that to the half hour that it took me to code my own menubar without the arrow and add it to the website… you can see where I start to get cautious about making the recommendation to edit your site. 

How to customize your site – child themes
Let’s start small with child themes. Puns aside, here’s how to do it: the first thing that I did was to create what is called a “child theme.” To do this, create a new folder in your themes folder on your server. Title it whatever you want to call your theme. Then create a new style sheet with the following copy at the start of the document: 

This basically tells WordPress that there’s a new theme and it’s based on an existing theme. So for the above example, I created a new theme called On the Verge (A) and it’s based on the existing comicpress theme (B). Now save this style sheet and put it in the folder that you created on your server. WordPress should now recognize your new theme. 

So why create a child theme at all? Basically it’s all about insuring that you don’t lose all your hard work. If you directly alter the existing comicpress theme and then update it in the future, you run the risk of losing your alterations. By using a child theme, any edits are to the child theme and get applied to the existing theme. Updates to the existing theme have no effect on the child theme. 

Confused yet? I know I was. But trust me, child themes are the way to go.

Read Part 3: Edits

About jason

Illustrator and graphic designer. When not working full time as a Senior Graphic Designer, I am usually working on the graphic novel On the Verge: the Arrow of Time. Artist on Andrew Jackson in Space and The Sisters.

5 Responses to WordPress/ComicPress: Part 2 Alterations? And what’s a child theme?

  1. the down (and right arrow) arrow is in the ddsmoother.js file theres an option to disable that in the comicpress options so you can write your own dropdown code.

    • jason says:

      An there’s a good lesson for everyone: if you’ve got a question or you’re having trouble, contact Frumph and he’s there to help.

      This gets to the larger point that I’m trying to make (whether I’m doing this clearly or not is up for debate). ComicPress is really useful, but there are a lot of moving parts to wrap your head around. So if you’re starting at the beginning, there’s a lot to understand. And if you’re coming from WordPress and you think you have a pretty good handle on how it all works, it can blow you away pretty quickly.

      It really is a balance between being frustrated doing it yourself and finding the help the you need. When it takes me a half hour to code something versus three days of digging and still not getting the answer, it’s a bit of an issue for me – I’ll just code it myself and then I know what’s going to happen. And someone who’s got less experience than me is really going to hit a wall. Hopefully these posts can help with that ahead of time and get people through them

  2. Pingback: Wordpress/ComicPress: Part 1 Getting started | on the verge

  3. dnovasr1 says:

    I’m going to come across as a complete n00b here… but, here it goes. I’m not savvy when it comes to doing CSS, I’m and writer and an artist, but, I’ve been trying to do the best that I can with the comicpress boxed childtheme.

    Thing is, I have no idea how to increase the display size of the comic in this particular theme… I’m almost to the point of paying someone to fix it.

    Where do I go in the css, or Php files to make this change?

    http://www.sequentialrevolution.com

    As you can see, the comic displays kind of small, and I’d like it to conform to the original file sizes that were set to 144 DPI.

    Hopefully this isn’t out of line… we’re still new to all of this.

    • jason says:

      Hi dnovasr1! That’s a good question and one that I can’t 100% be sure of without really looking at the CSS code. But I can take an educated guess that the code is telling the browser to display the comic smaller than 100%. I took a quick look at the code on your site and in the Comic Easel style sheet, the code says to display the comic image (#comic img) at a maximum width of 80% (max-width: 80%). Now as I say, this might not be the line of code that’s affecting this, but it’s probably a good place to start (it’s also worth pointing out that the #comic div is set to a max-width of 80%, so once you start making edits, this could start to break…).

      Anyway, I hope that helps! I know working with this stuff can be pretty frustrating at times but you’ll get there. Best of luck and let me know how it goes.

Leave a Reply

Your email address will not be published. Required fields are marked *