You need to be logged in to post in the forum - Log In

An active JCE Pro Subscription is required to post in the forum - Buy a Subscription

  Monday, 23 January 2023
  14 Replies
  284 Visits
Hello,

Is there a way to specify the order of columns on mobile? On a page we have the image on the left and the text on the right. Below that the text on the left and the image on the right. On mobile we would like the image to be displayed above the text is that possible?
one week ago
·
#112871
Columns does not currently have any options to set ordering, but your template may have some css class for this, depending on which css framework it uses (Bootstrap, UIKit etc.)

Please post a link to an example article.

Just because you're not paranoid doesn't mean everybody isn't out to get you.

one week ago
·
#112873
Hello Ryan,

We have a Joomla website with a virtueplanet template.

https://www.sexybikini.nl/de/
one week ago
·
#112874
It looks like your template is using an older version of Bootstrap, which does not have the ordering classes of Bootstrap 4/5

Try adding this to your template stylesheet:


@media (max-width:640px) {
.wf-columns-order-flip .wf-column {
order: 1;
}
}


then add the wf-columns-order-flip class to the column in the Columns dialog.

Just because you're not paranoid doesn't mean everybody isn't out to get you.

one week ago
·
#112875
Correction, the css should be:


@media (max-width:640px) {
.wf-columns-order-flip .wf-column:first-child {
order: 1;
}
}

Just because you're not paranoid doesn't mean everybody isn't out to get you.

one week ago
·
#112876
Hello Ryan,

It does work in JCE, but not on mobile.
one week ago
·
#112877
I don't see the css class as added in the front-end, this may be because the fornt-end is using cached assets, so you may need to refresh the cache in your template framework.

Just because you're not paranoid doesn't mean everybody isn't out to get you.

one week ago
·
#112878
Hello Ryan,

I must be doing something wrong, this is what I did, see attachment.
one week ago
·
#112879
Why have you added it to the _template.css file and not the template.css file?

Just because you're not paranoid doesn't mean everybody isn't out to get you.

one week ago
·
#112880
Also, I'm not referring to the Joomla cache, but the caching/compression tools in your template framework.

Just because you're not paranoid doesn't mean everybody isn't out to get you.

one week ago
·
#112881
Hello Ryan,

So I did 2 things wrong.
But it works now.

Thanks for the explanation and patience.:D
one week ago
·
#112882
We get there in the end, that's what this business is all about! :D

The next challenge is to figure out the best way to add some form of ordering to the Columns tool.

Just because you're not paranoid doesn't mean everybody isn't out to get you.

one week ago
·
#112884
Hello Ryan,

Now have this @media (max-width: 640px) { .wf-columns .wf-column:first-child { order: 99; } } css at the bottom of the website. how do i get this out.
one week ago
·
#112885
Did you add any css to the template framework that was not in the template.css file?

Just because you're not paranoid doesn't mean everybody isn't out to get you.

one week ago
·
#112886
Hello Ryan,

Found, thanks!:D
Ryan marked this post as Resolved — 1 week ago
  • Page :
  • 1
There are no replies made for this post yet.
Be one of the first to reply to this post!