GMBinder for "Dummies"

Using GMBinder (and Homebrewery for some) can make quite the difference in the appearance of a project.  I get the impression however, that some might be intimidated by the need to know coding.

Well, I am no coder or programmer and I have been using GMBinder (somewhat) successfully for years now.  Almost everything I have done has been discovered through trial and error after copying and pasting code.  If you are interested in trying it yourself, I will have a sequence of small lessons here that allow you to skip over many of the mistakes I made.

I must repeat however, that I am not skilled in coding.  My trial-and-error training and my potentially bizarre methods mean there are likely far better ways to accomplish what I will demonstrate, and I just don't know them.  It's the best I can do, but I promise I will make it easy.

If you are interested, start with the following and then maybe give my first "lesson" on making a cover for your book!  Watch how hooked you get!

  1. Set up a GMBinder account. This is where it all begins.
  2. Set up an Imgur account.  You will need this for a place to host images.  Don't worry, I will show you how to use the necessary parts of Imgur when its needed.

Get ready for your first lesson in making your cover!


LESSON 1: Making a Cover

Step 1.  Open a new document in GMBinder and replace every bit of code with a Copy/Paste of the following:

<style>.phb hr + hr + section blockquote {column-fill: balance;}</style>
<style>
  .phb#p1:after { display:none; }
</style>
<div class='cover-diamond'></div>
<div class='cover-header'><font size=4>MAZTICA ALIVE! ON GMBINDER</div></font>
<div class='cover-footer'style='  width:100%; left:0px; top:930px;' /><font size=6>A Tutorial for those Who Can't Program :-) </font></div>
<div class='cover-footer'style='  width:100%; left:-350px; top:15px;' /><font size=3>TW?1</font></div>
<img 
  src='https://i.imgur.com/CxDIV9Z.jpg' class='cover-image' style=' position:absolute; width:100%; height: 100%;left:0px; top:0px;'  />
<img 
  src='https://www.gmbinder.com/images/f78qVYL.jpg' style='position:absolute;bottom:140px;left:360px;width:80px'  />
<style>
/* Background */
  .phb { background-image: url("https://www.gmbinder.com/images/QrLSPUv.jpg"); }
  .phb { background-size: cover; }
 /* Notes */
  .phb blockquote { background-color: #cfe7ce; }
/* Tables */
  table tr:nth-child(odd) td { background-color: #cfe7ce; }
  .phb hr+section blockquote tr:nth-child(odd) td {background-color:transparent; }
 /* Footer */
  .phb .pageNumber { color: #7e735c; z-index:1000; }
  .phb .footnote { color: #7e735c; }
  .phb:after { 
    height:125px;
    font-family: Lucida Handwriting;font-size: 0px; 
    background-image:url("https://www.gmbinder.com/images/YWardeu.png"), url(https://www.gmbinder.com/images/lLWeevR.png);
    background-size:816px 55px, 120px 120px;
    background-repeat:no-repeat, no-repeat;
    background-position:bottom, bottom right;
   
  }
</style>

\pagebreak


Step 2.  Some things to play with:


A.   TITLE:  Find the code for the title "MAZTICA ALIVE! ON GMBINDER" and change it to whatever you desire.

B.   TITLE SIZE: Adjust the font size if you wish by changing the number 4 in "<div class='cover-header'><font size=4>MAZTICA ALIVE! ON GMBINDER</div></font>" to another whole number.

C.   MOVE DMSGUILD LOGO: Find the following line of code "<img 
  src='https://www.gmbinder.com/images/f78qVYL.jpg' style='position:absolute;bottom:140px;left:360px;width:80px'  />" and change the 140 to 190 and 360 into 400.  Adjust this as you see fit.  You may also change "bottom" to "top" or "left" to "right".

D.   CHANGE FOOTER:  Find the words "A Tutorial for those Who Can't Program :-) " and replace it with whatever you wish.

E.   CHANGE TAG:  The "tag" which in this case I have TW?1 as a stand-in, is for Maztica Alive! campaign materials.  You can find the following line of code and delete it altogether if you don't want this.

<div class='cover-footer'style='  width:100%; left:-350px; top:15px;' /><font size=3>TW?1</font></div>

However, I have been going by TW for "True World" and a third letter that is usually the first letter of the author's last name.  It makes for an easy to organize system for both writers and readers, but it really isn't necessary.

F.    CHANGE ARTWORK/IMAGES:  The default cover is a nice piece of AI artwork made by 

AlanFrijns of Pixabay.  I'm sure its not the right cover for every project!  So, what you will first have to do is open Imgur.  Scroll over your name on Imgur and go to images.  Add an image using "Add Images" and then click on the image in your folder.  When you copy "Direct Link" you can replace it into the following code from above:


<img 
  src='https://i.imgur.com/CxDIV9Z.jpg' class='cover-image' style=' position:absolute; width:100%; height: 100%;left:0px; top:0px;'  />

Replace only the portion that reads https://i.imgur.com/CxDIV9Z.jpg.  Try not to accidentally replace the quotes.


Well, there is the first lesson for starting your own GMBinder Project!  There will be more to come soon!

Updated 01-18-24


LESSON 2: Headers, Formatting 1

It's late and I have to get up early for work tomorrow, but I figured I'd give a real quick tutorial on some formatting to get you started.  If you copy and paste the following, you can see the formatting resulting from each bit of code.  It will be self explanatory.

# Gmbinder Lesson Two

This is where I usually place a quote related to the book and give the briefest of descriptions.  No more than a few sentences, which I think gives it a nice aesthetic.
<br>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; - Seethyr 

<br>Note how the "br" code adds a line and the nbsp adds a space.  Additional hashtags (more than the one at the beginning) give the following types of headers.

## Major Headings

<br>

### Minor Headings

<br>

#### Table Headings

<br>

##### List Headings

<br>Also, you may create a box like the following...

<br>

>#### What Do you Want Here?
>I always use these for background information, but you can use it for anything you wish.

<br>

You may also want to use the following type...

<br>

<div class='descriptive'>

I use this for descriptions I give to the PCs or bits of conversation from NPCs.  Once again, that is up to you!

</div>

There is also this...

<br>

<div class='classTable'>

I use this for sidebars, like class tables and such.

</div>

<br>

Finally, if you just want to *italicize*, **bold** or ***bold and italicize*** check out the asterisk use.

Thus concludes the second lesson for GMBinder.  If you have any questions or want a specific lesson, let me know by contacting me or here in the comments.

Updated 01-21-24

Comments

Post a Comment

Popular posts from this blog

Workshop: PSS2 Monsters of the Spirit World (Released 1-21-24)

Image
There is currently something going on with Google Drive, such that images can no longer be shared into programs like GMBinder directly from the drive and this has pretty much put a hold on every one of my projects.  It's apparently a big issue and Google is working on it so I will just be patient. With that being said, I have other ways (such as using Imgur) to share images, I just don't feel like going back and replacing the dozens I already have set.  So instead, I am starting anew on a brand new project that I wasn't expecting to do. A new monster book! I am calling it Monsters of the Spirit World and it will be a "spiritual successor" (pun intended) to Morte's Planar Parade.  I want to update and create a whole new batch of creatures for the planes and terrestrial locales that haven't been seen yet in 5e anywhere.   This is a book for the True World, as they all are, but I also wanted to increase its reachability for those who have no interest in Mazti
Read more

Books by Seethyr

Image
The DMsGuild hosts each Maztica Alive! article and book and once a campaign reaches fifteen products, I like to organize them all into a singular bundle.  Here is each book organized by campaign and a tagging system I tried to model from TSR's back in earlier editions.  I us e "AN" to identify an  Anchôromé Campaign product, "MZ" to identify a  Maztica Campaign product, "LP" for Lopango, "PS" for the Planes and Stars and "TW" for additional books produced by other authors that don't necessarily fit within one of the campaigns.  The third letter of each tag really denotes the relative size and function of a product.  The letter "C" is used for campaign guides, "S" for larger supplements, such as monstrous compendiums or regional guides, "A" represents adventures and finally "M" represents articles and shorter supplements.  The system isn't perfectly defined and on occasion I have strugg
Read more

Newest Releases

Image
PSS3 Dark Payit There's a reason that Dark Payit didn't even appear hear in the Workshop at any point.  I had started working on this years ago and then abandoned the project even before Ravenloft was updated for 5e.  I picked up the 5e conversion recently and it inspired me to take the project back up and I managed to put together all the materials I had in a single evening.   The description on DMsGuild reads: A New Ravenloft Domain based off the setting of Maztica! Following the Era of the Immortals in Maztica came what was known as the Golden Age of Payit. This was a time of plenty for all of Maztica when humanity flourished. Payit and Far Payit both excelled in culture, developing in technology, medicine, astronomy and magic. Though this Golden Age has no official start or finish, the murder of the beautiful Princess Aliah was widely believed to be the herald of its downfall. Destined to marry her half-brother Xetl, a jealous suitor named Tacal who was himself prince of th
Read more