TyranoBuilder Visual Novel Studio Guide

Adding Backlog To The Menu for TyranoBuilder Visual Novel Studio

Adding Backlog To The Menu

Overview

You all wanted the backlog/history added to the menu, here is the steps you need to take in order for it to work!

Outline and what you will need

What this Does

If you follow these steps for your project then when you or your readers goes to the in game menu of your game they will have the option to look at all the past text and then be able to resume their game from the spot they left off.

What will need to be changed

While we will be editing rather complex things what we will be adding is not complex itself so it is doable as long as you are able to open the files that we need to edit, below will list the files and their respective locations.

All file locations will be within your project folder so we are only including the filepaths after that point.

  • menu.html : tyranohtml
  • kag.menu.js : tyranopluginskag
  • lang.js : tyrano

Images:

  • menu_button_backlog.gif : tyranoimageskag

*NOTE you will have to make this image and place it in this folder, we suggest you use the same size of 300×40 as the other buttons. (in our guide we will be just copying one of the other buttons and having it as a placeholder)

Editing the Menu.html

Alright so go to were the menu.html file is (tyranohtml in case you didnt read the first section… shame on you)

Right click on menu.html and ether click “Edit” or “Open With” (if you select Open with you can ether select your preferred app to open text files or you can use what we are using which will be notepad)

Once you have the file open it should look something like this
We are going to add that last line before the /div

Which you can copy here:

<div class=”menu_item menu_backlog”><img src=”tyrano/images/kag/{{:novel(“file_menu_button_backlog”)}}” /></div>

Time to edit the next file so that this works!

Editing the kag.menu.js

The kag.menu.js is located in tyranopluginskag

Just like with the menu.html you will need to right click and open the file for editing and should see a screen like this:If you dont have an editor like dreamweaver or another program that organizes the lines for you then this might look overwhelming, just make sure you have wordwrap unchecked like in the image as we will be adding the next bit of code to the third line.

When you are on the third line post this to the start of the line:

layer_menu.find(“.menu_backlog”).click(function(e){that.displayLog()});

If you want to make a 100% sure you are on the right part, hit Ctrl+F on your keyboard and search for:

layer_menu.find(“.menu_load”)

you will be putting the line of code right before that.

Now on to the next file!

Editing the lang.js

The lang.js is located in tyrano

Just like with the menu.html and kag.menu.js you will need to right click and open the file for editing and should see a screen like this:
and you will be adding the code

“file_menu_button_backlog”:”menu_button_backlog.gif”,

right after this bit

“file_menu_button_title”:”menu_button_title.gif”,

just make a line below it and add in that code.

Making the menu_button_backlog.gif

You can make the button and place it in this folder, we are going to show you how to make a placeholder in the meantime.

Lets go to the folder:tyranoimageskag in it you will already seen many of the other menu buttons; you will need to right click on one of these buttons (we picked the menu_button_save.gif for our placeholder) and click “Copy” as seen in this image:
then you will need to right click again in a blank space and click paste, this will make the same file you copied but with -copy behind the name

Go ahead and right click on the image you just made a rename it: menu_button_backlog.gif

Now we get to try it out!

Final and Testing

Congrats on Editing those files and now the fun part, go into tyranobuilder for the project you just edited, save the game, and preview it. through the preview you should now be able to go to the menu and you will see your new button added there like below:
But without the orange arrows ofcourse.

and if we were successful in adding then when you click the link it should open your backlog which will show and text that has been displayed

SteamSolo.com