The forum of the forums
Welcome to the Official Support Forum of Forumotion!

To take full advantage of everything offered by our forum, please log in if you are already a member, or join our community if you've not yet.



Create a free forum like this one.

Chatbox Image

View previous topic View next topic Go down

Solved Chatbox Image

Post by ShowStopper on March 17th 2012, 12:42 pm

I have the pop-up chatbox installed, as in this link: http://help.forumotion.com/t88458-how-to-create-a-pop-up-chat-box-fmchat

I want to edit the CSS code so that instead of a small box in the lower right, it's a picture of my choosing. What code do I have to use for this?


Last edited by ShowStopper on March 30th 2012, 5:33 am; edited 1 time in total

ShowStopper
Forumember

Female Posts : 68
Reputation : 1
Language : English | HTML | Javascript | CSS

http://heroesnetwork.forumotion.net

Back to top Go down

Solved Re: Chatbox Image

Post by Niko on March 17th 2012, 2:15 pm

Hi!

Can you provide your URL?
thanks Smile

Friendly,

Niko
Hyperactive

Male Posts : 2163
Reputation : 93
Language : English, French, Italian, Spanish, Latin

https://www.translationscloud.com/?utm_source=forumotion&utm

Back to top Go down

Solved Re: Chatbox Image

Post by ShowStopper on March 17th 2012, 3:00 pm

1. The entire forum is private, and I made sure that the chatbox can only be seen by logged-in users.

2. I currently have FMChat deactivated for now.

3. Seeing as how I am asking a general question about CSS code, the link my forum is irrelevant. I just want to know how to put links to images in CSS, so that I could do that with FMChat.

4. The link to my forum is in my profile.

ShowStopper
Forumember

Female Posts : 68
Reputation : 1
Language : English | HTML | Javascript | CSS

http://heroesnetwork.forumotion.net

Back to top Go down

Solved Re: Chatbox Image

Post by Sir Chivas™ on March 17th 2012, 4:24 pm

Do you wish to put an image in your background (chatbox)?



Attention!
- Please provide your forum URL at all times.
- When the issue is solved, please mark it as solved.



Sir Chivas™
Support Moderator
Support Moderator

Male Posts : 6756
Reputation : 428
Language : English, Spanish, and French
Location : || CSS || HTML || Graphics Designs || Support ||

Back to top Go down

Solved Re: Chatbox Image

Post by Guest on March 17th 2012, 5:40 pm

Hi!

I have few links for you below:
Customizing chatbox's design: http://help.forumotion.com/t77136-customize-chatbox
All information about and how works the forumotion chatbox: http://help.forumotion.com/t3343-the-chatbox
Create a link to chatbox: http://help.forumotion.com/t52768-create-a-link-to-your-chatbox-rules

I think first link is what you want...

Guest
Guest


Back to top Go down

Solved Re: Chatbox Image

Post by ShowStopper on March 18th 2012, 3:25 am

It's FMChat as a pop-up chat, like what is on this forum: www.smokinelite.com However, instead of the cool picture in the lower-right corner like smokinelite.com has, I just have a plain box. I know how to change the colors of the box, but I actually want to make it look just like the one in smokinelite.com.


Last edited by ShowStopper on March 18th 2012, 3:36 am; edited 1 time in total

ShowStopper
Forumember

Female Posts : 68
Reputation : 1
Language : English | HTML | Javascript | CSS

http://heroesnetwork.forumotion.net

Back to top Go down

Solved Re: Chatbox Image

Post by ShowStopper on March 18th 2012, 3:43 am

I used the newest HTML code, though, and it is version 3.4.

I used Javascript to make it show up everywhere I wanted to with this code in the javascript codes management:
Code:
document.write('<script type="text/javascript" src="http://fmquery.forumotion.com/h1-fmchatjs"></script><div id="FMChatBase" class="chatbase" onclick="openClose()" ><span style="font-weight: bold; line-height: 2em; font-size: 11px;">ChatBox</span></div><div id="chat" style="display: none;"><iframe id="FMChat" name="FMChat" onload="FMChatLoad();" style="border: none; border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px;" src="/chatbox" width="100%" height="100%"></iframe></div>')

And put this in the CSS Stylesheet:
Code:
 /*FMChat Design*/
 .chatbase { /*This can be edited to your liking - (the button)*/
  position: fixed;
  bottom: 2px;
  right: 15px;
  background: #222222;
  border: 2px solid #888888;
  width: 75px;
  height: 20px;
  border-radius: 5px;
  text-align: center !important;
  cursor: pointer;
  color: #888888;
 }


 .chatbase:hover { /*This can be edited to your liking - (hovering over the button)*/
  border-color: #999999;
  background: #888888;
  color: #222222;
 }


 #chat { /*This can be edited to your liking - (box surrounding the chatbox)*/
  border: 2px solid #888888;
  width: 65%;
  position: fixed;
  right: 15px;
  bottom: 27px;
  height: 50%;
  border-radius: 5px;
 }

ShowStopper
Forumember

Female Posts : 68
Reputation : 1
Language : English | HTML | Javascript | CSS

http://heroesnetwork.forumotion.net

Back to top Go down

View previous topic View next topic Back to top


 
Permissions in this forum:
You cannot reply to topics in this forum