Please make sure to update to WPML to the latest and check our list of Known Issues before reporting

This is the technical support forum for WPML - the multilingual WordPress plugin.

Everyone can read, but only WPML clients can post here. WPML team is replying on the forum 6 days per week, 22 hours per day.

This topic contains 5 replies, has 3 voices.

Last updated by mortenH-7 6 years, 9 months ago.

Assigned support staff: sarah.n.

Author Posts
May 16, 2013 at 11:38 am #127790


I've uploaded my own flag under edit languages and my flags are bigger then your WPML flags so they look a little weird in the admin bar, and they didn't show under edit pages.

The problem is that the flags in the adminbar and the rest of admin links to different flags. The adminbar links to /uploads/flags/ and the other flags to /sitepress-multilingual-cms/res/flags/.

I had a different name for my flags so they didn't show on the edit pages for example. The solution was to rename my flags to the country codes you use and that was solved.

In the adminbar I would prefer to see your flags or my uploaded flags but with the same dimensions as your flags.

May 16, 2013 at 12:37 pm #127823


Languages: English (English ) German (Deutsch )

Hello Marcus,

Let me try to replicate the problem and get back to you.

May 16, 2013 at 2:01 pm #127872


Languages: English (English ) German (Deutsch )

OK so I uploaded some round flags to test. You are right, the icons display huge inside the admin bar.

The reason for this is WordPress' own admin stylesheet. It sets the following:

#wpadminbar * {
    -moz-box-sizing: content-box;
    color: #CCCCCC;
    font: 13px/28px sans-serif;
    height: auto;
    letter-spacing: normal;
    margin: 0;
    padding: 0;
    position: static;
    text-shadow: 0 -1px 0 #444444;
    text-transform: none;
    width: auto;

Note the width:auto; applied to all html elements inside the wpadminbar. This forces everything including images to display in full width.

You can work around this by loading your own styles.

In your theme's functions.php file add the following:

// load custom admin styles
function custom_colors() {
   echo '<style type="text/css">
           #wpadminbar img.icl_als_iclflag{width:18px; height:12px;}
add_action('admin_head', 'custom_colors');

The above will force the img element to a set width and height. The px values you see are the default icon size of the flags that come with WPML. You can adjust those values as you see fit.

The second issue is that the custom flags I uploaded do not display for the post table columns. This is because like you mentioned, WPML is loading those flags from /sitepress-multilingual-cms/res/flags/

This is indeed a small bug. To correct this please locate the following code in sitepress.class.php inside the function add_posts_management_column($columns)

foreach($res as $r){
                $fpath = get_bloginfo('template_directory') . '/images/flags/';
            }   $fpath = ICL_PLUGIN_URL . '/res/flags/';
            $flags[$r->lang_code] = '<img src="'.$fpath.$r->flag.'" width="18" height="12" alt="'.$r->name.'" title="'.$r->name.'" />';

Replace that with:

foreach($res as $r){
				$wp_upload_dir = wp_upload_dir();
                $fpath = $wp_upload_dir['baseurl'] . '/flags/';
				$fpath = ICL_PLUGIN_URL . '/res/flags/';
            $flags[$r->lang_code] = '<img src="'.$fpath.$r->flag.'" width="18" height="12" alt="'.$r->name.'" title="'.$r->name.'" />';

I will inform our developers about this so it can be corrected in upcoming versions of WPML.

Hope the above helps. Let me know if you still have issues with this.

May 16, 2013 at 2:47 pm #127918


Thank you for your answer and I'm looking forward to your upcoming version.

May 17, 2013 at 6:50 am #128109


Languages: English (English ) German (Deutsch )

You are welcome.

May 22, 2019 at 6:48 pm #3868773


Seems this issue is still present? Uploaded SVG flags and everything is fine in the frontend, but in admin theres only massive flags