The Homepage - customization

This may or may not be very helpful. :)

Basically, you have to be willing to mess with HTML to change your template and/or your homepage. What I've done below is taken screencaps of 4 "stages" and marked where the DD tags are (the thumbnails don't have those markings on them). I've also provided the HTML for each stage so people who are curious about that can look at it and maybe use it as an example, go through and see where I've made changes (I tried to mark most of them in the images but I'm sure I missed some little ones). Each stage has a couple of notes as well. Click on the thumbnails to view the larger version of the stage.

You can take customization as far as you want (well almost)... some pages on DD look pretty dang fancy. The example here is just a very simple one.

Default Template Custom Template Default Homepage Custom Homepage
HTML HTML HTML HTML - I used my Custom Template HTML and just added in the Homepage DD tags where appropriate.
Notes: This is the basic Drunk Duck comic page template. There are a few small things you can do to it that make it a bit livelier - see the next column over for an example. You can also choose one of the pre-made templates from the drop-down (more on that below this table). Notes: I haven't added any extras other than the "send me a PQ" link, which is optional. I've changed the colors of the graphics and uploaded them to my account controls ("Manage EXTRA Files" area). Note I had to change a bit of the HTML to reference the new graphics. Notes: The homepage has its own .css file (if that means anything to you) so if you like the look of it but want to just change the colors, fonts, etc. you will need to save and edit (and re-upload to your comic's space) that .css file. None of the css script is stored in the header on the homepage, unlike the default template. Notes: I decided to create a table at the bottom for the chapters, etc. rather than use a column. This formatting is just up to you.

The tricky part was making the URL_FIRST and URL_LAST tags work with my own images. Check out the HTML to see what I did.

Last, note I exchanged the LATEST_BLOG_
COMMENTS_FORM tag for the old COMMENT_FORM tag. This way people can vote from the homepage (although they can't see the votes on that page).

To customize your template, first you need to make the HTML for what you want it to look like - programs like Dreamweaver and Frontpage can be helpful for this, but be careful. It's best to start simple.

Once you have the HTML, you need to make sure you have the right DD tags in the places you want them. The DD tags are like commands to Drunk Duck - they tell DD to replace the tag with a bit of code. So the <!--[PAGE]--> DD tag tells DD to put the comic page in that spot. The DD tags you pretty much need to have (in order to have a working page) are:

<!--[COMIC_NAME]-->
<!--[PAGE_TITLE]-->
<!--[NAV_FIRST]-->
<!--[NAV_PREVIOUS]-->
<!--[NAV_NEXT]-->
<!--[NAV_LAST]-->
<!--[PAGE]-->
<!--[AUTHORS_NOTES]-->
<!--[COMMENTS=300]-->
<!--[COMMENT_FORM=280,200]-->
<!--[RSS]-->
<!--[PAGE_DROPDOWN]-->

There is a little bit more information about DD tags on the supported tags page. I've probably missed a few on there though - there are some extra ones that don't show up in the default template.

Once you have your HTML all set, go to your comic account. Click where it says "Edit Design Template":

On the next page, you'll see two things: a drop-down box and a big editable box:

The drop-down box is for the premade templates. The templates are page designs that other DDers have done and given to DD for anyone to use. (Some of them don't look perfect with some of the new features on DD though.) To set one of these all you have to do is choose it from the dropdown and click "send."

To put in your own HTML, you need to make sure the dropdown is at "None/Default/Own" so you can see the editable box. Simply delete everything in that box, go into your own HTML code, copy all of it, and paste it into the box. Then click the "send" at the bottom of the screen. You can edit your HTML as many times as you want.

Note you can also upload extra files:

This lets you add a cast page, etc. The DD tags won't work on these pages, so go ahead and do whatever you want. If you go to upload an extra file, you'll see that you have two folders, HTML and GFX:

When you upload a file, it will automatically be sorted into the HTML or GFX folder depending on whether it is an html or graphics file. This is important because if you edit your templates and have your own graphics, the file locations have to match! If you are changing your default template to include your own graphic, make sure you are referencing it from gfx/myfile.gif and not someplace else. (If you are adding an extra page, you'll need to reference it from ../gfx/myfile.gif) The best way to do this is to build a folder structure on your computer that will match what happens on DD, something like this:

Your index (template) and homepage html files will go in the "my comic" folder, any other html, css, or txt files will go in the html folder, and any images will go in the gfx folder. (I'm not sure where swf end up.)

 

This concludes your crash course in customization!