Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

✅ 🚀 Elementor v3.4 Beta 5 Release 🚀 #15797

Closed
shilo-ey opened this issue Jul 28, 2021 · 119 comments
Closed

✅ 🚀 Elementor v3.4 Beta 5 Release 🚀 #15797

shilo-ey opened this issue Jul 28, 2021 · 119 comments
Labels
announcement Used for general announcements. help wanted Announcements that request help from users, like Public Beta testing programs. mod* solved Indicates that an Issue has been Solved, or a Feature Request has been Released.
Milestone
3.4.0

Comments

@shilo-ey
Copy link
Contributor

shilo-ey commented Jul 28, 2021 •
edited

===========

Beta 5 UPDATED - PLEASE READ BELOW!

===========

Hi Elementor Beta testers 👋

We are extremely excited to introduce our new beta version, Elementor 3.4.
This version is all about responsive design and improving performance!
As part of this version, we are unveiling one of our most anticipated features -
Additional Custom Breakpoints!

We have been working on a solution that will allow for more breakpoints, without jeopardizing the code or the performance. Now you get to be the first to experience the result - Additional Custom breakpoints alongside a more stable and better-performing editor. You’ll now be able to fully customize how your layout changes between various different screens while keeping your designs pixel perfect.

We’ve also made major performance improvements, and added visible responsive values, so you know exactly which values are inherited between layouts (for example: padding on desktop affected padding on mobile)

Try out Elementor v3.4 Beta and let us know what you think about our newest additions, including:

  • Additional Custom Breakpoints - Widescreen, Laptop, Tablet extra and Mobile extra
  • Visible Responsive Values
  • Performance improvements
  • Font Awesome icons to inline SVG experiment

Before you test, please make sure you are using:

  • Elementor v3.4.0 Beta
  • Elementor Pro v3.3.4

Introducing Additional Custom Breakpoints: Pixel Perfect Design for up to 7 Devices (#2043)

Additional Breakpoints (1)

The new additional custom breakpoints are here to provide you device flexibility and the ultimate way of responsively designing your website.

With constant device development, web creation needs to adjust. Elementor is keeping with its commitment to simplifying the process and finding ways to enable fluent web creation. With the new Additional Custom Breakpoints, you can best fit all types of device’s shapes and sizes and provide your users the best UI experience a website can provide.

youtube-video-gif

Additional custom breakpoints = Additional performance improvements

As you know, additional custom breakpoints are a feature that was long wanted by Elementor and our users. Creating this feature brought a lot of technical difficulties that required us to rethink how Elementor editor controls load without inflicting any damage to existing sites or harming performance. In this version we are making the generation and usage of responsive controls faster and more efficient throughout the Editor.

With the new control loading mechanism we managed to improve the server response time by ~23% and reduced the memory usage by ~5%. We also saved approximately ~30% off data traffic to the Editor load. Even if you do not add a single breakpoint to your website layout design these improvements will reflect.

You are welcome to read more details about our road to Additional Breakpoints and what we’ve already accomplished in version 3.2 and in this current version 3.4.

Responsive adjustments for up to 7 devices

Now you’ll be able to customize your design layout also for Tablet and Mobile extra, Laptop and Widescreen in addition to Desktop, Tablet, and Mobile.
For each breakpoint you’ll be able to manage its values individually. This will allow responsive customization possibilities while maintaining pixel-perfect designs.

Dedicated UI to make customization easier

In Elementor 3.2 we introduced you to the additional custom breakpoint responsive top bar.
In this version we also added a scale, mostly for widescreen designing. Now you’ll be able to work on a smaller screen than the one you’re designing for, while seeing the bigger picture - Just zoom out!

Cascading values

Elementor uses a cascading concept across breakpoints, which means that changes cascade down. Changes you make on a larger breakpoint cascade down to the smaller breakpoint, but this will not work vise versa; Changes to a smaller breakpoint won’t affect the higher breakpoint unless you’re designing for widescreens. In this case, Elementor is cascading up, making the Desktop device the default breakpoint.

Here’s how it works:

  1. Make sure the Experiment is active in Elementor > Settings > Experiments : Additional Breakpoints
  2. Create a new Page, edit it with Elementor and Drag & Drop any widget
  3. Open the responsive preview using the responsive icon at the bottom of the panel
  4. Make sure that the responsive panel is open up at the top of the preview, with mobile, tablet and desktop, a scale control, a cog button and a close button
  5. Click the cog button and add additional breakpoints
  6. After updating the breakpoints, a popup will appear in order to reload the Editor, and then you’ll be able to see the additional breakpoints in the responsive bar and controls
  7. Make sure that custom value breakpoints everything works as expected (the device max-width will not exceed it, and the min-width of each device is the max-width of the lower device is plus 1 pixel)
  8. Please make sure that the Widescreen device is inheriting its values from the Desktop breakpoint and when adding a value, it will apply from this breakpoint on
  9. Make sure you can scroll the widescreen horizontally. Play around with the zoom in and out. Click the reset button and make sure it is back to 100%
  10. Change responsive controls of your widget according to all the breakpoints and make sure everything is working properly

Meet The Visible Responsive Values: View your Design Values (#3356)

Responsive Values Drilldown

Visible responsive values are all about best UX practices. From now on you’ll be able to see exactly what values were inherited from one breakpoint to another.

Cross-device Consistency

You’ve all experienced a situation where you finished designing for desktop, moved on to mobile, and just couldn’t understand why you have this gap, or size of an image.
From now on, when you insert a new value to a control, it will immediately reflect as a placeholder in the next breakpoint. Allowing you to change for each breakpoint the correct responsive value.

Inheriting responsive values made easier

With every additional custom breakpoint, comes the necessity to understand what exactly was inherited from one breakpoint to another.
Now you can expect the inherited values to reflect on controls such as: padding, margin, background images, and every other numeric control presented in the editor.

Here’s how it works:

  1. Create a new page with Elementor
  2. Drag and Drop an Image Widget and apply an image of your choice
  3. Make sure you place the values on Desktop (base device), and change the Alignment to left and apply 50px of Padding (for top, buttom, left and right)
  4. Switch to Tablet. Make sure you see the alignment choose control marked with a slight faint of color as “left”, and the Padding control displays with the 50px values as placeholders
  5. Try to edit the padding while it is still linked and make sure you are able to enter a different value
  6. Switch to Mobile and make sure you see the Padding control is inheriting the value from the Tablet of 60px
  7. Play around with more controls: Select, Image, Choose etc and see the values being presented as expected
  8. Go to Frontend and make sure all of the values reflect there properly
  9. Add additional breakpoints and make sure everything works as expected

Performance Improvements: Better Performing Editor and faster page load

Performance Improvements

This version focuses on achieving faster page load by dropping support to older browsers and changing the loading mechanism of Font Awesome icons into inline SVG files. Keeping up with our commitment to simplifying the process and making constant performance improvement so your website can load rapidly, in this version we reduced JS files size on each page load by up to 110KB. Read more about how Elementor improved asset loading.

Better performing Editor with additional custom breakpoints

As mentioned above, with the new control loading mechanism we managed to accomplish major performance improvements to response time, memory usage and traffic data to the Editor load. These changes will reflect even without adding a single additional breakpoint, simply by activating the experiment.

Save up to 110KB on each page load by dropping support for outdated browsers

Elementor was introduced 5 years ago, in the days when Internet Explorer and other alternatives were in the market and needed extensive support and duplication of code to interpret the modern code it was created by. Nowadays, web browsers are capable of interpreting this modern language natively, without the need of additional interpretation.

Elementor dropped support from IE11 in version 3.0. In this version, we optimized the transpilation process by dropping the support for old browsers such as IE11.

Here’s how it works:

  1. Open the preview of any Elementor page and open your browser inspector tool
  2. Preview the page, and under Dev-tools > Network, search for frontend-modules.min.js and frontend.min.js
  3. Make sure the following file size are:
  • Frontend-modules.min.js - not gzip: 14KB
  • Frontend-modules.min.js - with gzip: 4.9KB
  • Frontend.min.js - not gzip: 35KB
  • frontend.min.js - with gzip: 10.7KB
  1. Make sure everything works as expected both on Frontend and in Preview

Experiment: Improve page speed by converting Font Awesome icons to SVG

Font icons to SVG (1)

Up until now, when adding an icon from Font Awesome, the entire library was in use on the site. By changing the loading mechanism of an icon into SVG, we save requests for Font Awesome, and save redundant files (CSS, woff2). How did we do it? During the saving process, we converted each Font Awesome icon being used in the page to its SVG entity (instead of Icon Font use, which is less efficient) using an SVG map.

Here’s how it works:

  1. Make sure the Font-Awesome Inline experiment is Inactive in Settings > Experiments
  2. Create a new page, Drag & Drop an Icon widget, and choose any icon from Font Awesome library (free)
  3. Preview the page, inspect the icon element and see that it being added via Font Awesome icon font library
  4. Go back to the Experiments tab, and activate Font-Awesome Inline experiment
  5. Reload the page you recently created inspect the icon element and make sure it was loaded using an inline SVG
  6. Make sure all assets related to Font Awesome were not loaded
  7. Make sure everything is working as expected with various widgets that contain icons both on Frontend and Editor

Security Enforcement

In this version Elementor took a proactive approach and patched dozens of potential security issues to make sure your sites are safe. Make sure you test your site so everything works out just like before.

Something isn’t functioning? Report us in this thread.

Found a vulnerability? Submit it to our bug bounty program.

More Improvements

How to Install the Beta Version

If you still haven't enabled beta testing in Elementor, please follow these steps:

Make An Impact: Share Feedback Before Features Are Released

We’re always looking to get to know Elementor customers on a deeper level. If you’re interested in meeting with our team and sharing your insights, feedback, and feature requests you’re welcome to sign up for some quality time with us here. Or download Elementor’s Dev Edition. Talk soon!

Notes

For bugs and remarks, please reply with a comment on this issue here on GitHub.

Please keep this related to the current beta only! For any other issue or feature request, feel free to open a new issue.

Designated time for release: August 17, 2021 (Estimated)

Many thanks for your support and help!

Cheers,
Elementor Team
@shilo-ey shilo-ey added the help wanted Announcements that request help from users, like Public Beta testing programs. label Jul 28, 2021
@shilo-ey shilo-ey added this to the 3.4.0 milestone Jul 28, 2021
@shilo-ey shilo-ey pinned this issue Jul 28, 2021
@fabigrafo
Copy link

Hi @shilo-ey ,

Well, finally, the most requested feature (at least with regard to the number of comments) here on GitHub is now in Elementor. It was announced a long time ago, but you never know. My pleasure!
And if it loads even FASTER, win win win.

Thanks! Finally the order of the devices in the top bar has been changed the right way round. Our many voices have probably made a difference.

Visible responsive values ​​are a blessing if you work a lot with responsive content. I had only recently commented on this thread, and now it's already in beta! Very good and extremely useful.

SVG inlines, I think that's good. My test environments are not so neutral that I can make a direct comparison.

So far everything works as expected from a purely technical point of view. When I'm on a page in the editor, I have wrong colors in some places. Everything is fine at the front end. Plugins are only Ele Free and Pro and all experiments activated except "Font-Awesome Inline" and "Hello Theme Header & Footer".

What else I noticed that wasn't even mentioned:

Bildschirmfoto 2021-07-28 um 11 58 56

I am afraid the representation is not entirely correct.

But otherwise, good work and keep it up! 🤗

@DavidGMiles
Copy link

Ok - all my responsively hidden elements are now showing - irrelevant of screen size - elements intended only for tablet are rendering on desktop - pages are virtually unviewable

@DavidGMiles
Copy link

Accordions, Toggles and FAQs - I am pretty sure the attached is not the intended look

Screenshot 2021-07-28 at 12 32 45

@DavidGMiles
Copy link

I also have one page that loaded perfectly before - and now refuses to load with a critical error - when I say page - I mean template - affecting over 100 pages on the site - it is the template for our main 'event' CPT so is kind of critical

@DavidGMiles
Copy link

As a point of explanation - all the dimmed areas on the following screenshot are responsively hidden to only appear on tablet and mobile

Screenshot 2021-07-28 at 12 35 10

Sadly this is the view on the desktop - every element is visible

Screenshot 2021-07-28 at 12 35 25

@DavidGMiles
Copy link

DavidGMiles commented Jul 28, 2021 •
edited

If I enable all the extra responsive breakpoints, obviously something happens - as my homepage looks correct now - but it seems a bit of a shock to see the whole site pretty much broken and have to do that. But now background images are not loading in the editor.

That fixes all the hidden elements that were not hidden issues - my 100+ page template is still refusing to load though

@DavidGMiles
Copy link

The options in responsive are odd - if I had 'hide on desktop' check - and I have enabled all the other breakpoint values - so widescreen and laptop, these were unchecked - logical yes - but the behaviour becomes very odd - I had it hidden, then on larger screens it suddenly showed again - the net effect of this is everything that uses the responsive visibility needs checking as what you think should be hidden isn't.

Perhaps if you have hide on desktop checked then hide on laptop and hide on widescreen should by default be checked - but that opens up headaches

@shilo-ey
Copy link
Contributor Author

Thank you @DavidGMiles
It seems like there's an issue with the JS load in the version / your instance.

We managed to identify several issues based on your feedback and will continue to fix more based on this.

Please share your system info, and if there are some steps to reproduce in a single message.

Thanks

@DavidGMiles
Copy link

Steps to reproduce the first issue - open a page - it was all over the place!

Steps for the second issue - I have yet to get the template to work again

The third issue - go to a page where hide on desktop is set - widen the browser, hidden elements show again

@DavidGMiles
Copy link

And here is what is causing my templates to crash out

Fatal error: Uncaught Error: [] operator not supported for strings in /home/556865.cloudwaysapps.com/mqdpyafvut/public_html/wp-content/plugins/elementor/includes/managers/icons.php:259 Stack trace: #0 /home/556865.cloudwaysapps.com/mqdpyafvut/public_html/wp-content/plugins/elementor/includes/managers/icons.php(297): Elementor\Icons_Manager::get_font_icon_svg() #1 /home/556865.cloudwaysapps.com/mqdpyafvut/public_html/wp-content/plugins/elementor/includes/managers/icons.php(343): Elementor\Icons_Manager::render_font_icon() #2 /home/556865.cloudwaysapps.com/mqdpyafvut/public_html/wp-content/plugins/elementor/includes/widgets/toggle.php(588): Elementor\Icons_Manager::render_icon() #3 /home/556865.cloudwaysapps.com/mqdpyafvut/public_html/wp-content/plugins/elementor/includes/base/controls-stack.php(2144): Elementor\Widget_Toggle->render() #4 /home/556865.cloudwaysapps.com/mqdpyafvut/public_html/wp-content/plugins/elementor/includes/base/widget-base.php(581): Elementor\Controls_Stack->render_by_mode() #5 /home/556865.cloudwaysa in /home/556865.cloudwaysapps.com/mqdpyafvut/public_html/wp-content/plugins/elementor/includes/managers/icons.php on line 259

@DavidGMiles
Copy link

Sliders that are set to slide - and show as sliding in the editor - now have an odd behaviour in the browser of a partial fade and jumping around - most unpleasant

@zeinnicholas
Copy link

zeinnicholas commented Jul 28, 2021 •
edited

Hey @shilo-ey, thanks for the update! Can you please detail what will be the replacement for these classes?

.elementor-hidden-desktop
.elementor-hidden-tablet
.elementor-hidden-mobile

@rodolphebertozzo
Copy link
Contributor

@shilo-ey, please see : #15473

@79ho3ein
Copy link

hi
In version 3.4 it is not possible to change the background color of the button.
Screenshot (98)
Please check the problem, is this for you too?

@KiQdev
Copy link

KiQdev commented Jul 29, 2021

hi
In version 3.4 it is not possible to change the background color of the button.
Screenshot (98)
Please check the problem, is this for you too?

I have the same, seems like the settings for buttons and images are mixed

@KiQdev
Copy link

KiQdev commented Jul 29, 2021

Background overlay images disappeared in this version, rolling back to 3.3.1 solves it

@shilo-ey
Copy link
Contributor Author

@KiQdev @79ho3ein There are several issues with the conditional display of controls in the Editor. these issues are already fixed and will be released in beta2.

Thank you!

And here is what is causing my templates to crash out

Fatal error: Uncaught Error: [] operator not supported for strings in /home/556865.cloudwaysapps.com/mqdpyafvut/public_html/wp-content/plugins/elementor/includes/managers/icons.php:259 Stack trace: #0 /home/556865.cloudwaysapps.com/mqdpyafvut/public_html/wp-content/plugins/elementor/includes/managers/icons.php(297): Elementor\Icons_Manager::get_font_icon_svg() #1 /home/556865.cloudwaysapps.com/mqdpyafvut/public_html/wp-content/plugins/elementor/includes/managers/icons.php(343): Elementor\Icons_Manager::render_font_icon() #2 /home/556865.cloudwaysapps.com/mqdpyafvut/public_html/wp-content/plugins/elementor/includes/widgets/toggle.php(588): Elementor\Icons_Manager::render_icon() #3 /home/556865.cloudwaysapps.com/mqdpyafvut/public_html/wp-content/plugins/elementor/includes/base/controls-stack.php(2144): Elementor\Widget_Toggle->render() #4 /home/556865.cloudwaysapps.com/mqdpyafvut/public_html/wp-content/plugins/elementor/includes/base/widget-base.php(581): Elementor\Controls_Stack->render_by_mode() #5 /home/556865.cloudwaysa in /home/556865.cloudwaysapps.com/mqdpyafvut/public_html/wp-content/plugins/elementor/includes/managers/icons.php on line 259

@DavidGMiles can you please share a sample of the template that causes these crashes?

Thanks

@DavidGMiles
Copy link

The template is attached - I cannot even open it in Elementor to edit - it gives me the same.

Error Details

An error of type E_ERROR was caused in line 259 of the file /home/556865.cloudwaysapps.com/mqdpyafvut/public_html/wp-content/plugins/elementor/includes/managers/icons.php. Error message: Uncaught Error: [] operator not supported for strings in /home/556865.cloudwaysapps.com/mqdpyafvut/public_html/wp-content/plugins/elementor/includes/managers/icons.php:259
Stack trace:
#0 /home/556865.cloudwaysapps.com/mqdpyafvut/public_html/wp-content/plugins/elementor/includes/managers/icons.php(297): Elementor\Icons_Manager::get_font_icon_svg()
#1 /home/556865.cloudwaysapps.com/mqdpyafvut/public_html/wp-content/plugins/elementor/includes/managers/icons.php(343): Elementor\Icons_Manager::render_font_icon()
#2 /home/556865.cloudwaysapps.com/mqdpyafvut/public_html/wp-content/plugins/elementor/includes/widgets/toggle.php(588): Elementor\Icons_Manager::render_icon()
#3 /home/556865.cloudwaysapps.com/mqdpyafvut/public_html/wp-content/plugins/elementor/includes/base/controls-stack.php(2144): Elementor\Widget_Toggle->render()
#4 /home/556865.cloudwaysapps.com/mqdpyafvut/public_html/wp-content/plugins/elementor/includes/base/widget-base.php(581): Elementor\Controls_Stack->render_by_mode()
#5 /home/556865.cloudwaysa

Please note - I had to change the file extension to be able to attach it here - this is a normal JSON export file.

elementor-43968-2021-07-29.txt

@promocot
Copy link

Breakpoints add but without the visual grids how do we know about the correct position, padding, and more, visual grids are a very important tool for making website. I also hope that in the next updates there will be something significant, for example, woo commerce full support or flexbox

@fabigrafo
Copy link

Hello again @shilo-ey . I still have two concerns:

  1. The original request on Github was yes, "Custom Breakpoints" and not "Additional Breakpoints". No problem for me, I think additional breakpoints are great and they are completely enough for me.
    I'm just asking in the public interest. Can you still expect something like this in the next step? After all, the function is still in the alpha phase.

Unfortunately, I have already read in some places that users are disappointed that it will not be completely user-defined.

  1. And will it be technically possible not to have to manually load the Elementor editor when removing or adding a breakpoint? Will it be able to work completely without charging? I think that would improve the process.

But I don't know enough about that. Were just my thoughts.

@fabigrafo
Copy link

Breakpoints add but without the visual grids how do we know about the correct position, padding, and more, visual grids are a very important tool for making website. I also hope that in the next updates there will be something significant, for example, woo commerce full support or flexbox

I think and hope that first the foundation has to be laid with the "new" way breakpoints work and then things will come that are really useful like nested elements, element presets, flexbox containers.

That will be the most interesting of this year.

And if we are FINALLY presented with custom loops?

@DavidGMiles
Copy link

And if we are FINALLY presented with custom loops?

THIS!

@promocot
Copy link

Breakpoints add but without the visual grids how do we know about the correct position, padding, and more, visual grids are a very important tool for making website. I also hope that in the next updates there will be something significant, for example, woo commerce full support or flexbox

I think and hope that first the foundation has to be laid with the "new" way breakpoints work and then things will come that are really useful like nested elements, element presets, flexbox containers.

That will be the most interesting of this year.

And if we are FINALLY presented with custom loops?

Breakpoint is full customize, try and see this

@DorShahar
Copy link

DorShahar commented Jul 29, 2021 •
edited

@fabianenzensperger - thanks for your feedback. We are aware about the UI problem with the global fonts and working to fix it. The fix should be ready for Beta 2.

As for customizing the breakpoints - you are able to customize every one beside desktop (technically speaking , desktop is not a breakpoint ...)

As for updating the Editor, at the moment, the Editor must be reloaded.

@DavidGMiles - thanks for reporting about the icons problem. We identified the cause and we are on it.
As for the other problems you encounter (s.a slider) - if in Beta 2 it will not be solved, please add a video so we could understand the problem.

@zeinnicholas - As for the classes, the only replaced class is elementor-hidden-phone which is now elementor-hidden-mobile.
The other classes are in the convention of elementor-hidden-desktop , elementor-hidden-tablet, and so on ...

@rodolphebertozzo - thank you for reporting about the UI issue. We will fix it for the Beta 3 phase.

Thank you all for reporting.

@DorShahar DorShahar reopened this Jul 29, 2021
@DavidGMiles
Copy link

if in Beta 2 it will not be solved

Is there an ETA for beta 2?

@DorShahar
Copy link

Text widget positioning - the menu has Custom in it twice

@DavidGMiles - thanks for reporting this, however, I don't experience this issue. Could you check if you have any clash with another plugin?

Hidden responsive classes being ignored - see screenshot - the containing div clearly has elementor-hidden-tablet applied - but it still shows on the front-end

@DavidGMiles - could you please share the steps to reproduce?

@parasshah195 - thanks for reporting. Could you share a video with steps to reproduce for the first bug?

Thanks !

@DavidGMiles
Copy link

Hidden responsive classes being ignored - see screenshot - the containing div clearly has elementor-hidden-tablet applied - but it still shows on the front-end

@DavidGMiles - could you please share the steps to reproduce?
Sure - go to this page

https://dev.natureslens.co.uk/

You have to scroll to get the area that starts 'WORLDWIDE ITINERARIES TO INSPIRE YOU' in screen - this is the part we are interested in

Narrow your window ... as it gets narrower, you will see it switch from three columns to 2 with buttons at the bottom

Keep narrowing the window - now it switches to 1 column with a 'contact us' button floating on the right - another row, another column with an 'our tours' button floating on the right

Inspect the source - both those buttons should be hidden, they have the right classes on them and hide in the editor, but they do not hide in when viewed in a browser

This is not an editor issue - this is a display issue

Is that ok for you?

@DorShahar
Copy link

DorShahar commented Aug 11, 2021 •
edited by shilo-ey

Hey all,

We just released a new beta version, please update your version to v3.4.0 Beta 4, which is our release candidate (RC).

Please keep this related to the Current beta Only! any other Issue Report or Feature Request feel free to open a new issue.

Thanks again, everyone!

@DavidGMiles
Copy link

THANK F*** FOR THIS ONE - THIS MAKES MY DAY!

@DavidGMiles
Copy link

yes-yes-yes-oh-yes-yes-yes

I can confirm that the Gallery widget with Dynamic gallery applied can now be edited & deleted - it works as it should again

@DavidGMiles
Copy link

DavidGMiles commented Aug 11, 2021 •
edited

But there is now a new issue with the galleries - galleries in tabs no longer recognise when they are made visible - this is a new bug

I have 7 galleries, one each at the bottom of a tabbed area - they lazy load, but they don't that is the issue now, you can get them to.load by making a tiny resize event on the window, which I presume triggers some javascript - and by voodoo they appear - but this is not a practical solution

For now - I have disabled Lazy Load on the galleries - they are only 3 or 4 images each - so this Is not a big deal - I TAKE IT BACK THIS DOES NOT CAUSE THE IMAGES TO BE SHOWN

I can confirm that switching off Lazyload causes all the images to be loaded on page load - this is not a big deal for this page - but the javascript to show the galleries only triggers for the one that is actually visible

You can see this on my super-slow server here - https://dev.natureslens.co.uk/destinations/

The gallery at the bottom of the Africa tab is loaded on page load - switch tabs using the continent maps - and the galleries at the base of those tabs do not render

Marginally resize the page and the rendering happens

YitzhakAvm pushed a commit to YitzhakAvm/elementor that referenced this issue Aug 11, 2021
Fix: Responsive values cascade wrongly with different dimensions on d…
dcc3a05 
…ifferent breakpoints (elementor#15797) [ED-4665]
@DavidGMiles
Copy link

This ghost value of the setting above is oddly annoying - the value is correct but it is useless without the unit also being correct - this looks at first glance like the font size is 2px - and that value is coming from the CSS settings above - that is this inheriting

But it is actually incorrect - that value is 2em - the unit needs to come down as well

Screenshot 2021-08-11 at 17 35 22

@DavidGMiles
Copy link

Headings are not acting in a respnsive manner. I have set specific EM font sizes for tablet and phone - resizing the window has no effect

Editor window shows how it should look - large browser shows how it does look

Screenshot 2021-08-11 at 17 43 01

Editor window shows how it should look - large browser shows how it does look

Screenshot 2021-08-11 at 17 44 05

Also note the part below the image - alignment and spacing is wrong - it is as though parts of the CSS are just not there

@AbanobAkram
Copy link

@udidol Thanks so much.

I have a small question, if I have a carousel widget with a responsive "Slides to Show" control, need to send the number of slides to show for different screens from PHP to JS, this will not be doable after v3.4?

@matipojo matipojo mentioned this issue Aug 12, 2021
Merged
@udidol
Copy link
Contributor

udidol commented Aug 13, 2021

@udidol Thanks so much.

I have a small question, if I have a carousel widget with a responsive "Slides to Show" control, need to send the number of slides to show for different screens from PHP to JS, this will not be doable after v3.4?

Hi @AbanobAkram What you are asking will still be possible.

@shilo-ey shilo-ey changed the title 🚀 Elementor v3.4 Beta 3 Release 🚀 🚀 Elementor v3.4 Beta 4 Release 🚀 Aug 15, 2021
@DorShahar
Copy link

@DavidGMiles - thank you for reporting. We are aware of the bugs and we will fix them soon.

@DorShahar
Copy link

DorShahar commented Aug 15, 2021 •
edited

Hey all,

We just released a new beta version, please update your version to v3.4.0 Beta 5, this is the release candidate final version (RC2).

Please keep this related to the Current beta Only! any other Issue Report or Feature Request feel free to open a new issue.

Thanks again, everyone!

@shilo-ey shilo-ey changed the title 🚀 Elementor v3.4 Beta 4 Release 🚀 🚀 Elementor v3.4 Beta 5 Release 🚀 Aug 15, 2021
@webdevs-pro
Copy link

@Oxibug thanks!

@shilo-ey
Copy link
Contributor Author

Hi everyone 👋,

This version has been officially released!

Thank you all for your time, efforts, and precious feedback!

Cheers

@shilo-ey shilo-ey removed the help wanted Announcements that request help from users, like Public Beta testing programs. label Aug 16, 2021
@shilo-ey shilo-ey unpinned this issue Aug 16, 2021
@Oxibug
Copy link
Contributor

Oxibug commented Aug 16, 2021

@shilo-ey
Can you mention the PR #13618 in the Changelog list, so the developers learn how to use it until you add it in the docs?

Thanks!

@pratikshasaman
Copy link

How to add compatibility to the Elementor addons if the active custom breakpoint is active?

@udidol
Copy link
Contributor

udidol commented Sep 19, 2021 •
edited

@pratikshasaman
You can check whether any custom or additional breakpoints are set by calling:

if ( isset( \Elementor\Plugin::$instance->breakpoints->has_custom_breakpoints() ) ) {
    // Do your thing here
}

You can check whether a particular breakpoint exists by attempting to fetch the breakpoint, or fetch all active breakpoints and check for your particular index:

Method 1:
\Elementor\Plugin::$instance->breakpoints->get_active_breakpoints( $breakpointName ) - If this returns null, the breakpoint you passed is not active.

Method 2:

$active_breakpoints = \Elementor\Plugin::$instance->breakpoints->get_active_breakpoints();

if ( isset( $active_breakpoints[ $breakpointName ] ) {
    // Do your thing here
}

@nicholaszein nicholaszein added help wanted Announcements that request help from users, like Public Beta testing programs. solved Indicates that an Issue has been Solved, or a Feature Request has been Released. labels May 24, 2023
@elementor elementor locked and limited conversation to collaborators May 24, 2023
@nicholaszein nicholaszein changed the title 🚀 Elementor v3.4 Beta 5 Release 🚀 ✅ 🚀 Elementor v3.4 Beta 5 Release 🚀 Aug 15, 2023
@nicholaszein nicholaszein added the announcement Used for general announcements. label Sep 23, 2023
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Assignees
No one assigned
Labels
announcement Used for general announcements. help wanted Announcements that request help from users, like Public Beta testing programs. mod* solved Indicates that an Issue has been Solved, or a Feature Request has been Released.
Projects
None yet
Milestone
3.4.0
Development

No branches or pull requests