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

mobile layout - hide columns #2965

Closed
Tim2468 opened this issue Dec 15, 2017 · 38 comments
Closed

mobile layout - hide columns #2965

Tim2468 opened this issue Dec 15, 2017 · 38 comments
Milestone

Comments

@Tim2468
Copy link

@Tim2468 Tim2468 commented Dec 15, 2017

It should be possible to deactivate individual columns for mobile devices.
At the moment it is only possible to deactivate whole sections.

@bainternet
Copy link
Collaborator

@bainternet bainternet commented Dec 17, 2017

@Tim2468

Can you not simply hide the widgets in that column for mobile?

@Tim2468
Copy link
Author

@Tim2468 Tim2468 commented Dec 17, 2017

Yes, it works, but what if I have many widgets in a column, e. g. 20 or more.
In this case I have to hide everything in the column manually.
Also I have to reduce the default padding of a column to zero, because the empty column still exists in mobil view.
It's not really an important feature, but I think it can save some time.

@bainternet
Copy link
Collaborator

@bainternet bainternet commented Feb 26, 2018

@Tim2468

Currently, this feature is not supported, but we will look into it in the future if we see a large demand for it.

Thanks for the feedback.

@bainternet bainternet closed this Feb 26, 2018
@randzgonz02
Copy link

@randzgonz02 randzgonz02 commented Apr 19, 2018

We also need this exact feature that @Tim2468 mentioned.

@ShadowXVII
Copy link

@ShadowXVII ShadowXVII commented Apr 26, 2018

I tried setting Column Width to 0% but it won't hide :(

@black-eye
Copy link

@black-eye black-eye commented Apr 26, 2018

+1

@sambob220
Copy link

@sambob220 sambob220 commented May 5, 2018

I would also benefit from this feature. Makes it a ton easier to optimize block and other layouts across devices.

@dinhtungdu
Copy link

@dinhtungdu dinhtungdu commented May 8, 2018

I need this feature too. Another issue when hide widget is that the column is still visible => the padding of column still affect distance between rows.

@infused-kim
Copy link

@infused-kim infused-kim commented May 25, 2018

I agree, this is a MUST. It makes working with Elementor MUCH harder.

@ljgarnes
Copy link

@ljgarnes ljgarnes commented Jun 8, 2018

I need this option as well.

@GabrielCaronLecuyer
Copy link

@GabrielCaronLecuyer GabrielCaronLecuyer commented Jun 15, 2018

I need this option as well

@juanfran-granados
Copy link

@juanfran-granados juanfran-granados commented Jul 4, 2018

+1

@bellamystudio
Copy link

@bellamystudio bellamystudio commented Jul 6, 2018

Yep, this is still necessary! +1

@reddykvishal
Copy link

@reddykvishal reddykvishal commented Jul 16, 2018

+1 Yes, this is definitely important. It would be immensely useful to hide a column on devices.

@coreaspect
Copy link

@coreaspect coreaspect commented Jul 16, 2018

looks like a workaround using CSS, pretty easy - https://www.youtube.com/watch?v=CGQnKgjbdDI

@clickharder
Copy link

@clickharder clickharder commented Jul 19, 2018

I added this code to a plugin (my guess is it would also work in the functions.php file).

if ( !function_exists( 'ch_hide_column_elementor_controls' ) ) {
	add_action( 'elementor/element/before_section_end' , 'ch_hide_column_elementor_controls', 10, 3 );
	function ch_hide_column_elementor_controls( $section, $section_id, $args ) {
		if( $section_id == 'section_advanced' ) :

			$section->add_control(
				'hide_desktop_column',
				[
					'label' => __( 'Hide On Desktop', 'elementor' ),
					'type' => Elementor\Controls_Manager::SWITCHER,
					'default' => '',
					'prefix_class' => 'elementor-',
					'label_on' => __( 'Hide', 'elementor' ),
					'label_off' => __( 'Show', 'elementor' ),
					'return_value' => 'hidden-desktop',
				]
			);

			$section->add_control(
				'hide_tablet_column',
				[
					'label' => __( 'Hide On Tablet', 'elementor' ),
					'type' => Elementor\Controls_Manager::SWITCHER,
					'default' => '',
					'prefix_class' => 'elementor-',
					'label_on' => __( 'Hide', 'elementor' ),
					'label_off' => __( 'Show', 'elementor' ),
					'return_value' => 'hidden-tablet',
				]
			);

			$section->add_control(
				'hide_mobile_column',
				[
					'label' => __( 'Hide On Mobile', 'elementor' ),
					'type' => Elementor\Controls_Manager::SWITCHER,
					'default' => '',
					'prefix_class' => 'elementor-',
					'label_on' => __( 'Hide', 'elementor' ),
					'label_off' => __( 'Show', 'elementor' ),
					'return_value' => 'hidden-phone',
				]
			);
		endif;
	}
}

This created the toggles within the advanced tab for hiding columns. I have been using it for months. I used to have it in the Responsive section but that was removed in a recent update so I just moved them over to the Advanced section. Not sure why this couldn't be incorporated in Elementor.

Personally, I like to use background images on my columns. Even if you hide all of the widgets within the column you still can see a sliver of the background image, so hiding the entire column became important. This code solved my problem.

@yaniv691
Copy link

@yaniv691 yaniv691 commented Aug 13, 2018

+1 This is very important and useful. Please add this feature.

@monaye
Copy link

@monaye monaye commented Aug 19, 2018

+1 I think this is a very important feature.

@Ricarditu
Copy link

@Ricarditu Ricarditu commented Aug 21, 2018

Thank @clickharder for this code! Works like a charm!

If it's so simple to create the controls, why not add it to the source code?

@black-eye
Copy link

@black-eye black-eye commented Aug 22, 2018

@bainternet Please consider reopening this issue.
15+ supporters since closing this issue - that's large enough demand to reconsider, isn't it?

@pixelsock
Copy link

@pixelsock pixelsock commented Aug 22, 2018

+1, please. This doesn't make any sense why this isn't an option already.

@bainternet bainternet reopened this Aug 22, 2018
@infused-kim
Copy link

@infused-kim infused-kim commented Aug 22, 2018

Hurray, it's reopened. Let's hope this gets implemented soon :)

@pixelsock
Copy link

@pixelsock pixelsock commented Aug 24, 2018

@clickharder This is a perfect solution in the meantime. Thanks for this!

@kubik101
Copy link

@kubik101 kubik101 commented Sep 11, 2018

+100
I am using Elementor Pro for the first time and looked for the ability to hide columns responsively almost immediately.

@SetayWeb
Copy link

@SetayWeb SetayWeb commented Sep 30, 2018

+1 This is vital!

@chrolm
Copy link

@chrolm chrolm commented Oct 7, 2018

+1 for this feature.

@clickharder Awesome! Thank you.

@marka33
Copy link

@marka33 marka33 commented Oct 21, 2018

+++++ This feature is needed ASAP!!!!!!!!!

@MPHood
Copy link

@MPHood MPHood commented Nov 24, 2018

Still needed

@HaileyKay28
Copy link

@HaileyKay28 HaileyKay28 commented Dec 8, 2018

Needed 👍

@Turanligil
Copy link

@Turanligil Turanligil commented Dec 14, 2018

+1 ... One year left for such a small feature with so many votes :(

@hufer
Copy link

@hufer hufer commented Dec 24, 2018

https://pafe.piotnet.com/#responsive-hide-column Piotnet Addons For Elementor Responsive Hide Column can do it for you

@wayheming
Copy link
Contributor

@wayheming wayheming commented Jan 22, 2019

+1 Yes, this is definitely important. It would be immensely useful to hide a column on devices.

@clickharder
Copy link

@clickharder clickharder commented Jan 22, 2019

I purchased Piotnet Addons for Elementor and it works exactly as I would have imagined. The code I provided works as a free option, and it would be best if Elementor included this feature, but that plugin definitely fills the gap in the meantime.

But seriously, it makes no sense that this features hasn't been added it. It almost feels like we are being ignored on purpose... ;)

@wayheming
Copy link
Contributor

@wayheming wayheming commented Jan 23, 2019

@clickharder I sent a pull request #6837 with the addition of these options, wait and see if it can accept.

@reizen703
Copy link

@reizen703 reizen703 commented Jan 28, 2019

Please add feature

@JoeRossPR
Copy link

@JoeRossPR JoeRossPR commented Feb 8, 2019

@bainternet +1 Needed! @clickharder where exactly do I need to put that code?

@davidmonteromirai
Copy link

@davidmonteromirai davidmonteromirai commented Feb 20, 2019

+1

@arielk arielk added this to the 2.5.0 milestone Feb 24, 2019
@arielk
Copy link
Contributor

@arielk arielk commented Feb 24, 2019

Closed by #6898

@arielk arielk closed this Feb 24, 2019
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Linked pull requests

Successfully merging a pull request may close this issue.

None yet