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

  Saturday, 21 January 2023
  4 Replies
  434 Visits
Hello,

I want to add responsive images in a Joomla 4 website, so that images resize on Mobile devices.
I see some articles about the responsive tab, but i can find it in the backend of Joomla.

Where / how can i enable it?

Another question, how can i make this as easy as posible for customers to upload and resize images so that they are always resposive?
Any tips?

Kind regards,

Johan van der Velde
one week ago
·
#112866
I want to add responsive images in a Joomla 4 website, so that images resize on Mobile devices.
I see some articles about the responsive tab, but i can find it in the backend of Joomla.


The Responsive tab is available in the Image Manager Extended, which you can open from the editor toolbar. See below.

https://cdn.joomlacontenteditor.net/tmp/112865-how-to-enable-the-responsive-tab-in-jce-ditor-in-joomla-4.gif

The fields in the Responsive tab are used for setting alternate images to be used on different screen sizes (generally representing different devices), so for example you can load a smaller sized image for iPhones, larger images for Tablets, etc.

Most images you insert into an article will automatically be "responsive", ie: they will resize for the device screen size and orientation, and don't need anythign else set for them. This is acheived by some css in your template stylesheet, which most templates already have, eg:

img {
max-width: 100%;
height: auto;
}

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

one week ago
·
#112867
Hi Brian,
Thanks for your help sofar!

When I click on the icon to insert a new image (see attachment JCE step 1 - arrow), I dont see the tab responsive (see attachment JCE-step2).
My question is, how can I enable the tab responsive in JCE?
Do I need to install an adition JCE extension like a plugin? I use JCE pro.

Kind regarsd, thank you in avance.

Johan van der Velde
one week ago
·
#112868
Hello Brian,

As an reaction on part 2 of your answer, I use images that are larger then presented in the article.
For example if an image is 1000 x 667, I make it smaller and chanche it to 500 x 334. See attachment JCE Question 2.

Is this the right way to insert images, or are the not responsive anymore on this way?

Kind regards.

Johan van der Velde
one week ago
·
#112869

When I click on the icon to insert a new image (see attachment JCE step 1 - arrow), I dont see the tab responsive (see attachment JCE-step2).
My question is, how can I enable the tab responsive in JCE?


This is the core Image Manager button. If you have upgraded from JCE Core to JCE Pro, you will need to add the Pro buttons you require (like the Image Manager Extended) to the editor toolbar. Please see - https://www.joomlacontenteditor.net/support/faq/editor/pro-buttons-missing-after-upgrade

For example if an image is 1000 x 667, I make it smaller and chanche it to 500 x 334. See attachment JCE Question 2.
Is this the right way to insert images, or are the not responsive anymore on this way?


Yes, this is fine. The image will still be responsive if you insert it as a smaller size.

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

  • Page :
  • 1
There are no replies made for this post yet.
Be one of the first to reply to this post!