Custom Notification WorkShop

[TinyxDestiny]

I don't know why it comes up a squished. D:

[TheNumbLock]

I don't know why it comes up a squished. D:

Yeah. Idk. If you have another font, I can input it, into the CSS.

Uhh yeah, you can switch it out technically, but might want to match sizes with the current image. I can always adjust it with a new image/gif.

[IronPhoenix87]

GameWisp Sub Alert

Image Link: imgur.com/CgQ0CMd.png
Font Style/Link: Comic Sans MS BOLD
Font Color: White - or add any colour easy to read - surprise me if you want
Any text fill/boarder?: no
What do you want the alert to say?(Text Options: Sub Name, Sub months, New Sub, Sub Tier): New Subscriber IronPhoenix87 on "Tier" and IronPhoenix87 Re-Subscribed for "sub months" on "tier"
Example (If applicable): N/A
Anything else?: I think that is about it, just the Sub and Re-Sub message

[TheFieryPhoenixTV]

Donation:
I am trying to switch my same Twitch Alerts notification for Deepbot to recognize

Image/Gif: https://media.giphy.com/media/amaS2ywWuJsXe/giphy.gif
Font Style: Open Sans
Font Color: Red
Text Fill: No
Alert To Say: User Just Added "Amount" Dollars to the Tip Jar!

Hopefully this is even possible.

[TheNumbLock]

Requested by: TheFieryPhoenixTV

Donation:

Link: http://deepbot.tv/notifications/donationnotification2.htm
Width: 600
Height: 600

CSS Code:

Code: [Select]

#donor-notification {
position: absolute;
top: 80px !important;
left: 0px !important;
width: 499px !important;
height: 439px !important;
background-repeat: no-repeat;
background-size: contain !important;
background-image: url('https://media.giphy.com/media/amaS2ywWuJsXe/giphy.gif') !important;
overflow: ahidden !important;
}
#donor-notification .header {
visibility: hidden !important;
}
 
#donor-notification .date {
visibility: hidden !important;
}
 
#donor-notification .streamname {
visibility: hidden !important;
}
 
#donor-notification .message {
visibility: hidden !important;
}
#donor-notification .amount {
position: absolute;
margin-top: -50px !important;
margin-left: -300px !important;
width: 400px !important;
padding-top: 0px !important;
text-align: center !important;
font-weight: normal !important;
font-size: 40px !important;
font-family: Open Sans !important;
color: red !important;
text-transform: capitalize;
-webkit-text-stroke-color: white;
-webkit-text-stroke-width: 0px;
text-shadow: 3px !important;
}
#donor-notification .donor {
position: absolute;
margin-top: -100px !important;
margin-left: -200px !important;
width: 600px !important;
text-align: center !important;
font-weight: normal !important;
font-size: 40px !important;
font-family: Open Sans !important;
color: red !important;
text-transform: capitalize;
-webkit-text-stroke-color: black;
-webkit-text-stroke-width: 0px;
text-shadow: 3px !important;
}
 
.donor:after {
content: ' Just Added ';
}

.amount:after{
content: ' Dollars to the Tip Jar!';
}

Preview: (If there is a black background, it is just my background.)

[Danetaff]

Image Link: http://giphy.com/gifs/wolf-lZ6l2pBjRCmd2
Font Style/Link: Papyrus
Font Color: Red (Like a Burgundy)
Any text fill/boarder?: @user@ has joined the pack! Welcome to the family.
Where do you want text located? (Follower Name): Under image
Example (If applicable):
Anything else?: Would it be possible to have a soundbite of a wolf howl at all? Much appreciate it.

[TheNumbLock]

Image Link: http://giphy.com/gifs/wolf-lZ6l2pBjRCmd2
Font Style/Link: Papyrus
Font Color: Red (Like a Burgundy)
Any text fill/boarder?: @user@ has joined the pack! Welcome to the family.
Where do you want text located? (Follower Name): Under image
Example (If applicable):
Anything else?: Would it be possible to have a soundbite of a wolf howl at all? Much appreciate it.

Do you have a link to the font?

You can add the sound byte yourself. On deepbot go to config Tab > Follower Notification Settings

[Danetaff]

The one that I can find for the papyrus font is

http://psdbundle.com/2012/09/papyrus-font-download-free/

[TheNumbLock]

Requested by: Danetaff

Follower:

Link: http://deepbot.tv/notifications/follownotification1.htm
Width: 600
Height: 650

CSS Code:

Code: [Select]

#follow-notification {
display: none;
position: absolute;
top: 0px !important;
left: 0px !important;
width: 500px !important;
height: 477px !important;
border-radius: 00px !important;
background-size: contain !important;
background-image: url('https://media.giphy.com/media/lZ6l2pBjRCmd2/giphy.gif') !important;
background-repeat: no-repeat;
}

#follow-notification .header {
visibility: hidden !important;
}

#follow-notification .followname {
position: absolute !important;
text-align: center !important;
margin-top: 460px !important;
margin-left: 10px !important;
width: 500px !important;
font-size: 40px !important;
font-weight: normal !important;
font-family: Papyrus Regular !important;
color: #900020 !important;
text-transform: capitalize;
-webkit-text-stroke-color: #00aced;
-webkit-text-stroke-width: 0px;
text-shadow: 0px white !important;
}

.followname:before {
content: '' !important;
}

.followname:after {
content: ' has joined the pack! Welcome to the family.' !important;
}

Preview: (If there is a black background, it is just my background.)

[Danetaff]

Thank you so much!!! You are awesome!

[Danetaff]

Host Alert

Image Link: http://giphy.com/gifs/black-and-white-wolf-O0HhZMRum7ecU
Font Style/Link: http://psdbundle.com/2012/09/papyrus-font-download-free/
Font Color: Red (like Burgundy or maroon again)
Any text fill/boarder?: Has brought in more wolf cubs! Thanks for the host!
What do you want the alert to say?(Text Options: Host Name, Amount of Viewers): Both Host name and viewers
Example (If applicable): @user@ has brought in (viewercount) wolf cubs! Thanks for the host!
Anything else?:

[TheNumbLock]

Requested by: Danetaff

Host:

Link: http://deepbot.tv/notifications/hostnotification.htm?w=495&h=311 (Use this link to test it: http://deepbot.tv/notifications/hostnotification.htm?w=495&h=311&test=1 )
Width: 520
Height: 500

CSS Code:

Code: [Select]

body {
    background-color: transparent;
    color: white;
}
#host-notification {
    top: 0px;
    left: 0px;
    width: 300px;
    height: 200px;
    border-radius: 0px !important;
    background-image: url(https://media.giphy.com/media/O0HhZMRum7ecU/giphy.gif) !important;
    background-repeat: no-repeat;
    overflow: visible !important;
}
#host-notification .hostname {
    margin-top: 280px !important;
    text-align: center;
    width: 500px !important;
    font-size: 36px !important;
    font-family: Papyrus Regular !important;
    text-shadow: none !important;
    color: #900020 !important;
}
.hostdiv {
    text-align: center;
    vertical-align: middle;
    margin-top: 0px !important;
    margin-left: 2px;
    text-shadow: none !important;
    color: #900020 !important;
    border-radius: 50%;
    width: 500px !important;
    height: 38px;
    line-height: 36px;
    background: #0000;
    border: 0px solid #F00 !important;
    font: 30px Papyrus Regular !important;
    -webkit-transform: rotate(0deg) !important;
}
.hostnumber {
    position: absolute !important;
    margin-top: 360px !important;
    margin-left: -250px !important;
    top: 0 !important;
    font-family: Papyrus Regular !important;
    font-size: 36px !important;
    color: #900020 !important;
    text-shadow: none !important;
    width: 500px !important;
}
#host-notification .header {
    text-align: center;
    width: 500;
    vertical-align: top;
    font-size: 36px !important;
    line-height: 26px;
    font-family: Papyrus Regular !important;
    text-shadow: none !important;
    text-decoration: underline;
    color: #900020 !important;
    visibility: hidden;
    padding-top: -50px;
}
.hostname:after {
    content: ' has brought in' !important;
}
.hostnumber:after {
    content: ' wolf cubs! Thanks for the host!' !important;
}

Preview: (If there is a black background, it is just my background.)

[Charanor]

Heyhou,

i want a Notification for myself, have an Video what i want as Notification, what i need to do now?

Greetings Charanor

[TheNumbLock]

Heyhou,

i want a Notification for myself, have an Video what i want as Notification, what i need to do now?

Greetings Charanor

I don't think I can do videos, I can try. I can do a .gif if anything.

[Charanor]

Heyhou,

i want a Notification for myself, have an Video what i want as Notification, what i need to do now?

Greetings Charanor

I don't think I can do videos, I can try. I can do a .gif if anything.

Image/Gif: https://media.giphy.com/media/3o85xHHIuOXl0QzUWI/giphy.gif
Font Style: Metric (German Metrisch)
Font Color: Neon Green (in your profil picture the green is the same)
Text Fill: yes under the picture
Alert To Say: Danke (Name) für deine Donation (Amount)!
 
thats my Stream style for colors or something: https://www.dropbox.com/s/m3acmpjlc3ghep7/Overlay%20world%20of%20tanks.png?dl=0