Hitskin.comThis is a Hitskin.com skin preview
Install the skin • Return to the skin page
5 posters
How to make online list like that?
Dark Alice- Forumember
Posts : 35
Reputation : 2
Language : Ar
Location : Sy
by Dark Alice August 31st 2015, 9:26 am
Klemen- Forumember
Posts : 292
Reputation : 32
Language : English, German, Slovene
I don't see anything 'special' about the online list picture you posted, so you're going to have to point to specifics. Is it the background picture? The font? The fact that the online list and statistics are split?
Also, please provide us your forum url.
Also, please provide us your forum url.
Dark Alice- Forumember
- Posts : 35
Reputation : 2
Language : Ar
Location : Sy
Klemen wrote:I don't see anything 'special' about the online list picture you posted, so you're going to have to point to specifics. Is it the background picture? The font? The fact that the online list and statistics are split?
Also, please provide us your forum url.
ok this my forum www.pirates-revo.0wn0.com
and i want to make the groups image without text and put background picture
sorry for bad English
, and thanks for replay 
Dark Alice- Forumember
- Posts : 35
Reputation : 2
Language : Ar
Location : Sy
Up
SLGray- Administrator
- Posts : 51500
Reputation : 3523
Language : English
Location : United States
Dark Alice wrote:Klemen wrote:I don't see anything 'special' about the online list picture you posted, so you're going to have to point to specifics. Is it the background picture? The font? The fact that the online list and statistics are split?
Also, please provide us your forum url.
ok this my forum www.pirates-revo.0wn0.com
and i want to make the groups image without text and put background picture
sorry for bad English
Please don't double post. Your post needs to be separated by at least 24 hours before bumping. Please use the edit button instead!Dark Alice wrote:Up
Lost Founder's Password |Forum's Utilities |Report a Forum |General Rules |FAQ |Tricks & Tips
You need one post to send a PM.
You need one post to send a PM.
When your topic has been solved, ensure you mark the topic solved.
Never post your email in public.
Dark Alice- Forumember
- Posts : 35
Reputation : 2
Language : Ar
Location : Sy
Ok , now i can say up? 
Dark Alice- Forumember
- Posts : 35
Reputation : 2
Language : Ar
Location : Sy
Up Up
Ange Tuteur- Forumaster
- Posts : 13207
Reputation : 3000
Language : English & 日本語
Location : Pennsylvania
Hi @Dark Alice,
Can you edit the index_body template ? If so could you provide me the template to work with ?
Display > General > Templates > index_body
Thanks
Can you edit the index_body template ? If so could you provide me the template to work with ?
Display > General > Templates > index_body
Thanks
Dark Alice- Forumember
- Posts : 35
Reputation : 2
Language : Ar
Location : Sy
Ange Tuteur wrote:Hi @Dark Alice,
Can you edit the index_body template ? If so could you provide me the template to work with ?
Display > General > Templates > index_body
Thanks
Of Course
Ange Tuteur- Forumaster
- Posts : 13207
Reputation : 3000
Language : English & 日本語
Location : Pennsylvania
Once you post your index_body template I can begin work. ^^
Dark Alice- Forumember
- Posts : 35
Reputation : 2
Language : Ar
Location : Sy
- Code:
{JAVASCRIPT}
<!-- BEGIN message_admin_index -->
<table class="forumline" width="100%" border="0" cellspacing="1" cellpadding="0">
<!-- BEGIN message_admin_titre -->
<tr>
<td class="catHead" height="28"><span class="cattitle">{message_admin_index.message_admin_titre.MES_TITRE}</span></td>
</tr>
<!-- END message_admin_titre -->
<!-- BEGIN message_admin_txt -->
<tr>
<td class="row1" rowspan="3" align="center" valign="middle">
<div class="gensmall">{message_admin_index.message_admin_txt.MES_TXT}</div>
</td>
</tr>
<!-- END message_admin_txt -->
</table>
<!-- END message_admin_index -->
<!-- BEGIN switch_user_login_form_header -->
<form action="{S_LOGIN_ACTION}" method="post" name="form_login">
<!-- BEGIN switch_fb_connect_no -->
<table width="100%" border="0" cellspacing="0" cellpadding="0" class="user_login_form forumline">
<tr>
<td class="row1" align="center">
<table border="0" cellspacing="0" cellpadding="0">
<tr>
<td><span class="genmed">{L_USERNAME}:</span> </td>
<td><input class="post" type="text" size="10" name="username"/> </td>
<td>
<input class="radio" type="checkbox" name="autologin" {AUTOLOGIN_CHECKED} />
<span class="gensmall">{L_AUTO_LOGIN}</span>
</td>
</tr>
<tr>
<td><span class="genmed">{L_PASSWORD}:</span> </td>
<td><input class="post" type="password" size="10" name="password"/> </td>
<td>{S_HIDDEN_FIELDS}<input class="mainoption" type="submit" name="login" value="{L_LOGIN}" /></td>
</tr>
</table>
</td>
</tr>
</table>
<!-- END switch_fb_connect_no -->
<!-- BEGIN switch_fb_connect -->
<table width="100%" border="0" cellspacing="0" cellpadding="0" class="user_login_form forumline">
<tr>
<td valign="top" width="100%" class="row1" align="center">
<table width="100%">
<tr>
<td width="55%" valign="middle" align="right">
<table class="right">
<tr>
<td><span class="genmed">{L_USERNAME}:</span> </td>
<td><input class="post" type="text" size="10" name="username"/> </td>
<td>
<input class="radio" type="checkbox" name="autologin" {AUTOLOGIN_CHECKED} />
<span class="gensmall">{L_AUTO_LOGIN}</span>
</td>
</tr>
<tr>
<td><span class="genmed">{L_PASSWORD}:</span> </td>
<td><input class="post" type="password" size="10" name="password"/> </td>
<td>{S_HIDDEN_FIELDS}<input class="mainoption" type="submit" name="login" value="{L_LOGIN}" /></td>
</tr>
</table>
</td>
<td width="10%" align="center" valign="middle">
<span class="genmed fb_or">{switch_user_login_form_header.switch_fb_connect.L_OR}</span>
</td>
<td width="35%" class="align_gauche"><fb:login-button size="large" onlogin="window.location='/facebook_connect.forum'" scope="{switch_user_login_form_footer.switch_fb_connect.L_FB_PERMISSIONS}">{switch_user_login_form_footer.switch_fb_connect.L_FB_LOGIN_BUTTON}</fb:login-button></td>
</tr>
</table>
</td>
</tr>
</table>
<!-- END switch_fb_connect -->
</form>
<!-- END switch_user_login_form_header -->
{CHATBOX_TOP}
{BOARD_INDEX}
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="50%" valign="top">
<!-- BEGIN switch_user_logged_in -->
<span class="gensmall"><a href="{U_MARK_READ}" class="gensmall">{L_MARK_FORUMS_READ}</a></span>
<!-- END switch_user_logged_in -->
<!-- BEGIN switch_delete_cookies -->
<br /><span class="gensmall"><a href="{switch_delete_cookies.U_DELETE_COOKIES}" class="gensmall" rel="nofollow">{switch_delete_cookies.L_DELETE_COOKIES}</a></span>
<!-- END switch_delete_cookies -->
</td>
<td width="50%" align="right">
<span class="gensmall">
<a href="{U_TODAY_ACTIVE}" class="gensmall">{L_TODAY_ACTIVE}</a><br />
<a href="{U_TODAY_POSTERS}" class="gensmall">{L_TODAY_POSTERS}</a><br />
<a href="{U_OVERALL_POSTERS}" class="gensmall">{L_OVERALL_POSTERS}</a>
<!-- BEGIN switch_on_index -->
<!-- BEGIN switch_delete_cookies -->
<br /><a href="{switch_on_index.switch_delete_cookies.U_DELETE_COOKIES}" class="gensmall" rel="nofollow">{switch_on_index.switch_delete_cookies.L_DELETE_COOKIES}</a>
<!-- END switch_delete_cookies -->
<!-- END switch_on_index -->
</span>
</td>
</tr>
</table>
<!-- BEGIN switch_user_login_form_footer -->
<form action="{S_LOGIN_ACTION}" method="post" name="form_login">
<!-- BEGIN switch_fb_connect_no -->
<table width="100%" border="0" cellspacing="0" cellpadding="0" class="user_login_form forumline">
<tr>
<td class="row1" align="center">
<table border="0" cellspacing="0" cellpadding="0">
<tr>
<td><span class="genmed">{L_USERNAME}:</span> </td>
<td><input class="post" type="text" size="10" name="username"/> </td>
<td>
<input class="radio" type="checkbox" name="autologin" {AUTOLOGIN_CHECKED} />
<span class="gensmall">{L_AUTO_LOGIN}</span>
</td>
</tr>
<tr>
<td><span class="genmed">{L_PASSWORD}:</span> </td>
<td><input class="post" type="password" size="10" name="password"/> </td>
<td>{S_HIDDEN_FIELDS}<input class="mainoption" type="submit" name="login" value="{L_LOGIN}" /></td>
</tr>
</table>
</td>
</tr>
</table>
<!-- END switch_fb_connect_no -->
<!-- BEGIN switch_fb_connect -->
<table width="100%" border="0" cellspacing="0" cellpadding="0" class="user_login_form forumline">
<tr>
<td valign="top" width="100%" class="row1" align="center">
<table width="100%">
<tr>
<td width="55%" valign="middle">
<table class="right">
<tr>
<td><span class="genmed">{L_USERNAME}:</span> </td>
<td><input class="post" type="text" size="10" name="username"/> </td>
<td>
<input class="radio" type="checkbox" name="autologin" {AUTOLOGIN_CHECKED} />
<span class="gensmall">{L_AUTO_LOGIN}</span>
</td>
</tr>
<tr>
<td><span class="genmed">{L_PASSWORD}:</span> </td>
<td><input class="post" type="password" size="10" name="password"/> </td>
<td>{S_HIDDEN_FIELDS}<input class="mainoption" type="submit" name="login" value="{L_LOGIN}" /></td>
</tr>
</table>
</td>
<td width="10%" align="center" valign="middle">
<span class="genmed fb_or">{switch_user_login_form_footer.switch_fb_connect.L_OR}</span>
</td>
<td width="35%" class="align_gauche"><fb:login-button size="large" onlogin="window.location='/facebook_connect.forum'" scope="{switch_user_login_form_footer.switch_fb_connect.L_FB_PERMISSIONS}">{switch_user_login_form_footer.switch_fb_connect.L_FB_LOGIN_BUTTON}</fb:login-button></td>
</tr>
</table>
</td>
</tr>
</table>
<!-- END switch_fb_connect -->
</form>
<!-- END switch_user_login_form_footer -->
<!-- BEGIN disable_viewonline -->
<table class="forumline" width="100%" border="0" cellspacing="1" cellpadding="0">
<tr>
<td class="catHead" colspan="2" height="28">
<!-- BEGIN switch_viewonline_link -->
<span class="cattitle"><a class="cattitle" href="{U_VIEWONLINE}" rel="nofollow">{L_WHO_IS_ONLINE}</a></span>
<!-- END switch_viewonline_link -->
<!-- BEGIN switch_viewonline_nolink -->
<span class="cattitle">{L_WHO_IS_ONLINE}</span>
<!-- END switch_viewonline_nolink -->
</td>
</tr>
<tr>
<td class="row1" rowspan="6" align="center" valign="middle"><img src="{L_ONLINE_IMG}" id="i_whosonline" alt="{L_WHO_IS_ONLINE}" /></td>
<td class="row1" width="100%"><span class="gensmall">{TOTAL_POSTS}<br />
{TOTAL_USERS}<br />
{NEWEST_USER}</span></td>
</tr>
<tr>
<td class="row1"><span class="gensmall">{TOTAL_USERS_ONLINE}<br />
{RECORD_USERS}<br />
<br />
{LOGGED_IN_USER_LIST}</span></td>
</tr>
{L_CONNECTED_MEMBERS}
{L_WHOSBIRTHDAY_TODAY}
{L_WHOSBIRTHDAY_WEEK}
<tr>
<td class="row1"><span class="gensmall">{LEGEND} : {GROUP_LEGEND}</span></td>
</tr>
<!-- BEGIN switch_chatbox_activate -->
<tr>
<td class="row1">
<span class="gensmall">{TOTAL_CHATTERS_ONLINE} : {CHATTERS_LIST}<br />
<!-- BEGIN switch_chatbox_popup -->
<div id="chatbox_popup"></div>
<script type="text/javascript">
//<![CDATA[
insertChatBoxPopup('{disable_viewonline.switch_chatbox_activate.switch_chatbox_popup.U_FRAME_CHATBOX}', '{L_CLICK_TO_JOIN_CHAT}');
//]]>
</script>
<!-- END switch_chatbox_popup -->
</span>
</td>
</tr>
<!-- END switch_chatbox_activate -->
</table>
<!-- END disable_viewonline -->
{CHATBOX_BOTTOM}
<br clear="all" />
<!-- BEGIN switch_legend -->
<table border="0" cellspacing="3" cellpadding="0" align="center">
<tr>
<td align="center" width="20"><img src="{FORUM_NEW_IMG}" alt="{L_NEW_POSTS}" /></td>
<td><span class="gensmall">{L_NEW_POSTS}</span></td>
<td></td>
<td align="center" width="20"><img src="{FORUM_IMG}" alt="{L_NO_NEW_POSTS}" /></td>
<td><span class="gensmall">{L_NO_NEW_POSTS}</span></td>
<td> </td>
<td align="center" width="20"><img src="{FORUM_LOCKED_IMG}" alt="{L_FORUM_LOCKED}" /></td>
<td><span class="gensmall">{L_FORUM_LOCKED}</span></td>
</tr>
</table>
<!-- END switch_legend -->
{AUTO_DST}
<!-- BEGIN switch_fb_index_login -->
<div id="fb-root"></div>
<script>
FB.init({
appId : {switch_fb_index_login.FACEBOOK_APP_ID},
cookie : true,
xfbml : true,
oauth : true,
version : 'v2.3'
});
(function(d, s, id){
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) {return;}
js = d.createElement(s); js.id = id;
js.src = "//connect.facebook.net/en_US/sdk.js";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));
</script>
<!-- END switch_fb_index_login -->
Ange Tuteur- Forumaster
- Posts : 13207
Reputation : 3000
Language : English & 日本語
Location : Pennsylvania
Thanks ^^
Replace your template with this :
Remember to save and publish.
After that go to Display > Colors > CSS stylesheet and paste the following rules :
To change each group into an image you'll use this rule :
1. Replace /g1-admins by the path of the group which can be found in the address bar.
2. Replace https://2img.net/i/bl/logo.png by the URL of the image you want to display.
3. Lastly, change the height and width so it corresponds to the image dimensions.
If any questions, let me know.
Replace your template with this :
- Code:
{JAVASCRIPT}
<!-- BEGIN message_admin_index -->
<table class="forumline" width="100%" border="0" cellspacing="1" cellpadding="0">
<!-- BEGIN message_admin_titre -->
<tr>
<td class="catHead" height="28"><span class="cattitle">{message_admin_index.message_admin_titre.MES_TITRE}</span></td>
</tr>
<!-- END message_admin_titre -->
<!-- BEGIN message_admin_txt -->
<tr>
<td class="row1" rowspan="3" align="center" valign="middle">
<div class="gensmall">{message_admin_index.message_admin_txt.MES_TXT}</div>
</td>
</tr>
<!-- END message_admin_txt -->
</table>
<!-- END message_admin_index -->
<!-- BEGIN switch_user_login_form_header -->
<form action="{S_LOGIN_ACTION}" method="post" name="form_login">
<!-- BEGIN switch_fb_connect_no -->
<table width="100%" border="0" cellspacing="0" cellpadding="0" class="user_login_form forumline">
<tr>
<td class="row1" align="center">
<table border="0" cellspacing="0" cellpadding="0">
<tr>
<td><span class="genmed">{L_USERNAME}:</span> </td>
<td><input class="post" type="text" size="10" name="username"/> </td>
<td>
<input class="radio" type="checkbox" name="autologin" {AUTOLOGIN_CHECKED} />
<span class="gensmall">{L_AUTO_LOGIN}</span>
</td>
</tr>
<tr>
<td><span class="genmed">{L_PASSWORD}:</span> </td>
<td><input class="post" type="password" size="10" name="password"/> </td>
<td>{S_HIDDEN_FIELDS}<input class="mainoption" type="submit" name="login" value="{L_LOGIN}" /></td>
</tr>
</table>
</td>
</tr>
</table>
<!-- END switch_fb_connect_no -->
<!-- BEGIN switch_fb_connect -->
<table width="100%" border="0" cellspacing="0" cellpadding="0" class="user_login_form forumline">
<tr>
<td valign="top" width="100%" class="row1" align="center">
<table width="100%">
<tr>
<td width="55%" valign="middle" align="right">
<table class="right">
<tr>
<td><span class="genmed">{L_USERNAME}:</span> </td>
<td><input class="post" type="text" size="10" name="username"/> </td>
<td>
<input class="radio" type="checkbox" name="autologin" {AUTOLOGIN_CHECKED} />
<span class="gensmall">{L_AUTO_LOGIN}</span>
</td>
</tr>
<tr>
<td><span class="genmed">{L_PASSWORD}:</span> </td>
<td><input class="post" type="password" size="10" name="password"/> </td>
<td>{S_HIDDEN_FIELDS}<input class="mainoption" type="submit" name="login" value="{L_LOGIN}" /></td>
</tr>
</table>
</td>
<td width="10%" align="center" valign="middle">
<span class="genmed fb_or">{switch_user_login_form_header.switch_fb_connect.L_OR}</span>
</td>
<td width="35%" class="align_gauche"><fb:login-button size="large" onlogin="window.location='/facebook_connect.forum'" scope="{switch_user_login_form_footer.switch_fb_connect.L_FB_PERMISSIONS}">{switch_user_login_form_footer.switch_fb_connect.L_FB_LOGIN_BUTTON}</fb:login-button></td>
</tr>
</table>
</td>
</tr>
</table>
<!-- END switch_fb_connect -->
</form>
<!-- END switch_user_login_form_header -->
{CHATBOX_TOP}
{BOARD_INDEX}
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="50%" valign="top">
<!-- BEGIN switch_user_logged_in -->
<span class="gensmall"><a href="{U_MARK_READ}" class="gensmall">{L_MARK_FORUMS_READ}</a></span>
<!-- END switch_user_logged_in -->
<!-- BEGIN switch_delete_cookies -->
<br /><span class="gensmall"><a href="{switch_delete_cookies.U_DELETE_COOKIES}" class="gensmall" rel="nofollow">{switch_delete_cookies.L_DELETE_COOKIES}</a></span>
<!-- END switch_delete_cookies -->
</td>
<td width="50%" align="right">
<span class="gensmall">
<a href="{U_TODAY_ACTIVE}" class="gensmall">{L_TODAY_ACTIVE}</a><br />
<a href="{U_TODAY_POSTERS}" class="gensmall">{L_TODAY_POSTERS}</a><br />
<a href="{U_OVERALL_POSTERS}" class="gensmall">{L_OVERALL_POSTERS}</a>
<!-- BEGIN switch_on_index -->
<!-- BEGIN switch_delete_cookies -->
<br /><a href="{switch_on_index.switch_delete_cookies.U_DELETE_COOKIES}" class="gensmall" rel="nofollow">{switch_on_index.switch_delete_cookies.L_DELETE_COOKIES}</a>
<!-- END switch_delete_cookies -->
<!-- END switch_on_index -->
</span>
</td>
</tr>
</table>
<!-- BEGIN switch_user_login_form_footer -->
<form action="{S_LOGIN_ACTION}" method="post" name="form_login">
<!-- BEGIN switch_fb_connect_no -->
<table width="100%" border="0" cellspacing="0" cellpadding="0" class="user_login_form forumline">
<tr>
<td class="row1" align="center">
<table border="0" cellspacing="0" cellpadding="0">
<tr>
<td><span class="genmed">{L_USERNAME}:</span> </td>
<td><input class="post" type="text" size="10" name="username"/> </td>
<td>
<input class="radio" type="checkbox" name="autologin" {AUTOLOGIN_CHECKED} />
<span class="gensmall">{L_AUTO_LOGIN}</span>
</td>
</tr>
<tr>
<td><span class="genmed">{L_PASSWORD}:</span> </td>
<td><input class="post" type="password" size="10" name="password"/> </td>
<td>{S_HIDDEN_FIELDS}<input class="mainoption" type="submit" name="login" value="{L_LOGIN}" /></td>
</tr>
</table>
</td>
</tr>
</table>
<!-- END switch_fb_connect_no -->
<!-- BEGIN switch_fb_connect -->
<table width="100%" border="0" cellspacing="0" cellpadding="0" class="user_login_form forumline">
<tr>
<td valign="top" width="100%" class="row1" align="center">
<table width="100%">
<tr>
<td width="55%" valign="middle">
<table class="right">
<tr>
<td><span class="genmed">{L_USERNAME}:</span> </td>
<td><input class="post" type="text" size="10" name="username"/> </td>
<td>
<input class="radio" type="checkbox" name="autologin" {AUTOLOGIN_CHECKED} />
<span class="gensmall">{L_AUTO_LOGIN}</span>
</td>
</tr>
<tr>
<td><span class="genmed">{L_PASSWORD}:</span> </td>
<td><input class="post" type="password" size="10" name="password"/> </td>
<td>{S_HIDDEN_FIELDS}<input class="mainoption" type="submit" name="login" value="{L_LOGIN}" /></td>
</tr>
</table>
</td>
<td width="10%" align="center" valign="middle">
<span class="genmed fb_or">{switch_user_login_form_footer.switch_fb_connect.L_OR}</span>
</td>
<td width="35%" class="align_gauche"><fb:login-button size="large" onlogin="window.location='/facebook_connect.forum'" scope="{switch_user_login_form_footer.switch_fb_connect.L_FB_PERMISSIONS}">{switch_user_login_form_footer.switch_fb_connect.L_FB_LOGIN_BUTTON}</fb:login-button></td>
</tr>
</table>
</td>
</tr>
</table>
<!-- END switch_fb_connect -->
</form>
<!-- END switch_user_login_form_footer -->
<!-- BEGIN disable_viewonline -->
<table id="whoIsOnline" class="forumline" width="100%" border="0" cellspacing="1" cellpadding="0">
<tr>
<td class="catHead" colspan="2" height="28">
<!-- BEGIN switch_viewonline_link -->
<span class="cattitle"><a class="cattitle" href="{U_VIEWONLINE}" rel="nofollow">{L_WHO_IS_ONLINE}</a></span>
<!-- END switch_viewonline_link -->
<!-- BEGIN switch_viewonline_nolink -->
<span class="cattitle">{L_WHO_IS_ONLINE}</span>
<!-- END switch_viewonline_nolink -->
</td>
</tr>
<tr>
<td class="row1" rowspan="6" align="center" valign="middle"><img src="{L_ONLINE_IMG}" id="i_whosonline" alt="{L_WHO_IS_ONLINE}" /></td>
<td class="row1" width="100%"><span class="gensmall">{TOTAL_POSTS}<br />
{TOTAL_USERS}<br />
{NEWEST_USER}</span></td>
</tr>
<tr>
<td class="row1"><span class="gensmall">{TOTAL_USERS_ONLINE}<br />
{RECORD_USERS}<br />
<br />
{LOGGED_IN_USER_LIST}</span></td>
</tr>
{L_CONNECTED_MEMBERS}
{L_WHOSBIRTHDAY_TODAY}
{L_WHOSBIRTHDAY_WEEK}
<tr>
<td class="row1"><span id="groupLegend" class="gensmall">{LEGEND} : {GROUP_LEGEND}</span></td>
</tr>
<!-- BEGIN switch_chatbox_activate -->
<tr>
<td class="row1">
<span class="gensmall">{TOTAL_CHATTERS_ONLINE} : {CHATTERS_LIST}<br />
<!-- BEGIN switch_chatbox_popup -->
<div id="chatbox_popup"></div>
<script type="text/javascript">
//<![CDATA[
insertChatBoxPopup('{disable_viewonline.switch_chatbox_activate.switch_chatbox_popup.U_FRAME_CHATBOX}', '{L_CLICK_TO_JOIN_CHAT}');
//]]>
</script>
<!-- END switch_chatbox_popup -->
</span>
</td>
</tr>
<!-- END switch_chatbox_activate -->
</table>
<!-- END disable_viewonline -->
{CHATBOX_BOTTOM}
<br clear="all" />
<!-- BEGIN switch_legend -->
<table border="0" cellspacing="3" cellpadding="0" align="center">
<tr>
<td align="center" width="20"><img src="{FORUM_NEW_IMG}" alt="{L_NEW_POSTS}" /></td>
<td><span class="gensmall">{L_NEW_POSTS}</span></td>
<td></td>
<td align="center" width="20"><img src="{FORUM_IMG}" alt="{L_NO_NEW_POSTS}" /></td>
<td><span class="gensmall">{L_NO_NEW_POSTS}</span></td>
<td> </td>
<td align="center" width="20"><img src="{FORUM_LOCKED_IMG}" alt="{L_FORUM_LOCKED}" /></td>
<td><span class="gensmall">{L_FORUM_LOCKED}</span></td>
</tr>
</table>
<!-- END switch_legend -->
{AUTO_DST}
<!-- BEGIN switch_fb_index_login -->
<div id="fb-root"></div>
<script>
FB.init({
appId : {switch_fb_index_login.FACEBOOK_APP_ID},
cookie : true,
xfbml : true,
oauth : true,
version : 'v2.3'
});
(function(d, s, id){
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) {return;}
js = d.createElement(s); js.id = id;
js.src = "//connect.facebook.net/en_US/sdk.js";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));
</script>
<!-- END switch_fb_index_login -->
Remember to save and publish.
After that go to Display > Colors > CSS stylesheet and paste the following rules :
- Code:
#groupLegend, #groupLegend a { font-size:0 }
#groupLegend a {
display:inline-block;
margin:3px;
}
To change each group into an image you'll use this rule :
- Code:
#groupLegend a[href="/g1-admins"] {
background:url('http://2img.net/i/bl/logo.png') no-repeat;
height:50px;
width:50px;
}
1. Replace /g1-admins by the path of the group which can be found in the address bar.
2. Replace https://2img.net/i/bl/logo.png by the URL of the image you want to display.
3. Lastly, change the height and width so it corresponds to the image dimensions.
If any questions, let me know.
Dark Alice- Forumember
- Posts : 35
Reputation : 2
Language : Ar
Location : Sy
Ange Tuteur- Forumaster
- Posts : 13207
Reputation : 3000
Language : English & 日本語
Location : Pennsylvania
You set the following code up in your stylesheet, correct ?
If so, can you post your modified code here ?
- Code:
#groupLegend a[href="/g1-admins"] {
background:url('http://2img.net/i/bl/logo.png') no-repeat;
height:50px;
width:50px;
}
If so, can you post your modified code here ?
Dark Alice- Forumember
- Posts : 35
Reputation : 2
Language : Ar
Location : Sy
Yes
- Code:
/*كود الاحصائيات*/
#groupLegend a[href="/g2-marines"] {
background:url('http://i.imgur.com/T6gl5UY.png') no-repeat;
height:50px;
width:50px;
}
#groupLegend, #groupLegend a { font-size:0 }
#groupLegend a {
display:inline-block;
margin:3px;
}
/*Fin/*
Ange Tuteur- Forumaster
- Posts : 13207
Reputation : 3000
Language : English & 日本語
Location : Pennsylvania
After looking at your forum, I see the problem. Due to the forum language the group paths are always "g#-group" where # refers to the group number. So that part of the code should look like :
The name after the dash ( - ) will always be "group", so the only thing you need to change is the number.
- Code:
#groupLegend a[href="/g2-group"] {
background:url('http://i.imgur.com/T6gl5UY.png') no-repeat;
height:50px;
width:50px;
}
The name after the dash ( - ) will always be "group", so the only thing you need to change is the number.
Dark Alice- Forumember
- Posts : 35
Reputation : 2
Language : Ar
Location : Sy
Ange Tuteur wrote:After looking at your forum, I see the problem. Due to the forum language the group paths are always "g#-group" where # refers to the group number. So that part of the code should look like :
- Code:
#groupLegend a[href="/g2-group"] {
background:url('http://i.imgur.com/T6gl5UY.png') no-repeat;
height:50px;
width:50px;
}
The name after the dash ( - ) will always be "group", so the only thing you need to change is the number.
Oh it’s work now , thanks
Dark Alice- Forumember
- Posts : 35
Reputation : 2
Language : Ar
Location : Sy
But how i can put group name when the mouse click in image?
Dark Alice- Forumember
- Posts : 35
Reputation : 2
Language : Ar
Location : Sy
Up Up
Ange Tuteur- Forumaster
- Posts : 13207
Reputation : 3000
Language : English & 日本語
Location : Pennsylvania
Sorry for the delay, could you explain what you mean by this ? Do you mean a tooltip, like this :Dark Alice wrote:But how i can put group name when the mouse click in image?
Ape- Administrator
- Posts : 19330
Reputation : 2005
Language : fluent in dork / mumbojumbo & English haha
she wants the name of the Group to show up when she hovers the mouse over each pic
see screen shot 
see screen shot
Ange Tuteur- Forumaster
- Posts : 13207
Reputation : 3000
Language : English & 日本語
Location : Pennsylvania
I figured it was something like that. Just wanted to clarify.
Anyway, if it is that. The best solution would be to create a pseudo-tooltip through CSS. Here's an example for group 2 :
The result should be similar to this :
I haven't made one of these in awhile, so you might need to edit the position.
Anyway, if it is that. The best solution would be to create a pseudo-tooltip through CSS. Here's an example for group 2 :
- Code:
#groupLegend a[href="/g2-group"]:hover:before {
content:"Tooltip";
color:#FFF;
text-shadow:none;
background-color:#000;
background-color:rgba(0, 0, 0, 0.7);
border-radius:3px;
position:absolute;
margin-top:-25px;
padding:3px;
}
The result should be similar to this :
I haven't made one of these in awhile, so you might need to edit the position.
Dark Alice- Forumember
- Posts : 35
Reputation : 2
Language : Ar
Location : Sy
ok thanks , i will try it
Dark Alice- Forumember
- Posts : 35
Reputation : 2
Language : Ar
Location : Sy
oh , the name is not show
- Code:
/*code by Ange Tuteur - Thank You for help ^^*/
#groupLegend, #groupLegend a { font-size:0 }
#groupLegend a {
display:inline-block;
margin:3px;
}
#groupLegend a[href="/g2-group"] {
background:url('http://i.imgur.com/T6gl5UY.png') no-repeat;
height:50px;
width:50px;
}
#groupLegend a[href="/g2-group"]:hover:before {
content:"البحرية";
color:#FFF;
text-shadow:none;
background-color:#000;
background-color:rgba(0, 0, 0, 0.7);
border-radius:3px;
position:absolute;
margin-top:-25px;
padding:3px;
}
/*Fin/*
SLGray- Administrator
- Posts : 51500
Reputation : 3523
Language : English
Location : United States
What do you meany by name does not appear?
Lost Founder's Password |Forum's Utilities |Report a Forum |General Rules |FAQ |Tricks & Tips
You need one post to send a PM.
You need one post to send a PM.
When your topic has been solved, ensure you mark the topic solved.
Never post your email in public.
Ange Tuteur- Forumaster
- Posts : 13207
Reputation : 3000
Language : English & 日本語
Location : Pennsylvania
I apologize, I didn't explain well. In the code below, you need to change the following :
a[href="/g2-group"] : replace the 2 by the ID of the group.
"Tooltip" : Replace Tooltip with the texts you want displayed for when you hover over this group.
a[href="/g2-group"] : replace the 2 by the ID of the group.
"Tooltip" : Replace Tooltip with the texts you want displayed for when you hover over this group.
- Code:
#groupLegend a[href="/g2-group"]:hover:before {
content:"Tooltip";
color:#FFF;
text-shadow:none;
background-color:#000;
background-color:rgba(0, 0, 0, 0.7);
border-radius:3px;
position:absolute;
margin-top:-25px;
padding:3px;
}
Dark Alice- Forumember
- Posts : 35
Reputation : 2
Language : Ar
Location : Sy
I have change the following but its show like the pictureAnge Tuteur wrote:I apologize, I didn't explain well. In the code below, you need to change the following :
a[href="/g2-group"] : replace the 2 by the ID of the group.
"Tooltip" : Replace Tooltip with the texts you want displayed for when you hover over this group.
- Code:
#groupLegend a[href="/g2-group"]:hover:before {
content:"Tooltip";
color:#FFF;
text-shadow:none;
background-color:#000;
background-color:rgba(0, 0, 0, 0.7);
border-radius:3px;
position:absolute;
margin-top:-25px;
padding:3px;
}
Dark Alice- Forumember
- Posts : 35
Reputation : 2
Language : Ar
Location : Sy
up plz
Ange Tuteur- Forumaster
- Posts : 13207
Reputation : 3000
Language : English & 日本語
Location : Pennsylvania
Could you post the modified code ?
Thanks
Thanks
Facebook
Twitter
Pinterest
Youtube
