HomeNavigation Bar Change
2 posters
Page 1 of 1
Navigation Bar Change
by gamamulya July 8th 2011, 8:51 am
1. what is the css code for deleting the navbar background ?, and could i add something beside the search box, or move the searchbox up beside the navigation bar ? have a look at these 
2. how to make a navigation button change when we hover the cursor on it ? like this navigation :
https://help.forumotion.com/t89991-navigation-buttons-shine-hover
I already check at FAQ : https://help.forumotion.com/t35094-the-navigation-bar
but not written there.
3. how to make the forum`s banner and navigation bar centered ? , I already open Administartion panel - display - headers & navigation and change the logo positioning and menu positioning to the center, but it doesnt make a change , the navigation bar and logo doesnt centered.
2. how to make a navigation button change when we hover the cursor on it ? like this navigation :
https://help.forumotion.com/t89991-navigation-buttons-shine-hover
I already check at FAQ : https://help.forumotion.com/t35094-the-navigation-bar
but not written there.
3. how to make the forum`s banner and navigation bar centered ? , I already open Administartion panel - display - headers & navigation and change the logo positioning and menu positioning to the center, but it doesnt make a change , the navigation bar and logo doesnt centered.
gamamulya- Forumember
-
Posts : 192
Reputation : 25
Language : English, Indonesian, Deutsch ( Germany ), Japanesse
Location : Everywhere Everyplaces -
Re: Navigation Bar Change
by Nera. July 8th 2011, 11:17 am
Hello,
1. CSS for nav background.
Find this in your CSS and make sure your background is transparent.
2. Add something beside searchbar
Find what you want to add than I can tell you is it possible.
3. Navigation hover
It's been answered many times. Are you searching for something like this https://help.forumotion.com/t92156-navigation-bar-effect
4. Navbar align
Find this in your CSS and change the aligment to center important.
1. CSS for nav background.
Find this in your CSS and make sure your background is transparent.
- Code:
.navbar {
background-color: transparent;
clear: both;
padding: 0 10px;
}
2. Add something beside searchbar
Find what you want to add than I can tell you is it possible.
3. Navigation hover
It's been answered many times. Are you searching for something like this https://help.forumotion.com/t92156-navigation-bar-effect
4. Navbar align
Find this in your CSS and change the aligment to center important.
- Code:
ul.navlinks {
text-align: center !important;
}
Nera.- Energetic
-
Posts : 7078
Reputation : 2017
Language : English
Location : -
Re: Navigation Bar Change
by gamamulya July 8th 2011, 5:24 pm
1. already do it, and it works 
( Done )
2. i want to add a text : " language " then with flags beside it, when we click the flag, it direct us to google translator.., could i use IMG tag and URL tag for it ? , and how to add it there ?
3. already add it with these :
but not all the navigation button appeared, try a look at experience.forum.st
4. it works ^^, how about the forum logo ( banner ) ?, how to put it to the center too ?
( Done )2. i want to add a text : " language " then with flags beside it, when we click the flag, it direct us to google translator.., could i use IMG tag and URL tag for it ? , and how to add it there ?
3. already add it with these :
#i_icon_mini_index {
background-image: url('https://i.servimg.com/u/f40/16/50/98/84/home10.png');
width: 97px;
height: 43px;
}
#i_icon_mini_index:hover {
background-image: url('https://i.servimg.com/u/f40/16/50/98/84/home110.png');
width: 97px;
height: 43px;
}
#i_icon_mini_portal {
background-image: url('https://i.servimg.com/u/f40/16/50/98/84/portal11.png');
width: 80px;
height: 43px;
}
#i_icon_mini_portal:hover {
background-image: url('https://i.servimg.com/u/f40/16/50/98/84/portal12.png');
width: 80px;
height: 43px;
}
#i_icon_mini_profile {
background-image: url('https://i.servimg.com/u/f40/16/50/98/84/profil11.png');
width: 80px;
height: 43px;
}
#i_icon_mini_profile:hover {
background-image: url('https://i.servimg.com/u/f40/16/50/98/84/profil10.png');
width: 80px;
height: 43px;
}
#i_icon_mini_calendar {
background-image: url('https://i.servimg.com/u/f40/16/50/98/84/calend10.png');
width: 80px;
height: 43px;
}
#i_icon_mini_calendar:hover {
background-image: url('https://i.servimg.com/u/f40/16/50/98/84/caland10.png');
width: 80px;
height: 43px;
}
#i_icon_mini_gallery {
background-image: url('https://i.servimg.com/u/f40/16/50/98/84/featur11.png');
width: 80px;
height: 43px;
}
#i_icon_mini_gallery:hover {
background-image: url('https://i.servimg.com/u/f40/16/50/98/84/featur10.png');
width: 80px;
height: 43px;
}
#i_icon_mini_message {
background-image: url('https://i.servimg.com/u/f40/16/50/98/84/messag11.png');
width: 80px;
height: 43px;
}
#i_icon_mini_message:hover {
background-image: url('https://i.servimg.com/u/f40/16/50/98/84/messag10.png');
width: 80px;
height: 43px;
}
#i_icon_mini_new_message {
background-image: url('https://i.servimg.com/u/f40/16/50/98/84/new_me11.png');
width: 80px;
height: 43px;
}
#i_icon_mini_new_message:hover {
background-image: url('https://i.servimg.com/u/f40/16/50/98/84/new_me10.png');
width: 80px;
height: 43px;
}
#i_icon_mini_register {
background-image: url('https://i.servimg.com/u/f40/16/50/98/84/regist10.png');
width: 80px;
height: 43px;
}
#i_icon_mini_login {
background-image: url('https://i.servimg.com/u/f40/16/50/98/84/login10.png');
width: 80px;
height: 43px;
}
#i_icon_mini_login:hover {
background-image: url('https://i.servimg.com/u/f40/16/50/98/84/login110.png');
width: 80px;
height: 43px;
}
#i_icon_min_logout {
background-image: url('https://i.servimg.com/u/f40/16/50/98/84/logout11.png');
width: 97px;
height: 43px;
}
#i_icon_mini_logout:hover {
background-image: url('https://i.servimg.com/u/f40/16/50/98/84/logout10.png');
width: 97px;
height: 43px;
}
#i_icon_min_search {
background-image: url('https://i.servimg.com/u/f40/16/50/98/84/search11.png');
width: 80px;
height: 43px;
}
#i_icon_mini_search:hover {
background-image: url('https://i.servimg.com/u/f40/16/50/98/84/search10.png');
width: 80px;
height: 43px;
}
#i_icon_min_faq {
background-image: url('https://i.servimg.com/u/f40/16/50/98/84/faq10.png');
width: 80px;
height: 43px;
}
#i_icon_mini_faq:hover {
background-image: url('https://i.servimg.com/u/f40/16/50/98/84/faq110.png');
width: 80px;
height: 43px;
}
but not all the navigation button appeared, try a look at experience.forum.st
4. it works ^^, how about the forum logo ( banner ) ?, how to put it to the center too ?
gamamulya- Forumember
- Posts : 192
Reputation : 25
Language : English, Indonesian, Deutsch ( Germany ), Japanesse
Location : Everywhere Everyplaces -
Re: Navigation Bar Change
by gamamulya July 9th 2011, 3:30 pm
up, i believe this already 28 hours since the last post i made ^^
could someone help it ?, or should I wait for Nera ?
could someone help it ?, or should I wait for Nera ?
gamamulya- Forumember
- Posts : 192
Reputation : 25
Language : English, Indonesian, Deutsch ( Germany ), Japanesse
Location : Everywhere Everyplaces -
Re: Navigation Bar Change
by Nera. July 9th 2011, 3:38 pm
Hi,
Im sorry. I'm a bit tired today. Have you noticed that you have spelling errors in CSS. Search and faq icons, log out also (min = mini). I haven't got the permission to see them all but I'll assume those one are not appearing cause of it.
Im sorry. I'm a bit tired today. Have you noticed that you have spelling errors in CSS. Search and faq icons, log out also (min = mini). I haven't got the permission to see them all but I'll assume those one are not appearing cause of it.
Nera.- Energetic
- Posts : 7078
Reputation : 2017
Language : English
Location : -
Re: Navigation Bar Change
by gamamulya July 9th 2011, 4:10 pm
Hi Nera, sorry, what a shame for me, wrong spelling on css -_-
ok already done,but I dont know why there`s a little space between 'search' and 'profile' bar, I thought I`m sure i change X and Y to the right size.
then remains number 2 and 4 ,
2. i want to add a text : " language " then with flags beside it, when we click the flag, it direct us to google translator.., could i use IMG tag and URL tag for it ? , and how to add it there ?
4. how to put the image centered like the navbar ?
bytheway, I`m so sorry, i dont know if you`re a bit tired today.
if you want, you can answer this later if you already feel better Nera.
ok already done,but I dont know why there`s a little space between 'search' and 'profile' bar, I thought I`m sure i change X and Y to the right size.
then remains number 2 and 4 ,
2. i want to add a text : " language " then with flags beside it, when we click the flag, it direct us to google translator.., could i use IMG tag and URL tag for it ? , and how to add it there ?
4. how to put the image centered like the navbar ?
bytheway, I`m so sorry, i dont know if you`re a bit tired today.
if you want, you can answer this later if you already feel better Nera.
gamamulya- Forumember
- Posts : 192
Reputation : 25
Language : English, Indonesian, Deutsch ( Germany ), Japanesse
Location : Everywhere Everyplaces -
Re: Navigation Bar Change
by Nera. July 9th 2011, 4:25 pm
For the space add this to CSS
Can you show me your settings for logo in a srceen shot from headers and navigation?
For those buttons do you mean something like this https://help.forumotion.com/t92113-multi-buttons-header ? You could move them down.
- Code:
#i_icon_mini_members {
display: none;
}
#i_icon_mini_groups {
display: none;
}
Can you show me your settings for logo in a srceen shot from headers and navigation?
For those buttons do you mean something like this https://help.forumotion.com/t92113-multi-buttons-header ? You could move them down.
Nera.- Energetic
- Posts : 7078
Reputation : 2017
Language : English
Location : -
Re: Navigation Bar Change
by gamamulya July 9th 2011, 5:05 pm
Sure, here it is :
For the buttons, i already follow what adam`s said,
Here is the screenshot, it appear on the top right of the page..
I need it to be a "row" beside search bar, not on a "column" on the right top of the page.
For the buttons, i already follow what adam`s said,
Here is the screenshot, it appear on the top right of the page..
I need it to be a "row" beside search bar, not on a "column" on the right top of the page.
gamamulya- Forumember
- Posts : 192
Reputation : 25
Language : English, Indonesian, Deutsch ( Germany ), Japanesse
Location : Everywhere Everyplaces -
Re: Navigation Bar Change
by Nera. July 9th 2011, 6:33 pm
Than delete the codes and you can add them as extra navigations through admin panel >> Display >> Headers and navigation >> Add a customized menu
The'll be in a row with navigations next to log out if that is what you wanted?
Has the code fixed the space?
For the logo aligment you will find this in CSS
Delete the float left.
And here also delete the text aligment left
http://i.imm.io/7hHb.png
The'll be in a row with navigations next to log out if that is what you wanted?
Has the code fixed the space?
For the logo aligment you will find this in CSS
- Code:
#logo {
float: left;
padding: 5px;
}
Delete the float left.
And here also delete the text aligment left
- Code:
#logo-desc {
margin: 0;
padding: 0;
text-align: left;
}
http://i.imm.io/7hHb.png
Nera.- Energetic
- Posts : 7078
Reputation : 2017
Language : English
Location : -
Re: Navigation Bar Change
by gamamulya July 9th 2011, 7:30 pm
1. Yes the code fixed the navigation space.
2. Thats not what i mean, i want it on the left side of search box, not search on the navigation bar, i want it under the navigation bar, 1 row below the navigation bar, the left side of search box.
3. Already give the screenshot about the forum`s logo, could help it ?
2. Thats not what i mean, i want it on the left side of search box, not search on the navigation bar, i want it under the navigation bar, 1 row below the navigation bar, the left side of search box.
3. Already give the screenshot about the forum`s logo, could help it ?
gamamulya- Forumember
- Posts : 192
Reputation : 25
Language : English, Indonesian, Deutsch ( Germany ), Japanesse
Location : Everywhere Everyplaces -
Re: Navigation Bar Change
by Nera. July 9th 2011, 7:34 pm
I'm not sure did you get me correctly. Did you do what I said here for the logo?
For the buttons
Try with this in your homebox
Nera. wrote:
For the logo aligment you will find this in CSS
- Code:
#logo {
float: left;
padding: 5px;
}
Delete the float left.
And here also delete the text aligment left
- Code:
#logo-desc {
margin: 0;
padding: 0;
text-align: left;
}
This will be your reusalt later http://i.imm.io/7hHb.png
For the buttons
Try with this in your homebox
- Code:
<span class=dugmici>
<a href="http://www.facebook.com"><img src="http://tinyurl.com/68637su" border="0" width="40px" /></a>
<a href="http://www.twitter.com"><img src="http://tinyurl.com/5wb6q7y" border="0" width="40px" /></a>
<a href="http://www.youtube.com"><img src="http://tinyurl.com/6x49z5e" border="0" width="40px" /></a>
</span>
- Code:
.dugmici {
position: absolute;
right: 100px;
margin-top: -20px;
}
Nera.- Energetic
- Posts : 7078
Reputation : 2017
Language : English
Location : -
Re: Navigation Bar Change
by gamamulya July 9th 2011, 8:27 pm
owh, sorry Nera i dont see the post before about centering logo, cz its about 2.00 AM right here, my eyes was shading 
oke, welldone about centering the logo.
but about the codes u given for icon on left-side of search box ( under navigation bar ) , I already do both of it, but the result :
oke, welldone about centering the logo.
but about the codes u given for icon on left-side of search box ( under navigation bar ) , I already do both of it, but the result :
gamamulya- Forumember
- Posts : 192
Reputation : 25
Language : English, Indonesian, Deutsch ( Germany ), Japanesse
Location : Everywhere Everyplaces -
Re: Navigation Bar Change
by Nera. July 9th 2011, 8:32 pm
Have you added the CSS too? To admin panel >> Display >> CSS
Nera.- Energetic
- Posts : 7078
Reputation : 2017
Language : English
Location : -
Re: Navigation Bar Change
by gamamulya July 9th 2011, 8:49 pm
ya, i know how to change the css, i already add it too to the CSS stylesheet
but that`s the result.*******************Extra Custom CSS*************************
.dugmici {
position: absolute;
right: 100px;
margin-top: -20px;
}
Last edited by gamamulya on July 9th 2011, 8:52 pm; edited 1 time in total
gamamulya- Forumember
- Posts : 192
Reputation : 25
Language : English, Indonesian, Deutsch ( Germany ), Japanesse
Location : Everywhere Everyplaces -
Nera.- Energetic
- Posts : 7078
Reputation : 2017
Language : English
Location : -
Re: Navigation Bar Change
by gamamulya July 9th 2011, 8:58 pm
see it on the top of mine
*******************Gama Extra Custom CSS*************************
.dugmici {
position: absolute;
right: 100px;
margin-top: -20px;
gamamulya- Forumember
- Posts : 192
Reputation : 25
Language : English, Indonesian, Deutsch ( Germany ), Japanesse
Location : Everywhere Everyplaces -
Re: Navigation Bar Change
by Nera. July 9th 2011, 11:22 pm
Remove this completely and save.
*******************Gama Extra Custom CSS*************************
*******************Gama Extra Custom CSS*************************
Nera.- Energetic
- Posts : 7078
Reputation : 2017
Language : English
Location : -
Re: Navigation Bar Change
by gamamulya July 10th 2011, 5:59 am
already remove it completely
but the result :
it appears below the ads space.
but the result :
it appears below the ads space.
gamamulya- Forumember
- Posts : 192
Reputation : 25
Language : English, Indonesian, Deutsch ( Germany ), Japanesse
Location : Everywhere Everyplaces -
Re: Navigation Bar Change
by Nera. July 10th 2011, 10:50 am
Now simply change the margin top for example -100px to move it up and so on utill it fits.
You can also move it right or left by changing pixels of the property right.
And of course change the links in HTML to whatever you want to be found there.
You can also move it right or left by changing pixels of the property right.
And of course change the links in HTML to whatever you want to be found there.
Nera.- Energetic
- Posts : 7078
Reputation : 2017
Language : English
Location : -
Re: Navigation Bar Change
by gamamulya July 10th 2011, 12:31 pm
Ok, I think all is done with Nera
Thank you Nera
Topic "Solved"
Thank you Nera
Topic "Solved"
gamamulya- Forumember
- Posts : 192
Reputation : 25
Language : English, Indonesian, Deutsch ( Germany ), Japanesse
Location : Everywhere Everyplaces -
Nera.- Energetic
- Posts : 7078
Reputation : 2017
Language : English
Location : -
Similar topics» im trying to change my navigation bar
» How do you change the navigation bar, or add something to it?
» Navigation Change
» How do you change the navigation?
» change navigation
» How do you change the navigation bar, or add something to it?
» Navigation Change
» How do you change the navigation?
» change navigation
Page 1 of 1
Permissions in this forum:
You cannot reply to topics in this forum
Facebook
Twitter
Pinterest
Youtube
