When using the RichText editor to insert images using the umbmediapicker from TincyMCE, the default width is always 500px. This is creating issues with my responsive website, as the images all have fixed widths. How can i change it so it inserts the image as is and does nto change the width?
You should be able to disable this by going to the "developer" section and then expand the "datatypes" folder and go to the "Rich text editor" or is it called "TinyMce 3"...? And when you click it you can change it's appearance and other options. And here you can either remove the default crop of 500 pixels or set it to a unrealistic high number so the crop won't be made.
You could also just add this CSS to your stylesheets to make sure the images will never be wider than the containers on your mobile devices.
img {
max-with:100%;
height:auto;
}
This makes sure that the image does never get wider than it's container and that it keeps the aspect ratio.
And in Umbraco 7 you cannot change the setting Jan mentions: "And when you click it you can change it's appearance and other options". The option to set the image width on insert is not available anymore in Umbraco 7.
Yeah, I noticed this yesterday when I responded to another post.
Sebastiaan added an issue for this at http://issues.umbraco.org/issue/U4-4729 - So HQ is aware of the issue but it will be a good idea to go and vote it up.
Not sure if there are more changes that needs to be made in the core.
But if you change something make sure that the cache is cleared - Try go to the web.config file and set the "Debug" attribute to true. Now you should be able to see the changes you make.
If it's set to false then the client dependency handler will minify and cache the javascript and css files, which is probably why your initial change was not visible.
RichText Editor umbmediapicker Default Width
When using the RichText editor to insert images using the umbmediapicker from TincyMCE, the default width is always 500px. This is creating issues with my responsive website, as the images all have fixed widths. How can i change it so it inserts the image as is and does nto change the width?
Thanks
Hi Hugh
You should be able to disable this by going to the "developer" section and then expand the "datatypes" folder and go to the "Rich text editor" or is it called "TinyMce 3"...? And when you click it you can change it's appearance and other options. And here you can either remove the default crop of 500 pixels or set it to a unrealistic high number so the crop won't be made.
You could also just add this CSS to your stylesheets to make sure the images will never be wider than the containers on your mobile devices.
This makes sure that the image does never get wider than it's container and that it keeps the aspect ratio.
I hope this helps.
/Jan
I have noticed this also.
And in Umbraco 7 you cannot change the setting Jan mentions: "And when you click it you can change it's appearance and other options". The option to set the image width on insert is not available anymore in Umbraco 7.
Hi guys
Yeah, I noticed this yesterday when I responded to another post.
Sebastiaan added an issue for this at http://issues.umbraco.org/issue/U4-4729 - So HQ is aware of the issue but it will be a good idea to go and vote it up.
/Jan
Hi guys
Wondering if there is a way to change this now? I am on Umbraco 7.1.4. :)
Hi Michael
Don't think it's fixed in 7.1.4 yet since it's state on the issue tracker is still "Open". Hopefully it will make it in the next patch release.
/Jan
Haha yeah. Good point :) Sorry for the silly question.
If I wanted to change the default size from 500 to 300 px would I just change these or are there more?
Did try it, but it had now effect so I changed it back again. It's in the umbraco.services.js file
/Michael
Hi Michael
Not sure if there are more changes that needs to be made in the core.
But if you change something make sure that the cache is cleared - Try go to the web.config file and set the "Debug" attribute to true. Now you should be able to see the changes you make.
If it's set to false then the client dependency handler will minify and cache the javascript and css files, which is probably why your initial change was not visible.
Hope this helps.
/Jan
is working on a reply...