Skip Navigation

Open

Reported for: WPML Multilingual CMS 4.6.5

Topic Tags: Compatibility

Overview of the issue

Currently, when you are using Elementor’s Social Icons widget, it is not possible to translate its links and attributes.

Workaround

Please, make sure of having a full backup of your site before proceeding.

  • Add the below PHP code in your theme’s functions.php file:
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
    35
    36
    37
    38
    39
    40
    41
    42
    43
    44
    45
    46
    47
    48
    49
    50
    51
    52
    53
    54
    55
    56
    57
    58
    59
    60
    61
    62
    63
    64
    65
    66
    67
    68
    69
    add_action('init', function () {
        add_filter('wpml_elementor_widgets_to_translate', function ($widgets) {
            $widgets['social-icons'] = [
                'conditions' => ['widgetType' => 'social-icons'],
                'fields'     => [],
                'integration-class' => 'elementorSocialIcons'
            ];
            return $widgets;
        });
     
        /**
         * Class to translate the Elementor social-icons widget.
         *
         * @see wpmltriage-481
         */
        class elementorSocialIcons extends WPML_Elementor_Module_With_Items {
     
            /**
             * @return string
             */
            public function get_items_field() {
                return 'social_icon_list';
            }
     
            /**
             * @return array
             */
            public function get_fields() {
                return [
                    'link' => [
                        'url',
                        'custom_attributes'
                    ]
                ];
            }
     
            /**
             * @param string $field
             *
             * @return string
             */
            protected function get_title($field) {
                switch ($field) {
                    case 'url':
                        return esc_html__('Social Icon: URL', 'elementor');
                    case 'custom_attributes':
                        return esc_html__('Social Icon: Custom Attributes', 'elementor');
                    default:
                        return '';
                }
            }
     
            /**
             * @param string $field
             *
             * @return string
             */
            protected function get_editor_type($field) {
                switch ($field) {
                    case 'custom_attributes':
                        return 'LINE';
                    case 'url':
                        return 'LINK';
                    default:
                        return '';
                }
            }
        }
    });
  • Update your Elementor page and translate it again.

Leave a Reply

Please stay on topic and be respectful to others. If you need help with issues not related to this post, use our Support Forum to start a chat or submit a ticket.

You can use these tags:
<a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>