about

this is code / prompt that adds NovelAI-style HypeBot to the end of {{char}}'s response

the images below show:

  1. the original GooseAI in NovelAI (the first version of HypeBot)
    image failed to load : reload the page
  2. the customized HypeBot in the current NovelAI
    image failed to load : reload the page
  3. a replica in SillyTavern (this guide)
    image failed to load : reload the page
  4. multiple HypeBots in SillyTavern (this guide)
    image failed to load : reload the page

changelog

JUL-04 - tested and verified that HypeBot works under SillyTavern 1.12.3 (thanks: meat.rocket)
MAY-02 - fixed issue with greentext not using newlines -per-line, fixed CSS issue with native HypeBot extension (by NAI)
APR-30 - added "select tag" hint, fixed issue with CSS, fixed issue with recursive scan, fixed issue with 1.11.7 and 1.11.8 counting depth incorrectly. thanks: /chag/ anon, /chag/ anon, imΓ³tlok, ELEMAND
APR-29 - initial release

how-to

installation
  1. download this archive - DOWNLOAD LINK
  2. open Lorebook -> Import World Info -> import HypeBot_MLP.json
    image failed to load : reload the page
  3. activate HypeBot_MLP lorebook
    image failed to load : reload the page
  4. open Lorebook -> Activation Settings -> enable Recursive Scan and Match whole words
    image failed to load : reload the page
  5. open Settings -> Custom CSS -> put content of HypeBot_CSS.css
    image failed to load : reload the page
  6. open Extensions -> Regex -> Import Script -> import HypeBot_Regex_First.json and HypeBot_Regex_Second.json -> activate them both
    image failed to load : reload the page
  7. put HypeBot_images folder into SillyTavern\public\worlds folder
    image failed to load : reload the page

please note

HypeBot_images folder goes into public\worlds folder REGARDLESS of SillyTavern version
if you have SillyTavern 1.12.x you STILL must unpack HypeBot_images folder into public\worlds
create worlds folder if it doesn't exist

  1. done!
description of files:
  • HypeBot_MLP.json ( 75 MLP characters in total )
    • is a lorebook itself; contains the instructions how HypeBot must respond, and the information on each character, including their unique ID

  • HypeBot_CSS.css
    • is a CSS code (style) that is applied to HypeBot. LLM doesn't do any stylying at all ( no HTML/CSS render unlike Bloatmaxx).
    • also this code applies IMAGE and NAME to HypeBot's character based on their ID from Lorebook. for example ID zvs stands for Vinyl, hence the name Vinyl Scratch and image VinylScratch.png will be added to HypeBot's response via CSS (::after/::before properties)

  • HypeBot_Regex_First.json and HypeBot_Regex_Second.json
    • are two regex files that will prevent sending HypeBot comments to LLM; in other words - HypeBot will exist in chat (for you) but will not exist for LLM itself

  • HypeBot_images
    • are images for 75 HypeBot's characters. we are inserting them into SillyTavern itself instead of sideloading from catbox.moe to improve latency (and not using third-party services as CDN). this approach also allows us to easily modify image for any character without reuploading them

settings

who responds?

in Lorebook open WHO_RESPONDS? entry. here you can specify which character will post as HypeBot.

  • {{random:}} macros is supported and encouraged
  • multiple character can reply one by one
    image failed to load : reload the page

default is any character may reply and only once:

{{random:zrr,zfs,zaj,zpp,zrd,zts,zsp,zln,zcl,zcd,zsa,zfh,ztx,zsg,zss,zab,zsc,zsb,znm,zqc,zks,zlt,zcg,zdc,ztm,zdy,zho,zlr,zbb,zvs,zoc,zph,zbp,zrs,zdd,zmr,zmp,zlp,zzc,zmd,zmm,zch,znr,zmc,zth,zau,zsf,zfl,zso,zsu,zfp,zfr,zbr,zqp,zbm,zgs,zdt,zsn,ztw,zps,zwb,zgl,zgb,zgr,zem,ztr,ziw,zff,znt,zrh,zst,zml,zar,zaf,zpb}}

some examples of what you can do:

  • you want only somepony from M6 to respond:

    {{random:zrr,zfs,zaj,zpp,zrd,zts}}


  • ...somepony from M6, then someone from CMC:

    {{random:zrr,zfs,zaj,zpp,zrd,zts}}
    {{random:zab,zsc,zsb}}


  • ...somepony from M6, then someone from CMC then Trixie:

    {{random:zrr,zfs,zaj,zpp,zrd,zts}}
    {{random:zab,zsc,zsb}}
    ztx


  • ...Chrysalis first, then either Tirek or Sombra, then Tree Hugger

    zqc
    {{random:zlt,zks}}
    zth


  • Cozy Glow, then any random character

    zcg
    {{random:zrr,zfs,zaj,zpp,zrd,zts,zsp,zln,zcl,zcd,zsa,zfh,ztx,zsg,zss,zab,zsc,zsb,znm,zqc,zks,zlt,zcg,zdc,ztm,zdy,zho,zlr,zbb,zvs,zoc,zph,zbp,zrs,zdd,zmr,zmp,zlp,zzc,zmd,zmm,zch,znr,zmc,zth,zau,zsf,zfl,zso,zsu,zfp,zfr,zbr,zqp,zbm,zgs,zdt,zsn,ztw,zps,zwb,zgl,zgb,zgr,zem,ztr,ziw,zff,znt,zrh,zst,zml,zar,zaf,zpb}}


  • any three random characters:

    {{random:zrr,zfs,zaj,zpp,zrd,zts,zsp,zln,zcl,zcd,zsa,zfh,ztx,zsg,zss,zab,zsc,zsb,znm,zqc,zks,zlt,zcg,zdc,ztm,zdy,zho,zlr,zbb,zvs,zoc,zph,zbp,zrs,zdd,zmr,zmp,zlp,zzc,zmd,zmm,zch,znr,zmc,zth,zau,zsf,zfl,zso,zsu,zfp,zfr,zbr,zqp,zbm,zgs,zdt,zsn,ztw,zps,zwb,zgl,zgb,zgr,zem,ztr,ziw,zff,znt,zrh,zst,zml,zar,zaf,zpb}}
    {{random:zrr,zfs,zaj,zpp,zrd,zts,zsp,zln,zcl,zcd,zsa,zfh,ztx,zsg,zss,zab,zsc,zsb,znm,zqc,zks,zlt,zcg,zdc,ztm,zdy,zho,zlr,zbb,zvs,zoc,zph,zbp,zrs,zdd,zmr,zmp,zlp,zzc,zmd,zmm,zch,znr,zmc,zth,zau,zsf,zfl,zso,zsu,zfp,zfr,zbr,zqp,zbm,zgs,zdt,zsn,ztw,zps,zwb,zgl,zgb,zgr,zem,ztr,ziw,zff,znt,zrh,zst,zml,zar,zaf,zpb}}
    {{random:zrr,zfs,zaj,zpp,zrd,zts,zsp,zln,zcl,zcd,zsa,zfh,ztx,zsg,zss,zab,zsc,zsb,znm,zqc,zks,zlt,zcg,zdc,ztm,zdy,zho,zlr,zbb,zvs,zoc,zph,zbp,zrs,zdd,zmr,zmp,zlp,zzc,zmd,zmm,zch,znr,zmc,zth,zau,zsf,zfl,zso,zsu,zfp,zfr,zbr,zqp,zbm,zgs,zdt,zsn,ztw,zps,zwb,zgl,zgb,zgr,zem,ztr,ziw,zff,znt,zrh,zst,zml,zar,zaf,zpb}}


  • all M6 one by one. Twilight first, then Rara, then Flutters, then Dash, then Ponk, then AJ:

    zts
    zrr
    zfs
    zrd
    zpp
    zaj


the full list of characters and their IDs:

βŽ—
βœ“
zrr - Rarity
zfs - Fluttershy
zaj - Applejack
zpp - Pinkie Pie
zrd - Rainbow Dash
zts - Twilight Sparkle
zsp - Spike
zln - Princess Luna
zcl - Princess Celestia
zcd - Princess Cadence
zsa - Shining Armor
zfh - Flurry Heart
ztx - The Great and Powerful Trixie
zsg - Starlight Glimmer
zss - Sunset Shimmer
zab - Apple Bloom
zsc - Scootaloo
zsb - Sweetie Belle
znm - Nightmare Moon
zqc - Queen Chrysalis
zks - King Sombra
zlt - Lord Tirek
zcg - Cozy Glow
zdc - Discord
ztm - Tempest Shadow
zdy - Derpy
zho - Dr. Hooves
zlr - Lyra Heartstrings
zbb - Bon Bon
zvs - Vinyl Scratch
zoc - Octavia
zph - Photo Finish
zbp - Berry Punch
zrs - Rainbowshine
zdd - Daring Do
zmr - Marble Pie
zmp - Maud Pie
zlp - Limestone Pie
zzc - Zecora
zmd - Moondancer
zmm - Mayor Mare
zch - Cheerilee
znr - Nurse Redheart
zmc - Mrs Cake
zth - Tree Hugger
zau - Autumn Blaze
zsf - Spitfire
zfl - Fleetfoot
zso - Soarin
zsu - Sunburst
zfp - Fancy Pants
zfr - Filthy Rich
zbr - Braeburn
zqp - Quibble Pants
zbm - Big Mac
zgs - Granny Smith
zdt - Diamond Tiara
zsn - Silver Spoon
ztw - Twist
zps - Pipsqueak
zwb - Wallflower Blush
zgl - Gilda
zgb - Gabby
zgr - Grampa Gruff
zem - Ember
ztr - Thorax
ziw - Iron Will
zff - Flim and Flam
znt - Nightmare Rarity
zrh - Radiant Hope
zst - Sweetie Bot
zml - Molestia
zar - Aryanne
zaf - Anonfilly
zpb - Posey Bloom

replace images?

if you don't like any of default images for characters then replace them in HypeBot_images

  • you need PNG image with optional transparent layer
  • file size doesn't matter
  • resolution doesn't matter as well because CSS will scale it, but all images are 350x350 by default
    • don't do really huge images (2000x2000+) it may lag your browser

I used the following prompt while looking for images on Derpibooru:

Applejack, score.gte:100, -my little pony: the movie, -movie accurate, -equestria girls, -human, -younger, -older, -g.4.5, -g4.5 to g4, -g4 to g1, -g4 to g2, -g4 to g3, -g4 to g5, -palette swap, -recolor, -colored, -species swap, -alicornified, -bat ponified, -rule 63, -text, -mouth hold, -alternate universe, -alternate hairstyle, -animated, simple background, solo, vector, safe

( change Applejack and score.gte:100 to your needs )


replace names?

you can replace character's name by editing custom CSS. look for content

for example by default HypeBot says "Queen Chrysalis". if you want to HypeBot say "Chryssy" instead, then change:

[class*='hypebot-zqc']::before {content: 'Queen Chrysalis';}

to

[class*='hypebot-zqc']::before {content: 'Chryssy';}


reply mode?

each HypeBot character may reply in one of three modes (picked on random): quip, shitpost or greentext

  1. quip (50% chance) - HypeBot is tryingβ„’ to reply as the canon/fanon character would reply
  2. shitpost (25% chance) - more shits and giggles with memes, 4chan and brony humor
  3. greentext (25% chance) -
    >classic
    >greens
    >as we all
    >love

you can edit the chances per each character, open lorebook and look for the line:

{{random:greentext,shitpost,quip,quip}}

image failed to load : reload the page

edit the random chances in the way you like
for example if you want Twilight Sparkle to shitpost with 60% chance and quip with 40% then do:

|Twilight Sparkle|zts|{{random:shitpost,shitpost,shitpost,quip,quip}}||

if you want Anonfilly to write greentext only then do:

|Anonfilly|zaf|greentext|Chronic 4chan shitposter trapped in a filly body|


character's personality?

you can add extra notes to any characters to help LLM into generating a certain type of replies for this characters.

  • I have added the notes only to the characters I have noticed LLM has trouble to get right

notes are at the end of character's description:
image failed to load : reload the page

for example Cozy Glow by default has the following note:

|Cozy Glow|zcg|{{random:greentext,shitpost,quip,quip}}|Mastermind villain with a cute child vibes|

if you want Cozy to be more of fanon semen demon then do something like:

|Cozy Glow|zcg|{{random:greentext,shitpost,quip,quip}}|Loli semen demon who really likes to tease|

if character has no notes then you can add them manually, for example Braeburn has no notes:

|Braeburn|zbr|{{random:greentext,shitpost,quip,quip}}||

instead add something like:

|Braeburn|zbr|{{random:greentext,shitpost,quip,quip}}|Closed gay (but everypony knows it)|


reply in other languages?

yes you can make HypeBot to reply in other language than English
I found that the best place for an instruction is in __PROMPT_END right before an example:
image failed to load : reload the page

example of HypeBot in russian:
image failed to load : reload the page

adding a new character

you can add a new HypeBot character, including non-pony one. follow these steps:

  1. create a new entry for the character
    starting with ST 1.11.8 you can DUPLICATE entries

image failed to load : reload the page

  • give it a title, for example GOKU
  • status: 🟒
  • position: @D
  • depth: 0
  • order: 515
  • trigger: 100%
  • Primary Keywords: hypebot
  • Logic: AND ANY
  • Optional Filter: unique ID
    ID can be any unique combination of characters for example werwv or fvwepoj or zzgoku
  • Scan Depth: 1

image failed to load : reload the page

  • Content: in format:
    |title|ID|reply_mode|description|
    for example:
    |Goku|zzgoku|{{random:shitpost,quip}}|Goku from DBZ. Use lots of DBZ material and words. Extremely racist|

image failed to load : reload the page


  1. now create an image for HypeBot character
  • PNG image with optional transparent layer
  • resolution - any, but don't create a huge image, better keep it at 350x350
  • give a unique name, for example RacistGoku
  • put into HypeBot_images folder
    image failed to load : reload the page

  1. edit CSS file
  • scroll CSS file and look for the block
    βŽ—
    βœ“
    1
    2
    3
    /* ----------- */
    /* don't edit below this line */
    /* ----------- */
    
  • right ABOVE this block create CSS style with the content
    βŽ—
    βœ“
    [class*='hypebot-ID']::before {content: 'character name';}
    [class*='hypebot-ID']::after {background-image: url('worlds/HypeBot_images/name of image.png');}
    
  • for example:
    βŽ—
    βœ“
    [class*='hypebot-zzgoku']::before {content: 'Goku';}
    [class*='hypebot-zzgoku']::after {background-image: url('worlds/HypeBot_images/RacistGoku.png');}
    

  1. that's it. now test your character
  • open WHO_RESPONDS?
  • place here character's unique ID
    image failed to load : reload the page
  • generate a message
    image failed to load : reload the page

troubleshooting

cannot get a HypeBot's response

  1. set Max Response Length (tokens) to value X (say 800)
  2. instruct LLM to generate X/2 words of story (400), for example:
    • write between 300 and 500 words
    • limit writing to 400 words
    • I will provide a creative narrative of 400 words
    • I will now generate 400 words, making sure to end with a full sentence
  3. if didn't work then it is JB issue

HypeBot uses incorrect tags causing images to not work

~~ fix by this anon

usually happens with JB that adds lots of information after the chat like Anon4Anon
open WHO_RESPONDS? -> add select tag: before actual tags

image failed to load : reload the page

FAQ

does it require NAI subscription?

no


does it use GooseAI or NAI's HypeBot?

no it uses your current LLM (Claude, GPT, Gemini, Locals...)
tested on Sonnet, Opus, Claude 2.0


difference from SillyTavern's HypeBot extension?

  1. the extension needs NAI subscription
  2. the extension uses HypeBot LLM

how does it work?

  1. the prompt instructs LLM to respond in {{char}} as usual
  2. once response is completed, LLM proceeds to reply as HypeBot
  3. picks the characters you have specified in lorebook (or pick on random)
  4. LLM outputs simple HTML code
  5. LLM takes role of specified character and comment as HypeBot
  6. CSS styles are applied to HypeBot's response
  7. regex prevents sending HypeBot's response back to LLM on new prompt

HTML bloat?

no. HTML is as simply as below. all heavylifting is done by CSS:

βŽ—
βœ“
<hypebot>
<div class='hypebot-zpp'>
<p>text</p>
</div>
<div class='hypebot-zcd'>
<p>text</p>
</div>
<div class='hypebot-zqc'>
<blockquote>
>greentext 
>greentext
</blockquote>
</div>
</hypebot>

do I need to change something in my JB? add into prefill?

no extra requirements, it works as a stand-alone module with any preset


do I need to manually delete HypeBot's response before sending a new prompt/message? does it affect/polute the story?

no, HypeBot's response are NOT sent to LLM, while they still present in chat (regex takes care of it)


why two regexes?

because sometimes LLM generates text as:

βŽ—
βœ“
1
2
3
4
5
<hypebot>
<div class='hypebot-zpp'>
<p>text</p>
</div>
</hypebot>

and sometimes just

βŽ—
βœ“
1
2
3
<div class='hypebot-zpp'>
<p>text</p>
</div>

it makes sense to first remove all <div class='hypebot-ID'>...</div> (1st regex) and then remove leftover <hypebot>...</hypebot> (2nd regex). they totally can be merged together with lookahead regex, I just didn't think about it and then caught the case of being lazy


why character tags start with z?

to avoid accidental trigger by the common short words
for instance, Marble Pie has mr tag. it means that if prompt has the word ""mr"" (""mister"") then it will activate Marble Pie's response in HypeBot which is an unintended behavior. same for other short words: cd, tm, vs, mc, so, em, fr, oc, ho, au, etc
the english letters Z/X are the least common letters to start the word with. I run with Z because X makes anything cool and I wanted to go against the trend


why Lorebook and not regular prompt?

easier modding than prompt
no need to send all characters every prompt
you can switch between various presets without affection HypeBot


why [class*='HypeBot'] and not simple .HypeBot?

to cover both .HypeBot and .custom-HypeBot classes (blame ST)


mobile ST support?

yes (basic)


Agnai or Risu support?

no. Lorebook is too complicated for them, no regex support, no options to inject local images


can I add my own characters?
can I use non-pony HypeBots?
can I use non-pony HypeBots for pony stories?
can I use pony HypeBots for non-pony stories?

yes yes yes yes

cases / notes

  1. the simplest and most obvious usage - keep HypeBot for funnies
  2. rewrite HypeBot lorebook to act as an advice provider
    instead of storytelling and quips, HypeBot will offer insights on your next steps
  3. rewrite HypeBot to be centered on a specific type of narrator (use notes)
    for example - Pinkie Pie who always breaks 4th wall, or Rarity is constantly bend over horny
  4. certain narrators work the best for certain genre
    for smuts, Cadence and Trixie deliver the most sassy quips
    rational Applejack and Twilight are good in schizo stories for contrast
  5. use HypeBot X with character while talking with X as {{char}} in chat
    for instance, if you're chatting with Fluttershy, assign HypeBot as Fluttershy; this way HypeBot will act as {{char}}'s inner thoughts
    image failed to load : reload the page

    additionally, HypeBot can deduce characters' connections. if you chat with Flutterbat and use Fluttershy as HypeBot, the latter may recognize Flutterbat as herself and offer meta commentary
    image failed to load : reload the page

image failed to load : reload the page
image failed to load : reload the page
image failed to load : reload the page
image failed to load : reload the page

issues

those issues are mostly prominent on Sonnet and 2.0, less on Opus and 2.1

1. HypeBot can be inserted in the middle of a message or multiple times in a single message
image failed to load : reload the page

2. HypeBot characters may be inserted into story itself ( {{char}} and {{user}} may interact with them )

3. HypeBot characters may talk to each other and acknowledge each other

OLD VERSION

DONT USE ANYTHING BELOW THIS LINE

I left if here for archive/preservation reasons, not for actual usage

how-to

  1. grab CSS code, and put into custom CSS
  2. @EDIT two things in CSS: name and image. ensure the image is a square vector, hotlink to catbox
  3. grab prompt. and create a separate template for it
  4. edit two things in the prompt: narrator and text itself (optionally)

install

step 1. CSS

put the following CSS into Custom CSS

βŽ—
βœ“
/************************/
/*** NAI-like HypeBot ***/
/************************/

/* ----------- */
/* edit these two things */
/* ----------- */
[class*='HypeBot']::before {
  content: 'Luna'; /* @EDIT name */
}
[class*='HypeBot']::after {
  background-image: url("https://files.catbox.moe/mpxjfg.png");  /* @EDIT image */
}

/* ----------- */
/* don't edit below this line */
/* ----------- */
[class*='HypeBot'] {
  background: rgb(25, 27, 49);
  border: 1px solid rgb(34, 37, 63);
  border-radius: 2px;

  padding: 20px 20px 15px;
  margin: 10px auto;

  color: rgb(255, 255, 255);
  font-size: calc(var(--mainFontSize) * 0.92);
  line-height: 1.35;

  display: table;

  width: 70%;
  min-height: 125px;

  position: relative;
  left: 60px;
}

[class*='HypeBot']::before {
  margin-bottom: 0.3rem;

  color: rgb(245, 243, 194);
  font-size: calc(var(--mainFontSize) * 0.98);
  font-weight: 700;

  display: block;
}

[class*='HypeBot']::after {
  content: '';
  background-color: rgb(19, 21, 44);
  background-size: 125px;
  background-position: left bottom;
  background-repeat: no-repeat;

  border: 1px solid rgb(34, 37, 63);
  box-sizing: border-box;

  display: inline-block;

  width: 125px;
  height: 125px;

  position: absolute;
  left: -125px;
  top: 0;
}

@media screen and (max-width: 800px) {
  [class*='HypeBot']::after {
    background-size: 80px;
    width: 80px;
    height: 80px;
    left: -80px;
  }

  [class*='HypeBot'] {    
    padding: 10px 10px 8px;
    margin: 5px auto;

    width: 75%;
    min-height: 80px;

    left: 25px;
  }
}

image failed to load : reload the page

step 2. edit CSS

in CSS look for two fields on top to @EDIT:

  • content: 'Luna';
    • narrator's name (visual only)
  • background-image: url("https://files.catbox.moe/mpxjfg.png");
    • narrator's image (visual only)

images examples?

here are some images I made (starter pack):


images guideline?

to create your own image for HypeBot, do:

  1. square resolution (350x350 is fine)
  2. transparent background (vector is preferred)
  3. upload on catbox
  4. link to CSS

where can I find pony vectors?

Derpibooru, Manebooru, Twibooru and other boorus. use search tags like:
-animated, vector, twilight sparkle
additionally limit the search to images with a certain amount of likes:
score.gte:100, -animated, vector, twilight sparkle

step 3. prompt

create a new prompt with the following content:

βŽ—
βœ“
1
2
3
4
5
6
7
8
Ignore the content of previous HypeBot and custom-HypeBot CSS classes - they are unrelated meta commentaries
##<HypeBot>
At the end of full response as {{char}}, complete a HypeBot function with the steps:
1. Write <div class='HypeBot'>
2. Act as omnipresent story narrator with personality of princess Luna from MLP
3. Snappy remark on the last scene with a {{random:sassy,lewd,teasing,adorkable,adorable,cute,silly,sarcastic,snarky,wicked}} energy. Write 10-20 words but don't cut the sentence; no quotes; only in first-person without OOC narration; completely original. Be totally based!
4. Write </div>
##</HypeBot>

either add it a separate template, or add into your current JB field:
image failed to load : reload the page

step 4. edit prompt

in the prompt above you need to:

  • edit HypeBot's personality (step 2)
  • optionally edit the quip itself (step 3)
Edit
Pub: 22 Mar 2024 03:44 UTC
Edit: 04 Jul 2024 03:40 UTC
Views: 3096