Generic Contest Format

Just for grins, we've created a sample template file for contests using some of the techniques in "Ideas on Page Design" .  This  sample template is fully customizable, and is complete with a set of buttons based on a short scan of those used in existing contests.  The template is just a container file into which you can insert your own contest logo and information.

I've created a second set of more artistic-looking buttons with a brushstroke background and font, so there are now two versions of this.  Here's what they look like:

STATIC

Contest Template Container  (E) Contest Template Container #2301609 by Max Griffin 🏳️‍🌈

STATIC

Generic Contest Container--Brush Theme  (E) Generic Contest Container--uses brushstroke background and font #2301639 by Max Griffin 🏳️‍🌈

These templates are based on the one used in

FORUM

Tales Shown, Not Told Discussion Forum  (18+) A short story contest with a focus on showing, not telling. #2295490 by Max Griffin 🏳️‍🌈

The template uses dropnotes as a navigational device.  While you could just type your text for each button between the {dropnote} and {/dropnote} tags for that button, I recommned instead that you place that information in a static item. You can then use an {insert:#######} tag to insert the text into the template.  This makes it easier to edit (and debug) the WritingML. 

Note that {insert:#######}  only works with static items and web pages.  Also, the inserted text does not appear to "preserve spacing" no matter how you've set that option in your static items.  Finally, while nested dropnotes are generally not permitted, if you use {insert:#######}  with this template, the inserted static item may have dropnotes even though it is called from within a dropnote.

Feel free to use or modify this template as you see fit.  If you use or modify it, please retain the copyright notice in the code below.

Here's the code that produces that file. To use it, copy it to your own file.

                                                                               

Code for standard, green, generic contest ▼

{hide} 
############## CODING NOTES 8/6/2023 ##############
  This file must be customized for your contest.
  Where it says ### <CONTENT> goes on the next line ### you have two options.
          use an  {insert:#########} to insert the number of a static item that has the content
          OR type the content directly into this file, starting on the "next line" as indicated.
We strongly recommend that you place your content in separate static items and use the first method.
The countdown information at the end must also be customized or can just be hidden  if you don't want to use it.
Additional buttons are available:
              {image:2301606-50%} RULES
              {image:2301604-50%} PROMPT (singular)
              {image:2301709-50%} RESOURCES
              {image:2301598-50%} BENEFICIARIES
Buttons are scaled at 50% to fit three across the page.  Buttons scaled to 80% fit two to a line.
If you want to use differently sized buttons, you will need to change both the scaling and the arrangement of the buttons.
############## END CODING NOTES ##############
{/hide}
{center}{image:2301610}  {hide} ### PUT YOUR HEADER HERE ### {/hide}{/center}

{c:green}{i}{b}{size:4}Place a short introduction to your contest here.{/size}{/b}{/i}{/c}

{dropnote:"{image:2301607-50%}"}  {hide} ### The Basics  go on the next line ### {/hide}

{/dropnote}{dropnote:"{image:2301605-50%}"}  {hide} ### Prompts go on the next line  ### {/hide}

{/dropnote}{dropnote:"{image:2301600-50%}"}  {hide} ### Guidelines go on the next line ### {/hide}

{/dropnote}

{dropnote:"{image:2301603-50%}"}  {hide} ### Prizes go on the next line ### {/hide}

{/dropnote}{dropnote:"{image:2301601-50%}"}  {hide} ### How to Enter goes on the next line ### {/hide}

{/dropnote}{dropnote:"{image:2301608-50%}"}  {hide} ### What to Enter goes on the next line ### {/hide}

{/dropnote}

{dropnote:"{image:2301602-50%}"}  {hide} ### Past Winners### {/hide}

{/dropnote}{dropnote:"{image:2301599-50%}"}  {hide} ### Donors ### {/hide}

{/dropnote}{dropnote:"{image:2301597-50%}"}  {hide} ### Judging ### {/hide}

{/dropnote}

{hide} 
############## COUNTDOWN NOTES ##############
CONTEST COUNTDOWN
CUSTOMIZE WITH INFORMATION APPROPRIATE FOR YOUR CONTEST.
AS WRITTEN THE COUNTDOWN DOES THE FOLLOWING
          places a limit of TEN in entries
          Gives a closing date of August 7, 2023
          Specifies a countdown ending date of 8/7/2022 0800, i.e, 8AM WDC time, August 7, 2023
          Note that the date appears TWICE, once in the text and a second time in the countdown function.
          Currently shows seven entries, three open slots, both in text and in symbols
############## END COUNTDOWN NOTES ##############
{/hide}
{center}
{center}{b}{u}{s:30}{/u}{/b}{/center}  {hide} ### draws a line 30 spaces long ### {/hide}
Contest open for entries until we receive ten stories or {b}8:00AM August 7, 2023{/b}, whichever happens first. 
Assuming we don't close early, the contest closes in {b}{c:red}{code:countdown('8/7/2023 0800')}{/c}{/b}
{b}Seven {/b}entries so far.  {b}Three {/b} positions available.
{e:X}{e:x}{e:x}{e:x}{e:x}{e:x}{e:x}{e:notepady}{e:notepady}{e:notepady}
{center}{b}{u}{s:30}{/u}{/b}{/center}
Questions or comments about the contest?
please contact {hide} ### Your name here ### {/hide}
{/center}
{center}{b}{u}{s:30}{/u}{/b}{/center}

                                                           

Code for brush stroke, handwriting Contest Container, blue ▼

{hide} 
############## CODING NOTES 8/4/2024 ##############
  This file must be customized for your contest.
  Where it says ### <CONTENT> goes on the next line ### you have two options.
          use an  {insert:#########} to insert the number of a static item that has the content
          OR type the content directly into this file, starting on the "next line" as indicated.
We strongly recommend that you place your content in separate static items and use the first method.
The countdown information at the end must also be customized or can just be hidden  if you don't want to use it.
Additional buttons are available:
              {image:2301606-50%} RULES
              {image:2301604-50%} PROMPT (singular)
Buttons are scaled at 80% to fit two across the page. 
If you want to use the differently sized buttons you will need to change both the scaling and the arrangement of the buttons.
############## END CODING NOTES ##############
{/hide}
{center}{image:2301610}  {hide} ### PUT YOUR HEADER HERE ### {/hide}{/center}

{c:indigo}{i}{b}{size:4}Place a short introduction to your contest here.{/size}{/b}{/i}{/c}

{dropnote:"{image:2301637-80%}"}  {hide} ### The Basics  go on the next line ### {/hide}

{/dropnote}{dropnote:"{image:2301626-80%}"}  {hide} ### Guidelines go on the next line ### {/hide}

{/dropnote}
{dropnote:"{image:2301635-80%}"}  {hide} ### Prompts go on the next line  ### {/hide}

{/dropnote}{dropnote:"{image:2301628-80%}"}  {hide} ### Beneficiareis go on the next line ### {/hide}

{/dropnote}{dropnote:"{image:2301638-80%}"}  {hide} ### What to Enter goes on the next line ### {/hide}
{/dropnote}{dropnote:"{image:2301629-80%}"}  {hide} ### How to Enter goes on the next line ### {/hide}

{/dropnote}
{dropnote:"{image:2301633-80%}"}  {hide} ### Prizes go on the next line ### {/hide}

{/dropnote}{dropnote:"{image:2301632-80%}"}  {hide} ### Past Winners### {/hide}

{/dropnote}
{dropnote:"{image:2301706-80%}"}  {hide} ### Donors ### {/hide}

{/dropnote}{dropnote:"{image:2301631-80%}"}  {hide} ### Resources ### {/hide}

{/dropnote}


{hide}
############## COUNTDOWN NOTES ##############
CONTEST COUNTDOWN
CUSTOMIZE WITH INFORMATION APPROPRIATE FOR YOUR CONTEST.
AS WRITTEN THE COUNTDOWN DOES THE FOLLOWING
          places a limit of TEN in entries
          Gives a closing date of August 7, 2023
          Specifies a countdown ending date of 8/7/2022 0800, i.e, 8AM WDC time, August 7, 2023
          Note that the date appears TWICE, once in the text and a second time in the countdown function.
          Currently shows seven entries, three open slots, both in text and in symbols
############## END COUNTDOWN NOTES ##############
{/hide}
{center}
{center}{b}{u}{s:30}{/u}{/b}{/center}  {hide} ### draws a line 30 spaces long ### {/hide}
Contest open for entries until we receive ten stories or {b}8:00AM August 7, 2023{/b}, whichever happens first. 
Assuming we don't close early, the contest closes in {b}{c:red}{code:countdown('8/7/2023 0800')}{/c}{/b}
{b}Seven {/b}entries so far.  {b}Three {/b} positions available.
{e:X}{e:x}{e:x}{e:x}{e:x}{e:x}{e:x}{e:notepady}{e:notepady}{e:notepady}
{center}{b}{u}{s:30}{/u}{/b}{/center}
Questions or comments about the contest?
please contact {hide} ### Your name here ### {/hide}
{/center}
{center}{b}{u}{s:30}{/u}{/b}{/center}

                                                                               

How to rearrange the buttons in these templates ▼

WritingML is what is called a markup language.  This means you enter snippets of code into your text which, when displayed, results in a formatted text.  This is different from a WYSIWYG (what you see is what you get) editor like Word. The downside is that Word is better described as what you see is all you get.  Word has lots of features, but you're pretty much stuck with what the wizards at Microsoft think you need.

Anyway, WritingML is a markup language, and you're probably familiar with using markup to format your documents.  Even if you're not, you can rearrange the buttons in these template files. Below I've outlined hyper-detailed steps on how to do this.  Please don't be offended by the detail, and please be aware that there are some reasons for it.  In particular,  dropnotes add an order of complexity to your markup. The more complex your markup, the nastier it is to find and correct mistakes.  One reason for the detail is that we've had some experience with the ways things can go amiss when you want to rearrange the buttons.  Based on this experience, we've suggested some extra steps, like first arranging the buttons so the appear in one column.

Anyway, with that prelude, there is one important step you need to do BEFORE attempting to rearrange the buttons.

Make a BACKUP of the file, so if something goes wrong you can recover.  To make a backup, display the page you want to edit, and open it with the full screen editor.  Select the contents, press <CONTROL> C to make a copy of the contents in your paste buffer. Now open a new, blank document with your word processor or notepad.  In the new document, press <CONTROL> V, which will copy the contents of your paste buffer into this new file.  If something goes wrong in editing your contest, you can simply reverse this process to replace the contents of your contest file with the contents from this backup. 

You've got your backup done, right?  No?  Then do it now, before you read any further. It's inevitable something will go wrong and you'll be sorry you don't have a backup. 

Ok, we'll trust that you've really and truly backed up your file, so here is how to rearrange the buttons.

Step 1.  Write down the order in which you want the buttons to appear.
Step 2.  Open your file with the full screen editor and look for all the places where you see {/dropnote}{dropnote:} together, one one line, with no linefeed or or space between them.
Step 3.  Insert a linefeed (carriage return) between the  {/dropnote} and the {dropnote:}

{ If you save the file now and then display it, you will see all the buttons in a single column.
When the {/dropnote}{dropnote:} are together with no linefeed, your browser will try to display the two buttons on the same line.

Step 4.  The code for the buttons is now arranged in groups of three, with each group representing one button.  This makes them easier to rearrange in your desired order.

Carefully highlight a group of three that you want to move and press <CONTROL> X.
This erases the group of three, but saves it to your paste buffer (so it's not gone until you press another <CONTROL> X or <CONTROL> C.
Position the cursor where you want this button to appear on your list and press ENTER to be sure you start a new line.
Press <CONTROL> V to copy the group of three that you just deleted with the < CONTROL> X

STEP 5. Repeat this process until the groups-of-three are in the order you want.
STEP 6. Save the file and view it. You should see the buttons in the desired order in one long column.

If it doesn't display properly or they are in the wrong order, try editing the file to fix your mistake.
Most often the error is that one or more of your copy steps missed an open open { or a close }.
If all else fails, recover the original file from your backup and start over.

Step 7. If the file displays the buttons correctly and in the proper order, you're ready to put groups of buttons a single line.

To do this, edit the file in the full screen editor.
Find the {/dropnote} that ENDS the LAST dropnote on what you want to be your FIRST LINE.
Position the cursor at the end of that line and press <DELETE> until the {dropnote:"} that STARTS the the NEXT line of buttons is on the same line as the {{/dropnote}.
Be careful to NOT delete a { or } at this point.  If you've done it right, you'll see {/dropnote}{/dropnote:"}} on the same line.
Be careful to not split the text inside the double quotes of the {dropnote:"} tag. 

Step 8.  If you're extra careful, save and display the file to be sure this step worked.
Step 9.  Repeat steps 7 and 8 until the buttons are grouped and in the order you desire.

Compressed ZIP archives are available for the buttons and WritingML mentioned above as well as the 48 buttons mentioned in "Ideas on Page Design" .  You may download these from this location  .  This link expires on 9/9/2024, after which you should contact Max Griffin 🏳️‍🌈 to request a copies.

All text and images are © copyright 2023 by Max Griffin and are distributed under the provisions of the 

Creative Commons CC-BY-NC License  

which permits free use of the material in any medium or format for noncommercial purposes only, and only so long as attribution is given to the creator (for example, in text area of your WDC image file).