PunBB Chatbox

Technical Details

Forum version : #PunBB
Position : Founder
Concerned browser(s) : Mozilla Firefox, Google Chrome, Internet Explorer, Opera, Safari
Screenshot of problem : https://i.imgur.com/jMFUNXW.png
Who the problem concerns : All members
When the problem appeared : Just now
Forum link : http://oppntestsite.forumotion.com/

Description of problem

Alright, so I've gone through the chatbox css color change area, tried to get it that way, however none of that worked, !important tag didn't, nothing. I want the chat to have the Iceland font, both for writing, the chatbox title, ect. However nothing I seem to do gets it to go my way. I tried doing the right clicking, inspecting and getting the div code name that way, and nothing happened when I plugged it in. I've removed almost everything in the css invloving the chatbox, expect for the little line that changes the typing area into a dark background color.

change the font in the posts you need this tag

Code:

#chatbox

and in the type box you need

Code:

#message

chatbox tile is

Code:

a.chat-title

log n log out and Chatbox Archives

Code:

.chatbox-options

Code:

#chatbox {
  font-family: 'Iceland' !important;
}

#message {
    font-family: 'Iceland' !important;
}

a.chat-title {
      font-family: 'Iceland' !important;
}

.chatbox-options {
        font-family: 'Iceland' !important;
}

I did this, but nothing happened. =(

try it like this
font-family: Iceland !important;

you only need to do this 'Iceland' if you have a space in the font name.

Removed, but nothing changed.

Don't forget all your members must have the font installed on the PC / apple item for this to work right and you must have the google font added to your forum CSS or JavaScript

The font worked everywhere else, and is plugged into the over_all_header of the form via google fonts, I'm confused on why it would work everywhere else but not the chatbox?

Hmm I think the code has to be installed on a javascript as the chatbox is not installed the same way but not 100% sure I think the chatbox is independent do you have index_body in your templates ?

if yes try and add it there also.

Code:

{JAVASCRIPT}
<!-- BEGIN switch_user_logged_in -->
<div id="pun-visit" class="clearfix">
   <ul>
         <li><a href="{U_SEARCH_NEW}">{L_SEARCH_NEW}</a></li>
         <li><a href="{U_SEARCH_SELF}">{L_SEARCH_SELF}</a></li>
      <li><a href="{U_SEARCH_UNANSWERED}">{L_SEARCH_UNANSWERED}</a></li>
      <li><a href="{U_MARK_READ}">{L_MARK_FORUMS_READ}</a></li>
   </ul>
   <p>{LOGGED_AS}. {LAST_VISIT_DATE}</p>
</div>
<!-- END switch_user_logged_in -->
<!-- BEGIN switch_user_logged_out -->
<div id="pun-visit">
   <p>{L_NOT_CONNECTED} {L_LOGIN_REGISTER}</p>
</div>
<!-- END switch_user_logged_out -->

<!-- BEGIN message_admin_index -->
<div class="main">
   <!-- BEGIN message_admin_titre -->
   <div class="main-head">
      <h1 class="page-title">{message_admin_index.message_admin_titre.MES_TITRE}</h1>
   </div>
   <!-- END message_admin_titre -->

   <!-- BEGIN message_admin_txt -->
   <div id="pun-announcement">
      <p>{message_admin_index.message_admin_txt.MES_TXT}</p>
   </div>
   <!-- END message_admin_txt -->
</div>
<!-- END message_admin_index -->

<!-- BEGIN switch_user_login_form_header -->
<div class="main">
<form action="{S_LOGIN_ACTION}" method="post" name="form_login">
   <div class="user_login_form main-box center">
      <label><span class="genmed">{L_USERNAME} :</span> <input class="post" type="text" size="10" name="username" /></label> &nbsp;
      <label><span class="genmed">{L_PASSWORD} :</span> <input class="post" type="password" size="10" name="password" /></label> &nbsp;
      <label><span class="gensmall">{L_AUTO_LOGIN}</span> <input class="radio" type="checkbox" name="autologin" {AUTOLOGIN_CHECKED} /></label> &nbsp;
      {S_HIDDEN_FIELDS}<input class="mainoption" type="submit" name="login" value="{L_LOGIN}" />

        <!-- BEGIN switch_social_login -->
        <div class="mt10">
            <div class="social_btn">
                <!-- BEGIN fb_connect -->
                <div class="fb-login-button"></div>
                <!-- END fb_connect -->
                &nbsp;
            </div>
        </div>
        <!-- END switch_social_login -->
   </div>
</form>
</div>
<!-- END switch_user_login_form_header -->

{CHATBOX_TOP}
{BOARD_INDEX}

<!-- BEGIN disable_viewonline -->
<div id="pun-info" class="main">
   <div class="main-content">
      <div id="stats">
         <p class="right">{TOTAL_POSTS}</p>
         <p>{TOTAL_USERS}</p>
         <p>{NEWEST_USER}</p>
      </div>
      <div id="onlinelist">
         <img src="{L_ONLINE_IMG}" alt="{L_WHO_IS_ONLINE}" />
         <p class="right">
            <!-- BEGIN switch_viewonline_link -->
            <a href="{U_VIEWONLINE}" rel="nofollow">{L_WHO_IS_ONLINE}</a>
            <!-- END switch_viewonline_link -->
            <!-- BEGIN switch_viewonline_nolink -->
            {L_WHO_IS_ONLINE}
            <!-- END switch_viewonline_nolink -->
         </p>
         <p>{TOTAL_USERS_ONLINE}<br />
         {RECORD_USERS}

         <br />
         {LOGGED_IN_USER_LIST}

         {L_ONLINE_USERS}
         {L_CONNECTED_MEMBERS}<br />
         {L_WHOSBIRTHDAY_TODAY}{L_WHOSBIRTHDAY_WEEK}</p>
         <div class="clear"></div>

         <p>{LEGEND}&nbsp;:&nbsp;{GROUP_LEGEND}</p>

      </div>
      <!-- BEGIN switch_chatbox_activate -->
      <div id="onlinechat">
         <p class="page-bottom">
         {TOTAL_CHATTERS_ONLINE}&nbsp;:&nbsp;
         {CHATTERS_LIST}<br />
         <!-- BEGIN switch_chatbox_popup -->
            <div id="chatbox_popup"></div>
            <script type="text/javascript">
               insertChatBoxPopup('{disable_viewonline.switch_chatbox_activate.switch_chatbox_popup.U_FRAME_CHATBOX}', '{L_CLICK_TO_JOIN_CHAT}');
            </script>
         <!-- END switch_chatbox_popup -->
         </p>
      </div>
      <!-- END switch_chatbox_activate -->
   </div>
</div>
<!-- END disable_viewonline -->

<!-- BEGIN switch_user_login_form_footer -->
<form action="{S_LOGIN_ACTION}" method="post" name="form_login">
   <div class="user_login_form main-box center">
      <label><span class="genmed">{L_USERNAME} :</span> <input class="post" type="text" size="10" name="username"/></label> &nbsp;
      <label><span class="genmed">{L_PASSWORD} :</span> <input class="post" type="password" size="10" name="password"/></label> &nbsp;
      <label><span class="gensmall">{L_AUTO_LOGIN}</span> <input class="radio" type="checkbox" name="autologin" {AUTOLOGIN_CHECKED} /></label> &nbsp;
      {S_HIDDEN_FIELDS}<input class="mainoption" type="submit" name="login" value="{L_LOGIN}" />

        <!-- BEGIN switch_social_login -->
        <div class="mt10">
            <div class="social_btn">
                <!-- BEGIN fb_connect -->
                <div class="fb-login-button"></div>
                <!-- END fb_connect -->
                &nbsp;
            </div>
        </div>
        <!-- END switch_social_login -->
   </div>
</form>
<!-- END switch_user_login_form_footer -->

{CHATBOX_BOTTOM}

<!-- BEGIN switch_legend -->
<ul id="pun-legend">
   <li>
      <img src="{FORUM_NEW_IMG}" alt="{L_NEW_POSTS}" />&nbsp;{L_NEW_POSTS}
      <img src="{FORUM_IMG}" alt="{L_NO_NEW_POSTS}" />&nbsp;{L_NO_NEW_POSTS}
      <img src="{FORUM_LOCKED_IMG}" alt="{L_FORUM_LOCKED}" />&nbsp;{L_FORUM_LOCKED}
   </li>
</ul>
<!-- END switch_legend -->

{AUTO_DST}


Thats the index body code

yes i think that will work in there as you can see it has the codes for the chatbox in it

From 59 down so if I'm right the codes you added in your other template will work for the chatbox

but not 100% sure as i don't really play with templates and java.

Hi there,

I will be happy to assist you. Can you send me a testing account via PM. Thanks.

Draxion wrote:Hi there,

I will be happy to assist you. Can you send me a testing account via PM. Thanks.

Sent!

There, you are. How's that?

Draxion wrote:There, you are. How's that?

Perfect <3 THank you soo much!!

You are very welcome. May I mark this as "solved"?

Yes you can!