Sorry I've gotten into this program just a few days ago.
Can anyone tell me how you actually hide 2 sections on the homepage from being viewed on a mobile device?
From being viewed? or from loading in the first place?
Use CSS for the former and another thing for the latter.
TinymceWrapper: Complete back/frontend content solution.
Harden your MODX site by
passwording your three main folders:
core, manager, connectors and renaming your
assets (thank me later!)
5 ways to sniff / hack your own sites; even with renamed/hidden folders, burst them all up, to see how secure you are not.
Show me a page and I will show you the CSS to use. With no information, it is impossible for me to know how to help you.
From what I gather, this is a HTML/CSS issue, not MODx.
I need to see the HTML tag id/class
TinymceWrapper: Complete back/frontend content solution.
Harden your MODX site by
passwording your three main folders:
core, manager, connectors and renaming your
assets (thank me later!)
5 ways to sniff / hack your own sites; even with renamed/hidden folders, burst them all up, to see how secure you are not.
In your override.css
find
.featured {
background: #F2F2F2;
}
Change to:
.featured {
background: #F2F2F2;
}
@media screen and (max-width: 300px) { //300 is an example of mobile size
.featured {
display: none;
}
}
TinymceWrapper: Complete back/frontend content solution.
Harden your MODX site by
passwording your three main folders:
core, manager, connectors and renaming your
assets (thank me later!)
5 ways to sniff / hack your own sites; even with renamed/hidden folders, burst them all up, to see how secure you are not.
And just to walk you through this a bit, what Don has done is taken your 'featured' div and then specified that if the device reports its max-width is 300px or less, the featured div will not display. However if the device reports any bigger size than 300px max, then it will re-appear.
Usually the css goes something like this:
/*--------
Regular styling
--------*/
.header {}
.nav {}
.featured {}
.footer {}
/*RESPONSIVE Styling*/
@media screen and (min-width: 1780px) {
.featured {width:100%;}
}
@media (max-width: 1440px) {
.featured {width:60%;}
}
@media (max-width: 480px) {
.featured {display:hidden;}
}
Just as an example, and this organization is just to make it easier to find stuff in the css. Here I have tried to sort of walk down the size of the featured div.
One last issue is loading unnecessary data, with a phone you want to provide a lighter page. Here its still loading but just not shown. To avoid loading that...I am sorry I don't know how to do it, but it can be done without a doubt.
display:hidden :O
that needs to be display:none
Evolution user, I like the back-end speed and simplicity
