Menu Bar Country Flag Icons


(Monica Sayegh) #1

Hi, I am designing a multi -language web for my client and I may use RWML stack, not sure yet, I might just use the Offset page BUT I have a question and I really do not know how to explain it:

How can I use a country flag image icon (such as Germen flag) in the menu bar? I normally use for example for menu bar icons ( Home. How can I insert a country flag image, instead of the flag symbol?
Thank you!


(Keith Flanagan ) #2

Hi Monica,

I use FontAwsome icons for my menu selections on one of my websites. Costal Photo Enthusiasts site.. The Font Awesome site does not have colored flags but this should at least give you an idea of how to load any icon as a menu item.

Instead of giving your page a name like “Home” or “About” you place the code as the name of your menu item. In the case of my home page on the site, the page is named, <i class="fa fa-home fa-2x"></>

Doing this I get the Home icon for the menu item.

I know it isn’t the full answer but it should show you where to go about doing what you want to do.

Good luck and let me know when you get it figured out. I would love to see.


(scott williams) #3

I did one but had to put it in a bar below because they had a full menu and wanted to be able to select 5 languages. What theme are you using? if foundation you could use the EC area of topbar nav.


(Monica Sayegh) #4

Thanks for your reply, yeh with Font Awesome, I will not get what I want (actual flag image) it might be a way that I can use an image source code, but I am not expert so I do not know what the coding would be :slight_smile: . sure will update you!


(Monica Sayegh) #5

I am using Show Theme https://weaverthemes.com/themes/ and I did use the Extra content (1) for writing on the Banner so my options are limited to use EC.


(Rob D) #6

I am also using RWML for my 3-lingual family portal. I use ExtraContent-6 for placing flags symbolizing languages. Depending on the theme you are using and on your particular design, a different EC may be more suitable for you.


(Monica Sayegh) #7

Thanks @Rovertek, I think I should use RWML show menu and insert the image flag in the EC, but the location of the extra cont 6 is in the bottom page in SHOW Theme!!!


(Jannis from inStacks Software) #8

Don’t forget: flags are no languages.


(Rob D) #9

Yeah, that’s why I said “…depending on your theme…” Does your theme have an option to show you exact locations of extra content areas, like this?


(Konstantijn Van Calster) #10

Yes indeed I have done the same on www.bensaglobaltrading.com, html code. Actually you can do the same with the rest of menu items, replace text with icons introducing the needed HTML codes.
… and yes indeed depending of your theme I suppose, not sure.


(Monica Sayegh) #11

I know, see the EC here in the Theme, nothing above menu bar
http://preview.weaverthemes.com/show/built-in-tools/extra-content/


(Monica Sayegh) #12

@TINO may I have the HTML code you used :slight_smile:


(Konstantijn Van Calster) #13

Hi Monica, for which item you will need them?
-I mean HOME, Contact, etc


(David) #14

This is a way you can add additional extra content areas:


(Monica Sayegh) #15

@TINO for the county flags is it : ???


(Monica Sayegh) #16

thanks @thang for your input!


(Konstantijn Van Calster) #17

For flags ok Monica understand, check this out:

http://flag-icon-css.lip.is
https://www.flag-sprites.com
http://www.phoca.cz/cssflags/#using

You can get there the css codes of the flags and use it on RWML.


(Konstantijn Van Calster) #18

… and yes indeed as @thang recommend you can add EC.


(Monica Sayegh) #19

@TINO thank you so much! appreciated.


(Konstantijn Van Calster) #20

@monica It’s a pleasure, if anything else let’s me know :slight_smile: