Elementor - Social Icons widget: Links and Attributes translation issues

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:

  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.