Author Topic: [Guide] Image Only Widget  (Read 12180 times)

0 Members and 1 Guest are viewing this topic.

TheNumbLock

  • Advisor
  • Councilor
  • **
  • Posts: 4776
  • Karma: +137/-5
    • View Profile
  • Twitch Name: TheNumbLock
[Guide] Image Only Widget
« on: October 25, 2015, 01:22:36 AM »
This guide will show you how to use the widget feature, but for those that just want the image to pop-up, instead of the full widget.

Video Guide:
https://www.youtube.com/watch?v=qlXBLan9jg4


Overview

The link you will need for all Image-Only Widgets, and I will show you how to customize the link so it works with your widget:

http://deepbot.tv/widgets/ImagePanel.htm?dur=5&test=1&panel=img&w=500&h=500

I will explain each variable after the ? after http://deepbot.tv/widgets/ImagePanel.htm?

  • dur=5 - This means how long, in seconds, do you want the widget to pop up for.
  • test=1 - This is to test the widget without doing the command, I recommend removing it.
  • panel=img - This is where you will put the widget name where "img" is. (E.g. panel=widget1)
  • w=500 - Is the width of the image.
  • h=500 - Is the height of the image.

Creating the widget

1. First off, we need to make a new command for the widget. You will be able to see an image of an example of a widget down below.
2. All you need by default is the command name, widget name, and image link in order for this to work.



3. Then we will need to edit the url to fit this widget. I take the widget name and put it in "panel=" then I put the dimensions of the image into the "w=" and "h=".

- http://deepbot.tv/widgets/ImagePanel.htm?dur=5&panel=widgettest&w=320&h=278

4. What it looks like when I run the command:

« Last Edit: June 07, 2016, 03:39:50 PM by jwhite8559 »
Old Name: RepentGamingTV
Twitch: Here

Need help ASAP?
Join Deepbot's Discord: Discord.Deepbot.tv
Deepbot's Twitter: @DeepSupport

Mokado

  • Youngling
  • *
  • Posts: 25
  • Karma: +0/-0
    • View Profile
  • Twitch Name: MokadoTV
Re: [Guide] Image Only Widget
« Reply #1 on: October 27, 2015, 03:34:24 AM »
Soo, in OBS i need to add that how? In CRL Browser?

EDIT: Just tested and it's not working for some reason. I added in CRL Browser this: http://deepbot.tv/widgets/ImagePanel.htm?dur=5&panel=cena&w=640&h=480

And in DeepBot it's like this: http://i.imgur.com/9btfeiy.png

Run the test and in chat/sound works but nothing popup in the stream.
« Last Edit: October 27, 2015, 03:50:00 AM by Mokado »

TheNumbLock

  • Advisor
  • Councilor
  • **
  • Posts: 4776
  • Karma: +137/-5
    • View Profile
  • Twitch Name: TheNumbLock
Re: [Guide] Image Only Widget
« Reply #2 on: October 27, 2015, 03:48:38 AM »
Soo, in OBS i need to add that how? In CRL Browser? (testing and messing around to see if it is)

Would be the url of the image only widget, then you put the dimensions into the CLR Browser. :o
Old Name: RepentGamingTV
Twitch: Here

Need help ASAP?
Join Deepbot's Discord: Discord.Deepbot.tv
Deepbot's Twitter: @DeepSupport

Mokado

  • Youngling
  • *
  • Posts: 25
  • Karma: +0/-0
    • View Profile
  • Twitch Name: MokadoTV
Re: [Guide] Image Only Widget
« Reply #3 on: October 27, 2015, 03:52:32 AM »
Soo, in OBS i need to add that how? In CRL Browser? (testing and messing around to see if it is)

Would be the url of the image only widget, then you put the dimensions into the CLR Browser. :o

I edit with all the things i changed and tested. Check on post before.

TheNumbLock

  • Advisor
  • Councilor
  • **
  • Posts: 4776
  • Karma: +137/-5
    • View Profile
  • Twitch Name: TheNumbLock
Re: [Guide] Image Only Widget
« Reply #4 on: October 27, 2015, 04:02:03 AM »
Using the wrong image link in the command, use this one: http://i.imgur.com/oraPgGM.gif

Needs to be the one without the download/imgur link at the bottom of the image.

Also try this url, if it still doesn't work:

http://deepbot.tv/widgets/ImagePanel.htm?dur=5&panel=cena&w=1028&h=715

So the dimensions in the CLR Browser would be 1028 x 715 (You may need to increase if getting scroll bars)

My command with your widget:

Old Name: RepentGamingTV
Twitch: Here

Need help ASAP?
Join Deepbot's Discord: Discord.Deepbot.tv
Deepbot's Twitter: @DeepSupport

Mokado

  • Youngling
  • *
  • Posts: 25
  • Karma: +0/-0
    • View Profile
  • Twitch Name: MokadoTV
Re: [Guide] Image Only Widget
« Reply #5 on: October 28, 2015, 03:31:26 AM »
Thanks, yeh the real problem was the link. Now i needed to make this for each sound if i wanted to have a gif....that's a lot Sources in OBS. Maybe in the future DeepBot would have something more easy for this matter :) Like TwitchAlerts have with multi alerts

But for now, it's freaking awesome....it's months i'm VIP in DeepBot and for sure will continue. Growing soo good :)

p00sebot

  • Youngling
  • *
  • Posts: 4
  • Karma: +0/-0
    • View Profile
  • Twitch Name: Pooseboy
Re: [Guide] Image Only Widget
« Reply #6 on: May 27, 2016, 02:30:20 AM »
Hey, I have been able to setup the widget with the original link but when I try to use the full image link and put my file in I just keep getting the test image. Could you let me know if im doing something wrong. Here is the link for the image, http://i.imgur.com/ycrY8PV.gif, and here is the link I made with your full image link, http://deepbot.tv/widgets/ImagePanel.htm?dur=5&test=1&panel=Unicorn&w=413&h=299

Thanks a bunch in advance,

I loooooooooove your bot <3,

Thanks a bunch!
Pooseboy

TheNumbLock

  • Advisor
  • Councilor
  • **
  • Posts: 4776
  • Karma: +137/-5
    • View Profile
  • Twitch Name: TheNumbLock
Re: [Guide] Image Only Widget
« Reply #7 on: May 27, 2016, 03:55:47 AM »
Hey, I have been able to setup the widget with the original link but when I try to use the full image link and put my file in I just keep getting the test image. Could you let me know if im doing something wrong. Here is the link for the image, http://i.imgur.com/ycrY8PV.gif, and here is the link I made with your full image link, http://deepbot.tv/widgets/ImagePanel.htm?dur=5&test=1&panel=Unicorn&w=413&h=299

Thanks a bunch in advance,

I loooooooooove your bot <3,

Thanks a bunch!
Pooseboy

Use this image link: http://i.imgur.com/ycrY8PV.gif
Use this URL then run the command to activate it: http://deepbot.tv/widgets/ImagePanel.htm?dur=5&panel=Unicorn&w=413&h=299
Old Name: RepentGamingTV
Twitch: Here

Need help ASAP?
Join Deepbot's Discord: Discord.Deepbot.tv
Deepbot's Twitter: @DeepSupport

p00sebot

  • Youngling
  • *
  • Posts: 4
  • Karma: +0/-0
    • View Profile
  • Twitch Name: Pooseboy
Re: [Guide] Image Only Widget
« Reply #8 on: May 27, 2016, 04:01:51 AM »
Thanks a bunch! Worked like a charm and your response was super fast, I cant wait to add a bunch of crazyness to my stream with this feature, I have so many idea's!

Deepbot for lifeee <3

Hope your Thursday has been awesome,

Pooseboy

The_Pr0taku

  • Youngling
  • *
  • Posts: 7
  • Karma: +0/-0
    • View Profile
  • Twitch Name: ThePr0taku
Re: [Guide] Image Only Widget
« Reply #9 on: April 05, 2017, 06:57:35 PM »
Hit a hiccup when trying this image

http://i.imgur.com/chlfMIZ.gifv

Could you guide me on the proper URL this 1st time & teach this man to fish? Thanx

TheNumbLock

  • Advisor
  • Councilor
  • **
  • Posts: 4776
  • Karma: +137/-5
    • View Profile
  • Twitch Name: TheNumbLock
Re: [Guide] Image Only Widget
« Reply #10 on: April 06, 2017, 05:46:34 AM »
Hit a hiccup when trying this image

http://i.imgur.com/chlfMIZ.gifv

Could you guide me on the proper URL this 1st time & teach this man to fish? Thanx

It is not too bad, but guide is here: http://wiki.deepbot.tv/image_only_widget

I will make an example of yours when I can.
Old Name: RepentGamingTV
Twitch: Here

Need help ASAP?
Join Deepbot's Discord: Discord.Deepbot.tv
Deepbot's Twitter: @DeepSupport