Carousel Not displaying properly
Hi,
The Carousel is not showing properly, all the items are stacked vertically instead of horizontally,
Kindly review the image below and get back to me
Here is the page with the issues
PS: I have rolledback my Elementor to version 3.25.11 so as to temporarily fix the issue,
Please let us know when there is a plugin update or when the plugin is compatible with the Elementor Update
Thanks
Same here, thx for the tip ) i hope they will give us an udate quickly
I have exactly the same issue. I contacted Elementor Pro support, and everything points to the error coming from the Elementor Custom Skin plugin or Elementor Custom Skin Pro. When creating a loop to display in Elementor Pro using the Posts element in carousel mode, the posts stack on top of each other instead of showing one at a time. Currently, the only solution is to roll back to previous versions of Elementor for it to work properly. Could you please look into this issue? I’m a web developer, and I have several clients facing the same problem. When are you planning to release a fix for this?
I just noticed a site where I use ele-custom-skin-pro is breaking the pages where it is used upon updating to current WP build and Elementor/Pro updates.
A complete rollback to WP 6.7.1 and Ele Custom Skin Pro - 3.2.4 and Elementor - 3.24.7 with Elementor Pro - 3.24.4 seems to have fixed the issue.
Yeah, it's an issue that needs to be addressed by dudaster. Thanks.
Just pinging in that we have the same issue.
I firstly reported this to elementor since I wasnt aware our front ender added this plugin: https://github.com/elementor/elementor/issues/30022
The custom grids break when Elementor is updated. Any ideas about when this will be addressed? Turned on Debug and I'm seeing the following message instead of the correctly displaying grid:
Fatal error: Uncaught Error: Class "Elementor\Core\Schemes\Color" not found in /www/wp-content/plugins/ele-custom-skin-pro/skin/skin-custom.php:652 Stack trace: #0 /wordpress/wp-includes/class-wp-hook.php(324): {closure}(Object(ElementorPro\Modules\Posts\Skins\Skin_Posts_ECS)) #1 /wordpress/wp-includes/class-wp-hook.php(348): WP_Hook->apply_filters('', Array) #2 /wordpress/wp-includes/plugin.php(517): WP_Hook->do_action(Array) #3 /www/wp-content/plugins/ele-custom-skin/skins/skin-custom.php(53): do_action('ECS_after_style...', Object(ElementorPro\Modules\Posts\Skins\Skin_Posts_ECS)) #4 /wordpress/wp-includes/class-wp-hook.php(326): ElementorPro\Modules\Posts\Skins\Skin_Posts_ECS->register_navigation_design_controls(Object(ElementorPro\Modules\Posts\Widgets\Posts)) #5 /wordpress/wp-includes/class-wp-hook.php(348): WP_Hook->apply_filters('', Array) #6 /wordpress/wp-includes/plugin.php(517): WP_Hook->do_action(Array) #7 /www/wp-content/plugins/elementor/includes/base/controls-stack.php(1702): do_action('elementor/eleme...', Object(ElementorPro\Modules\Posts\Widgets\Posts), Array) #8 /www/wp-content/plugins/elementor/includes/base/sub-controls-stack.php(200): Elementor\Controls_Stack->end_controls_section() #9 /www/wp-content/plugins/elementor-pro/modules/posts/skins/skin-base.php(503): Elementor\Sub_Controls_Stack->end_controls_section() #10 /www/wp-content/plugins/elementor-pro/modules/posts/skins/skin-base.php(58): ElementorPro\Modules\Posts\Skins\Skin_Base->register_design_layout_controls() #11 /www/wp-content/plugins/elementor-pro/modules/posts/skins/skin-base.php(41): ElementorPro\Modules\Posts\Skins\Skin_Base->register_design_controls() #12 /wordpress/wp-includes/class-wp-hook.php(326): ElementorPro\Modules\Posts\Skins\Skin_Base->register_style_sections(Object(ElementorPro\Modules\Posts\Widgets\Posts)) #13 /wordpress/wp-includes/class-wp-hook.php(348): WP_Hook->apply_filters(NULL, Array) #14 /wordpress/wp-includes/plugin.php(517): WP_Hook->do_action(Array) #15 /www/wp-content/plugins/elementor/includes/base/controls-stack.php(1702): do_action('elementor/eleme...', Object(ElementorPro\Modules\Posts\Widgets\Posts), Array) #16 /www/wp-content/plugins/elementor-pro/modules/posts/widgets/posts.php(111): Elementor\Controls_Stack->end_controls_section() #17 /www/wp-content/plugins/elementor-pro/modules/posts/widgets/posts.php(47): ElementorPro\Modules\Posts\Widgets\Posts->register_query_section_controls() #18 /www/wp-content/plugins/elementor/includes/base/controls-stack.php(2427): ElementorPro\Modules\Posts\Widgets\Posts->register_controls() #19 /www/wp-content/plugins/elementor/includes/base/widget-base.php(1050): Elementor\Controls_Stack->init_controls() #20 /www/wp-content/plugins/elementor/includes/base/controls-stack.php(569): Elementor\Widget_Base->init_controls() #21 /www/wp-content/plugins/elementor/includes/base/widget-base.php(184): Elementor\Controls_Stack->get_stack() #22 /www/wp-content/plugins/elementor/includes/base/controls-stack.php(314): Elementor\Widget_Base->get_stack() #23 /www/wp-content/plugins/elementor/includes/base/controls-stack.php(2516): Elementor\Controls_Stack->get_controls() #24 /www/wp-content/plugins/elementor/includes/base/controls-stack.php(1158): Elementor\Controls_Stack->sanitize_settings(Array) #25 /www/wp-content/plugins/elementor/includes/base/controls-stack.php(2259): Elementor\Controls_Stack->get_data('settings') #26 /www/wp-content/plugins/elementor/core/base/base-object.php(142): Elementor\Controls_Stack->get_init_settings() #27 /www/wp-content/plugins/elementor/core/base/base-object.php(40): Elementor\Core\Base\Base_Object->ensure_settings() #28 /www/wp-content/plugins/elementor/includes/base/controls-stack.php(389): Elementor\Core\Base\Base_Object->get_settings() #29 /www/wp-content/plugins/elementor/includes/base/controls-stack.php(1204): Elementor\Controls_Stack->get_controls_settings() #30 /www/wp-content/plugins/elementor/core/base/elements-iteration-actions/assets.php(22): Elementor\Controls_Stack->get_active_settings() #31 /www/wp-content/plugins/elementor/core/base/document.php(2075): Elementor\Core\Base\Elements_Iteration_Actions\Assets->element_action(Object(ElementorPro\Modules\Posts\Widgets\Posts)) #32 [internal function]: Elementor\Core\Base\Document->Elementor\Core\Base{closure}(Array, Array) #33 /www/wp-content/plugins/elementor/includes/db.php(264): call_user_func(Object(Closure), Array, Array) #34 /www/wp-content/plugins/elementor/includes/db.php(268): Elementor\DB->iterate_data(Array, Object(Closure), Array) #35 /www/wp-content/plugins/elementor/includes/db.php(261): Elementor\DB->iterate_data(Array, Object(Closure), Array) #36 /www/wp-content/plugins/elementor/includes/db.php(268): Elementor\DB->iterate_data(Array, Object(Closure), Array) #37 /www/wp-content/plugins/elementor/includes/db.php(261): Elementor\DB->iterate_data(Array, Object(Closure), Array) #38 /www/wp-content/plugins/elementor/includes/db.php(268): Elementor\DB->iterate_data(Array, Object(Closure), Array) #39 /www/wp-content/plugins/elementor/core/base/document.php(2060): Elementor\DB->iterate_data(Array, Object(Closure)) #40 /www/wp-content/plugins/elementor/core/base/document.php(1903): Elementor\Core\Base\Document->iterate_elements(Array, Array, 'render') #41 /www/wp-content/plugins/elementor/includes/frontend.php(708): Elementor\Core\Base\Document->update_runtime_elements() #42 /www/wp-content/plugins/elementor/includes/frontend.php(686): Elementor\Frontend->handle_page_assets(1401) #43 /www/wp-content/plugins/elementor-pro/modules/theme-builder/classes/locations-manager.php(138): Elementor\Frontend->enqueue_styles() #44 /wordpress/wp-includes/class-wp-hook.php(324): ElementorPro\Modules\ThemeBuilder\Classes\Locations_Manager->enqueue_styles('') #45 /wordpress/wp-includes/class-wp-hook.php(348): WP_Hook->apply_filters(NULL, Array) #46 /wordpress/wp-includes/plugin.php(517): WP_Hook->do_action(Array) #47 /wordpress/wp-includes/script-loader.php(2272): do_action('wp_enqueue_scri...') #48 /wordpress/wp-includes/class-wp-hook.php(324): wp_enqueue_scripts('') #49 /wordpress/wp-includes/class-wp-hook.php(348): WP_Hook->apply_filters(NULL, Array) #50 /wordpress/wp-includes/plugin.php(517): WP_Hook->do_action(Array) #51 /wordpress/wp-includes/general-template.php(3064): do_action('wp_head') #52 /www/wp-content/themes/hello-elementor/header.php(24): wp_head() #53 /wordpress/wp-includes/template.php(810): require_once('/www/wp-content...') #54 /wordpress/wp-includes/template.php(745): load_template('/www/wp-content...', true, Array) #55 /wordpress/wp-includes/general-template.php(48): locate_template(Array, true, true, Array) #56 /www/wp-content/themes/hello-elementor/index.php(15): get_header() #57 /wordpress/wp-includes/template-loader.php(106): include('/www/wp-content...') #58 /wordpress/wp-blog-header.php(19): require_once('/wordpress/wp-i...') #59 /www/index.php(17): require('/wordpress/wp-b...') #60 {main} thrown in /www/wp-content/plugins/ele-custom-skin-pro/skin/skin-custom.php on line 652 There has been a critical error on this website.
@dudaster these issues have been around for a few months now - since Elementor went into V3.26x. I would love to use some of the new functionalities of Elementor V3.27x, but the buggy carousels and sliders force us to keep using V3.25x.
Pretty sure the plugins have been abandoned by the developer.
Fix for Swiper.js not Loading on Pages with Ele Custom Skin Pro Slider Feature
Hey everyone,
I encountered an issue on several sites where Swiper.js was not loading on pages, especially when the "Ele Custom Skin Pro" slider feature was enabled. After some debugging, I found that Swiper.js wasn't being loaded because of a tweak introduced in Elementor 3.27.0 – 2025-01-20.
Tweak: Enabled conditional loading of Swiper.js based on widget dependencies to reduce unnecessary assets and improve page load times
Unfortunately, it can break Swiper functionality when the slider feature is in use.
To fix this, I manually enqueued the Swiper.js assets, and it resolved the issue. Here's the code I used—hopefully, it helps you too!
Solution:
function my_theme_force_load_swiper() {
// Get the site's base URL dynamically for Elementor's conditional Swiper styles
$elementor_swiper_css = site_url( '/wp-content/plugins/elementor/assets/css/conditionals/e-swiper.min.css' );
// Check if Swiper JS is already enqueued before adding it
if (!wp_script_is('swiper', 'enqueued')) {
wp_enqueue_script(
'swiper',
plugins_url( 'elementor/assets/lib/swiper/v8/swiper.min.js', __FILE__ ),
array( 'jquery' ),
'8.4.5',
true
);
}
// Check if Swiper CSS is already enqueued before adding it
if (!wp_style_is('swiper', 'enqueued')) {
wp_enqueue_style(
'swiper',
plugins_url( 'elementor/assets/lib/swiper/v8/css/swiper.min.css', __FILE__ ),
array(),
'8.4.5'
);
}
// Check if Elementor's conditional Swiper CSS is already enqueued before adding it
if (!wp_style_is('e-swiper', 'enqueued')) {
wp_enqueue_style(
'e-swiper',
$elementor_swiper_css,
array(),
null
);
}
}
add_action( 'wp_enqueue_scripts', 'my_theme_force_load_swiper' );
To fix this, I manually enqueued the
Swiper.jsassets, and it resolved the issue. Here's the code I used—hopefully, it helps you too!
Hey Mira, thank you for that! It does solve some of the issues with the sliders, and they do display correctly after loading that code to the website. But any additional code, like custom CSS to style and position arrows and dots, is not loaded anymore. I tested and tried, but back to V3.25x for me!
To fix this, I manually enqueued the
Swiper.jsassets, and it resolved the issue. Here's the code I used—hopefully, it helps you too!Hey Mira, thank you for that! It does solve some of the issues with the sliders, and they do display correctly after loading that code to the website. But any additional code, like custom CSS to style and position arrows and dots, is not loaded anymore. I tested and tried, but back to V3.25x for me!
Noticed that there is another file that is responsible for it, updated the code
function my_theme_force_load_swiper() {
// Get the site's base URL dynamically for Elementor's conditional Swiper styles
$elementor_swiper_css = site_url( '/wp-content/plugins/elementor/assets/css/conditionals/e-swiper.min.css' );
// Check if Swiper JS is already enqueued before adding it
if (!wp_script_is('swiper', 'enqueued')) {
wp_enqueue_script(
'swiper',
plugins_url( 'elementor/assets/lib/swiper/v8/swiper.min.js', __FILE__ ),
array( 'jquery' ),
'8.4.5',
true
);
}
// Check if Swiper CSS is already enqueued before adding it
if (!wp_style_is('swiper', 'enqueued')) {
wp_enqueue_style(
'swiper',
plugins_url( 'elementor/assets/lib/swiper/v8/css/swiper.min.css', __FILE__ ),
array(),
'8.4.5'
);
}
// Check if Elementor's conditional Swiper CSS is already enqueued before adding it
if (!wp_style_is('e-swiper', 'enqueued')) {
wp_enqueue_style(
'e-swiper',
$elementor_swiper_css,
array(),
null
);
}
}
add_action( 'wp_enqueue_scripts', 'my_theme_force_load_swiper' );
Fix for Elementor Text Editor Class Change
Issue
In a recent Elementor update, the class .elementor-text-editor was renamed to .elementor-widget-text-editor.
If you had custom CSS targeting the old class, this change might break your styles.
Solution
This snippet restores the old .elementor-text-editor class without removing the new .elementor-widget-text-editor class.
It hooks into Elementor’s rendering process and adds the old class back before the page loads.
Usage
Add the following code to your theme’s functions.php file:
function add_old_elementor_text_editor_class( $widget ) {
if ( 'text-editor' === $widget->get_name() ) {
$widget->add_render_attribute('_wrapper', 'class', 'elementor-text-editor');
}
}
add_action( 'elementor/frontend/widget/before_render', 'add_old_elementor_text_editor_class' );
You're a hero! It works like a charm =)
thanks, works fine!! but shame on dudaster for not at least creating a migration option for his paid customers in order to make it easy to switch to the elementor built in loop... let alone not updating, or at least taking his plugin down after simply stopping to support it.
Hello there
This snippets don’t change anything with the slider mode display ! i ve bought your pro version a few month ago and can’t no more use this mode for my clients website…only a classic gri dis working (not a nice with design with 8 items of staff that was displayed in 5 columns slider before
Thx for your help
Hugues THIÉBAUT
Directeur Artistique
Portable : +33 (0)6.10.01.20.06 • @.> @.
Studio graphique & webdesign
126 rue du général de Gaulle – 57 050 Longeville-les-Metz • Bureau : +33(0)3.54.22.80.47
http://www.elixirlab.fr/ www.elixirlab.fr
De : Mira @.> Envoyé : vendredi 14 février 2025 14:38 À : dudaster/ele-custom-skin @.> Cc : huguesElixir @.>; Comment @.> Objet : Re: [dudaster/ele-custom-skin] Carousel Not displaying properly (Issue #952)
Fix for Elementor Text Editor Class Change
Issue
In a recent Elementor update, the class .elementor-text-editor was renamed to .elementor-widget-text-editor. If you had custom CSS targeting the old class, this change might break your styles.
Solution
This snippet restores the old .elementor-text-editor class without removing the new .elementor-widget-text-editor class. It hooks into Elementor’s rendering process and adds the old class back before the page loads.
Usage
Add the following code to your theme’s functions.php file:
function add_old_elementor_text_editor_class( $widget ) { if ( 'text-editor' === $widget->get_name() ) { $widget->add_render_attribute('_wrapper', 'class', 'elementor-text-editor'); } } add_action( 'elementor/frontend/widget/before_render', 'add_old_elementor_text_editor_class' );
— Reply to this email directly, view it on GitHub https://github.com/dudaster/ele-custom-skin/issues/952#issuecomment-2659360106 , or unsubscribe https://github.com/notifications/unsubscribe-auth/AMO5YIX3GBDYSSNSURCMYDD2PXWUBAVCNFSM6AAAAABUJJQJXOVHI2DSMVQWIX3LMV43OSLTON2WKQ3PNVWWK3TUHMZDMNJZGM3DAMJQGY . You are receiving this because you commented. https://github.com/notifications/beacon/AMO5YIQJ6J3GMDXQP7HO2RD2PXWUBA5CNFSM6AAAAABUJJQJXOWGG33NNVSW45C7OR4XAZNMJFZXG5LFINXW23LFNZ2KUY3PNVWWK3TUL5UWJTU6QKOWU.gif Message ID: @.*** @.***> >
https://avatars.githubusercontent.com/u/2544046?s=20&v=4 LeMiira left a comment (dudaster/ele-custom-skin#952) https://github.com/dudaster/ele-custom-skin/issues/952#issuecomment-2659360106
Fix for Elementor Text Editor Class Change
Issue
In a recent Elementor update, the class .elementor-text-editor was renamed to .elementor-widget-text-editor. If you had custom CSS targeting the old class, this change might break your styles.
Solution
This snippet restores the old .elementor-text-editor class without removing the new .elementor-widget-text-editor class. It hooks into Elementor’s rendering process and adds the old class back before the page loads.
Usage
Add the following code to your theme’s functions.php file:
function add_old_elementor_text_editor_class( $widget ) { if ( 'text-editor' === $widget->get_name() ) { $widget->add_render_attribute('_wrapper', 'class', 'elementor-text-editor'); } } add_action( 'elementor/frontend/widget/before_render', 'add_old_elementor_text_editor_class' );
— Reply to this email directly, view it on GitHub https://github.com/dudaster/ele-custom-skin/issues/952#issuecomment-2659360106 , or unsubscribe https://github.com/notifications/unsubscribe-auth/AMO5YIX3GBDYSSNSURCMYDD2PXWUBAVCNFSM6AAAAABUJJQJXOVHI2DSMVQWIX3LMV43OSLTON2WKQ3PNVWWK3TUHMZDMNJZGM3DAMJQGY . You are receiving this because you commented. https://github.com/notifications/beacon/AMO5YIQJ6J3GMDXQP7HO2RD2PXWUBA5CNFSM6AAAAABUJJQJXOWGG33NNVSW45C7OR4XAZNMJFZXG5LFINXW23LFNZ2KUY3PNVWWK3TUL5UWJTU6QKOWU.gif Message ID: @.*** @.***> >
Hey @huguesElixir , I'm not from their team, I'm just a user that used this plugin in many sites and tried to find a solution by myself