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.

how to use image in fm toolbar

View previous topic View next topic Go down

Solved how to use image in fm toolbar

Post by Kite Trojan on April 6th 2014, 5:37 am

How do you change the FM toolbar's background to your own image/

Kite Trojan
Forumember

Male Posts : 823
Reputation : 19
Language : English

http://galacticda.forumotion.com/

Back to top Go down

Solved Re: how to use image in fm toolbar

Post by Ange Tuteur on April 6th 2014, 5:44 am

Hello Kite Trojan,

You can set a background image by using the following CSS :
Code:
#fa_toolbar { background:url('/myimage.gif'); }

Ange Tuteur
Forumaster

Male Posts : 13021
Reputation : 2684
Language : EN10, FR5
Location : Pennsylvania

http://fmdesign.forumotion.com

Back to top Go down

Solved Re: how to use image in fm toolbar

Post by Kite Trojan on April 6th 2014, 5:55 am

Now I can't see my toolbar Sad.

EDIT:
I can't see in homepage.

Kite Trojan
Forumember

Male Posts : 823
Reputation : 19
Language : English

http://galacticda.forumotion.com/

Back to top Go down

Solved Re: how to use image in fm toolbar

Post by Ange Tuteur on April 6th 2014, 6:01 am

did you change /myimage.gif to the URL of your image ?

you can use just the bg-img property too :
Code:
#fa_toolbar { background-image:url('/myimage.gif'); }

Ange Tuteur
Forumaster

Male Posts : 13021
Reputation : 2684
Language : EN10, FR5
Location : Pennsylvania

http://fmdesign.forumotion.com

Back to top Go down

Solved Re: how to use image in fm toolbar

Post by Kite Trojan on April 6th 2014, 6:24 am

Code:
#fa_toolbar { background-image:url('http://www.audentio.com/demo/mybb16/images/dark/ice/style/tcat_main.jpg'); }

im using that but it work work

Kite Trojan
Forumember

Male Posts : 823
Reputation : 19
Language : English

http://galacticda.forumotion.com/

Back to top Go down

Solved Re: how to use image in fm toolbar

Post by Ange Tuteur on April 6th 2014, 6:31 am

Repeat it on the horizontal axis :
Code:
#fa_toolbar {
  background-repeat:repeat-x;
  background-image:url('http://www.audentio.com/demo/mybb16/images/dark/ice/style/tcat_main.jpg');
}

If your default color is black you really wont notice a difference since the image is black too.

if you're still having trouble, make the bg-img declaration important.
Code:
#fa_toolbar {
    background-repeat:repeat-x;
    background-image:url('http://www.audentio.com/demo/mybb16/images/dark/ice/style/tcat_main.jpg') !important;
}

Ange Tuteur
Forumaster

Male Posts : 13021
Reputation : 2684
Language : EN10, FR5
Location : Pennsylvania

http://fmdesign.forumotion.com

Back to top Go down

Solved Re: how to use image in fm toolbar

Post by Kite Trojan on April 6th 2014, 6:38 pm

Thanks Ange, but the search bar and the Share images are extended:

Kite Trojan
Forumember

Male Posts : 823
Reputation : 19
Language : English

http://galacticda.forumotion.com/

Back to top Go down

Solved Re: how to use image in fm toolbar

Post by Ange Tuteur on April 6th 2014, 9:07 pm

It is not those images, but the height of your toolbar. Wink

You can either increase its bottom padding, or height.
Code:
#fa_toolbar { padding-bottom:6px; }

Increase the amount of pixels as needed.

Ange Tuteur
Forumaster

Male Posts : 13021
Reputation : 2684
Language : EN10, FR5
Location : Pennsylvania

http://fmdesign.forumotion.com

Back to top Go down

Solved Re: how to use image in fm toolbar

Post by Kite Trojan on April 7th 2014, 12:30 am

http://galacticda.forumotion.com/t23p210-the-last-letter#3682 If you look at the toolbar, it has a extra gray/black line.

Kite Trojan
Forumember

Male Posts : 823
Reputation : 19
Language : English

http://galacticda.forumotion.com/

Back to top Go down

Solved Re: how to use image in fm toolbar

Post by Ange Tuteur on April 7th 2014, 1:02 am

That is the default color of the toolbar you have set, the image's height does not fill that area. Instead of using an image, why don't you just do this :

Remove all your CSS to add a background image to the toolbar, and replace it with :
Code:
#fa_toolbar {
    background:#000;
    border-bottom:5px solid blue;
}

Ange Tuteur
Forumaster

Male Posts : 13021
Reputation : 2684
Language : EN10, FR5
Location : Pennsylvania

http://fmdesign.forumotion.com

Back to top Go down

Solved Re: how to use image in fm toolbar

Post by Kite Trojan on April 7th 2014, 2:26 am

Code:
border-bottom:5px solid blue;
is there anyway to change "solid blue" to a hex?

Kite Trojan
Forumember

Male Posts : 823
Reputation : 19
Language : English

http://galacticda.forumotion.com/

Back to top Go down

Solved Re: how to use image in fm toolbar

Post by Ange Tuteur on April 7th 2014, 2:30 am

Change blue to #00f

Code:
#fa_toolbar {
  background:#000;
  border-bottom:5px solid #00f;
}

the border value is :
5px : the size of the border
solid : the type of border i.e. solid, dashed..
blue : the color of the border

Ange Tuteur
Forumaster

Male Posts : 13021
Reputation : 2684
Language : EN10, FR5
Location : Pennsylvania

http://fmdesign.forumotion.com

Back to top Go down

Solved Re: how to use image in fm toolbar

Post by Kite Trojan on April 7th 2014, 2:33 am

Thanks ANge

Kite Trojan
Forumember

Male Posts : 823
Reputation : 19
Language : English

http://galacticda.forumotion.com/

Back to top Go down

Solved Re: how to use image in fm toolbar

Post by Ange Tuteur on April 7th 2014, 2:39 am

You're welcome :rose:

I usually use shorthand hex, which is 3 digits. So : #00f is equal to #0000ff in case you didn't know.

You can use both, it depends on how exact you want the color to be.

Topic solved and archived

Ange Tuteur
Forumaster

Male Posts : 13021
Reputation : 2684
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