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.

Adding the FM notification bar in HTML

View previous topic View next topic Go down

Solved Adding the FM notification bar in HTML

Post by Guest on December 9th 2014, 10:19 pm

Hey! I've just finished adding AWC to HTML but I want to have the notification bar added at the top of the page so that when PM's come in people will get to see a notification. Is that possible?

Here's the HTML code I'm using:


Code:
<STYLE TYPE="text/css">
<!--
body {
background-image: url('http://i39.servimg.com/u/f39/19/05/73/25/sorryc11.jpg');
background-repeat: no-repeat;
background-attachment: fixed;
background-position: center;
}
-->
</STYLE>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js" type="text/javascript"></script><script src="http://illiweb.com/rs3/85/frm/lang/nl.js" type="text/javascript"></script><script src="/37907.js" type="text/javascript"></script><style>
#avacweb_chat iframe{width:100%; Height:100%}

</style>
<div style="width: 100%; height: 100%;" id="chatholder">
</div>

Forum: http://fcnl.actieforum.com/
Chat: http://fcnl.actieforum.com/h1-friendcodes-chatbox (members only)

Guest
Guest


Back to top Go down

Solved Re: Adding the FM notification bar in HTML

Post by Guest on December 11th 2014, 12:27 pm

bump

Guest
Guest


Back to top Go down

Solved Re: Adding the FM notification bar in HTML

Post by Ange Tuteur on December 11th 2014, 8:20 pm

Hello Samanatha,

Add this to the bottom of your document body :
Code:
<!-- START init_fa_toolbar -->
<script type="text/javascript" src="http://illiweb.com/rs3/85/frm/jquery/cookie/jquery.cookie.js"></script>
<script type="text/javascript" src="http://illiweb.com/rs3/85/frm/jquery/toolbar/FAToolbar.js"></script>
<script type="text/javascript" src="http://illiweb.com/rs3/85/frm/json/json2.js"></script>
<script type="text/javascript" src="http://illiweb.com/rs3/85/frm/jquery/printf/printf.js"></script>
<script type="text/javascript" src="http://illiweb.com/rs3/85/frm/jquery/dotdotdot/jquery.dotdotdot-1.5.6.js"></script>
<script type="text/javascript" src="http://illiweb.com/rs3/85/frm/jquery/notif/FA.js"></script>
<iframe id="fa_data" src="/" style="display:none"></iframe>
<div id="fa_style" style="display:none;"></div>
<script type="text/javascript">var _userdata = new Object(), _lang = new Object(), _board = new Object(), fa_data = document.getElementById('fa_data');
fa_data.onload = function() {
 var fa = fa_data.contentWindow, fa_style = fa.document.getElementsByTagName('STYLE');
 
 for (var i = 0; i<fa_style.length; i++) if (/#fa_toolbar/.test(fa_style[i].innerHTML)) document.getElementById('fa_style').appendChild(fa_style[i]);
 for (var a in fa._userdata) _userdata[a] = fa._userdata[a];
 for (var b in fa._lang) _lang[b] = fa._lang[b];
 for (var c in fa._board) _board[c] = fa._board[c];
 
 $(document).ready(Toolbar.init)
}</script>
<!-- END init_fa_toolbar -->

Ange Tuteur
Forumaster

Male Posts : 13028
Reputation : 2704
Language : EN10, FR5
Location : Pennsylvania

http://fmdesign.forumotion.com

Back to top Go down

Solved Re: Adding the FM notification bar in HTML

Post by Guest on December 11th 2014, 9:43 pm

@Ange Tuteur wrote:Hello Samanatha,

Add this to the bottom of your document body :
Code:
<!-- START init_fa_toolbar -->
<script type="text/javascript" src="http://illiweb.com/rs3/85/frm/jquery/cookie/jquery.cookie.js"></script>
<script type="text/javascript" src="http://illiweb.com/rs3/85/frm/jquery/toolbar/FAToolbar.js"></script>
<script type="text/javascript" src="http://illiweb.com/rs3/85/frm/json/json2.js"></script>
<script type="text/javascript" src="http://illiweb.com/rs3/85/frm/jquery/printf/printf.js"></script>
<script type="text/javascript" src="http://illiweb.com/rs3/85/frm/jquery/dotdotdot/jquery.dotdotdot-1.5.6.js"></script>
<script type="text/javascript" src="http://illiweb.com/rs3/85/frm/jquery/notif/FA.js"></script>
<iframe id="fa_data" src="/" style="display:none"></iframe>
<div id="fa_style" style="display:none;"></div>
<script type="text/javascript">var _userdata = new Object(), _lang = new Object(), _board = new Object(), fa_data = document.getElementById('fa_data');
fa_data.onload = function() {
 var fa = fa_data.contentWindow, fa_style = fa.document.getElementsByTagName('STYLE');
 
 for (var i = 0; i<fa_style.length; i++) if (/#fa_toolbar/.test(fa_style[i].innerHTML)) document.getElementById('fa_style').appendChild(fa_style[i]);
 for (var a in fa._userdata) _userdata[a] = fa._userdata[a];
 for (var b in fa._lang) _lang[b] = fa._lang[b];
 for (var c in fa._board) _board[c] = fa._board[c];
 
 $(document).ready(Toolbar.init)
}</script>
<!-- END init_fa_toolbar -->

Hi Ange!

Works great, except the style I have in CSS is not copied in FireFox (looks like it partially did in IE). I've got the following CSS codes for the toolbar on my site:


Code:
/**** FA TOOLBAR -------------------- ****/
#fa_toolbar {font-family: Verdana,Helvetica,Arial,sans-serif !important;font-weight: 700 !important;font-size: 1.1em !important;}
#fa_toolbar span {font-family: Verdana,Helvetica,Arial,sans-serif !important;font-weight: 700 !important;font-size: 1.1em !important;}
#fa_toolbar a {font-family: Verdana,Helvetica,Arial,sans-serif !important;font-weight: 700 !important;font-size: 1.1em !important;}
#fa_right {font-family: Verdana,Helvetica,Arial,sans-serif !important;font-weight: 700 !important;font-size: 1.1em !important;}
#fa_mail {display: none!important}
/**** END FA TOOLBAR -------------------- ****/



Could you please add it to the HTML you just gave me?

Guest
Guest


Back to top Go down

Solved Re: Adding the FM notification bar in HTML

Post by Ange Tuteur on December 11th 2014, 10:40 pm

You can add it in an inline stylesheet :
Code:
<style type="text/css">
/**** FA TOOLBAR -------------------- ****/
#fa_toolbar {font-family: Verdana,Helvetica,Arial,sans-serif !important;font-weight: 700 !important;font-size: 1.1em !important;}
#fa_toolbar span {font-family: Verdana,Helvetica,Arial,sans-serif !important;font-weight: 700 !important;font-size: 1.1em !important;}
#fa_toolbar a {font-family: Verdana,Helvetica,Arial,sans-serif !important;font-weight: 700 !important;font-size: 1.1em !important;}
#fa_right {font-family: Verdana,Helvetica,Arial,sans-serif !important;font-weight: 700 !important;font-size: 1.1em !important;}
#fa_mail {display: none!important}
/**** END FA TOOLBAR -------------------- ****/
</style>

or if you know the link to your external stylesheet in the AP, you can use that also.

Ange Tuteur
Forumaster

Male Posts : 13028
Reputation : 2704
Language : EN10, FR5
Location : Pennsylvania

http://fmdesign.forumotion.com

Back to top Go down

Solved Re: Adding the FM notification bar in HTML

Post by Guest on December 11th 2014, 10:49 pm

@Ange Tuteur wrote:You can add it in an inline stylesheet :
Code:
<style type="text/css">
/**** FA TOOLBAR -------------------- ****/
#fa_toolbar {font-family: Verdana,Helvetica,Arial,sans-serif !important;font-weight: 700 !important;font-size: 1.1em !important;}
#fa_toolbar span {font-family: Verdana,Helvetica,Arial,sans-serif !important;font-weight: 700 !important;font-size: 1.1em !important;}
#fa_toolbar a {font-family: Verdana,Helvetica,Arial,sans-serif !important;font-weight: 700 !important;font-size: 1.1em !important;}
#fa_right {font-family: Verdana,Helvetica,Arial,sans-serif !important;font-weight: 700 !important;font-size: 1.1em !important;}
#fa_mail {display: none!important}
/**** END FA TOOLBAR -------------------- ****/
</style>

or if you know the link to your external stylesheet in the AP, you can use that also.

Thanks. I see now what's an 'inline stylesheet'. So I just added it to the same HTML page and it's way too big, but I can change it. I'm gonna play a little bit around with it to figure out the right settings. Thanks!

How do I find the external stylesheet link in the AP by the way? Is that the link to the regular CSS?

Guest
Guest


Back to top Go down

Solved Re: Adding the FM notification bar in HTML

Post by Ange Tuteur on December 12th 2014, 8:05 am

Add this to your HTML page :
Code:
<link rel="stylesheet" type="text/css" href="/css.forum"/>

It should refer to your forum stylesheet.

Ange Tuteur
Forumaster

Male Posts : 13028
Reputation : 2704
Language : EN10, FR5
Location : Pennsylvania

http://fmdesign.forumotion.com

Back to top Go down

Solved Re: Adding the FM notification bar in HTML

Post by Guest on December 12th 2014, 8:07 am

@Ange Tuteur wrote:Add this to your HTML page :
Code:
<link rel="stylesheet" type="text/css" href="/css.forum"/>

It should refer to your forum stylesheet.

Thanks Ange! Then I know for the next time. This topic can be maked solved and archived. Smile

Guest
Guest


Back to top Go down

Solved Re: Adding the FM notification bar in HTML

Post by Ange Tuteur on December 12th 2014, 8:14 am

You're welcome ^^

Topic archived

Ange Tuteur
Forumaster

Male Posts : 13028
Reputation : 2704
Language : EN10, FR5
Location : Pennsylvania

http://fmdesign.forumotion.com

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