Don’t show slider & highlighted posts on mobile

Hi @ajma12

You can go to your Dashboard -> Appearance -> Customizer -> Additional CSS section and paste the following CSS code there:

@media (max-width: 768px){
	.widget_slider_area{
		display:none;
		}
	.widget_highlighted_post_area{
		display:none;
	}
}

Let me know if this works or if you have any other queries! ??

Regards,
ThemeGrill

Hello @nidwija ,
That seems to work but I had a little trouble, hope you can help me out.
Thing is, in my home page I have a slider, a “highlighted posts” area next to the slider , and another “highlighted posts” area in the upper content region (below slider)

When I put your CSS code, it also hides that second highlighted posts area and I only need to hide the first one. Since the code hides ALL of the widget_highlighted_post_area, it’s not a suitable solution here. What can I do?

Also, and most important as of now, I tried to delete that CSS portion to go back to normal, but the controls stay hidden on the mobile version. How can I go back??

Thanks!

PD: you can check the website here: https://www.thedarkmelody.com/

Hi @ajma12

You can first start by deleting the entire CSS code and replacing it with the one I provide below:

@media (max-width: 768px){
	.widget_slider_area{
		display:none;
		}
	.widget_beside_slider{
		display:none;
	}
}

If you aren’t able to delete or if you are unable to see the changes, try clearing your browser cache and try again. Let me know if this works as required!

Regards,
ThemeGrill

@nidwija yeah, it seemed to be a cache issue. Yesterday I did those steps with no effect but today it got resolved.

Now that’s the other issue I asked you, is there a way to hide one of the “widget_beside_slider” components but show the other one?

Thanks!

Hi @ajma12

For the issue the following CSS code should help. You can paste it in your Additional CSS section and check:

@media (max-width: 768px){
	.widget_slider_area{
		display:none;
		}
	.widget_beside_slider{
		display:none;
	}
}

Or are you asking for a way to show one of the posts in that section but hide others for the widget beside the slider? Do let me know so that I can provide help accordingly.

Regards,
ThemeGrill

@nidwija the code you provided me is the same one as before, it hides all the “widget_beside_slider” components.
I have 2 of those widgets on the site (one beside the slider and the other below the slider, it acts as my main section on the home page) and I need a way to only hide one of them.

If you go to https://www.thedarkmelody.com you can check what I mean.

Thanks again for all the help!

Hi @ajma12

Can you provide a screenshot showing the widgets you’re mentioning so that I can provide an appropriate solution?

Regards,
ThemeGrill

@nidwija
I’m sending you two screenshots of the homepage (www.thedarkmelody.com) showing both widgets and their respective code fragments:

Widget 1:
https://ibb.co/0M3smgP

Widget 2:
https://ibb.co/7gnpgwV

If you need anything else, please let me know.
Thanks!

Hi @ajma12

As per the screenshots, maybe the following code will help:

@media (max-width: 768px){
	.widget_beside_slider{
		display:none;
	}
}

Let me know if this still doesn’t give you the output you require.

Regards,
ThemeGrill