Div replacing with p in editior of concrete5
Permalink 2 users found helpful
Hi, I am developing a site in concrete 5.7 version. In the editor of concrete5 if I write <div> html tag then it was replace by <p> html tag after save. Is there any solution for this?
Thanks
Thanks
Can any one please assist?
Hi,
This is because concrete5.7 use redactor js.
Create a js folder in application and override redactor js and change its settings .
This is because concrete5.7 use redactor js.
Create a js folder in application and override redactor js and change its settings .
Thanks andrewjaff for reply.
What setting I have to change in redactor js to overcome the problem of div replacement?
What setting I have to change in redactor js to overcome the problem of div replacement?
Hi ,
Change this setting
Change this setting
replaceDivs: false
I couldn't find where to change this setting in the minimized redactor.js so here's how I solved this. It works but I have no idea if it has unintended consequences.
1) Create an /application/js folder
2) Copy /concrete/js/redactor.js into your new /application/js folder
3) Add this code to the end of your new copy of redactor.js
If anyone knows of a more elegant way to override the settings in redactor, please chime in.
1) Create an /application/js folder
2) Copy /concrete/js/redactor.js into your new /application/js folder
3) Add this code to the end of your new copy of redactor.js
$(document).ready(function(){ $('#redactor').redactor({ replaceDivs: false }); });
If anyone knows of a more elegant way to override the settings in redactor, please chime in.
Thanks for reply mhawke.
The convenient solution is to change convertDivs: false in redactor.js.
The convenient solution is to change convertDivs: false in redactor.js.
Thanks for reply andrew
In redactor js I am not getting any where
replaceDivs: false
Where I will get it?
In redactor js I am not getting any where
replaceDivs: false
Where I will get it?
This answer is update so other people can find the correct solution.
5.7.x - 5.7.3
replaceDivs does not exist in the Redactor file.
You should replace covertDivs.
Paths to the files:
/concrete/js/redactor.js
/concrete/js/build/vendor/redactor/redactor.js
--- update (comment Mhwake) ---
5.7.4 >
make copy of redactor.js and place it in /application/js make the adjustments in this file.
The 'convertDivs' solution will not work after you upgrade to 5.7.4 because it now uses Redactor 10 in which convertDivs has been changed to replaceDivs
--- update (comment Hissy) ---
5.7.5+
Overriding RedactorEditor class to customize Redactor options
https://gist.github.com/hissy/8da3e9ffe9f3935d1be8...
5.7.x - 5.7.3
replaceDivs does not exist in the Redactor file.
You should replace covertDivs.
convertDivs: true, // change this to false
Paths to the files:
/concrete/js/redactor.js
/concrete/js/build/vendor/redactor/redactor.js
--- update (comment Mhwake) ---
5.7.4 >
make copy of redactor.js and place it in /application/js make the adjustments in this file.
The 'convertDivs' solution will not work after you upgrade to 5.7.4 because it now uses Redactor 10 in which convertDivs has been changed to replaceDivs
replaceDivs: true, // change this to false
--- update (comment Hissy) ---
5.7.5+
Overriding RedactorEditor class to customize Redactor options
https://gist.github.com/hissy/8da3e9ffe9f3935d1be8...
Thanks rge for your reply.
Yes it works perfectly after changing convertDivs to false in redactor.js.
Thanks agian for your help.
Yes it works perfectly after changing convertDivs to false in redactor.js.
Thanks agian for your help.
Just a reminder that you need to make a copy of redactor.js and place it in /application/js and make your changes in the copy or else your change will be gone the next time you upgrade to a new version of concrete5.
Hi
For 5.7.3.1 I copied concrete/js/build/vendor/redactor/redactor.js
to application/js/build/vendor/redactor/redactor.js and altered convertDivs to false.
This works in a way, if I input for example <div class="hero-unit"> ..... using the html button and then click the html button to revert back to normal , I still get the Div replaced by <P>.
However if i do above without clicking on html button to revert back and just click save button , it works. Not sure why ?
Thanks
For 5.7.3.1 I copied concrete/js/build/vendor/redactor/redactor.js
to application/js/build/vendor/redactor/redactor.js and altered convertDivs to false.
This works in a way, if I input for example <div class="hero-unit"> ..... using the html button and then click the html button to revert back to normal , I still get the Div replaced by <P>.
However if i do above without clicking on html button to revert back and just click save button , it works. Not sure why ?
Thanks
The 'convertDivs' solution will not work after you upgrade to 5.7.4 because it now uses Redactor 10 in which convertDivs has been changed to replaceDivs
http://imperavi.com/redactor/docs/whats-new-10/...
Newest code on Github:
https://github.com/concrete5/concrete5-5.7.0/blob/develop/web/concre...
My test site is on 5.7.4RC2 so that's why my 'replaceDivs' solution worked for me. Sorry for the confusion.
http://imperavi.com/redactor/docs/whats-new-10/...
Newest code on Github:
https://github.com/concrete5/concrete5-5.7.0/blob/develop/web/concre...
My test site is on 5.7.4RC2 so that's why my 'replaceDivs' solution worked for me. Sorry for the confusion.
Oh yes mhawke you are right. Thanks for reply.
Thanks rge for your update for version greater than 5.7.4.
thanks alot it helped me.
Following the steps above I can't get this Redactor override to take affect - to I need to do something to make it start working?
Currently inserting div tags to html view of content editor will work but they are stripped if you go back in to edit the block.
Currently inserting div tags to html view of content editor will work but they are stripped if you go back in to edit the block.
5.7.5+
Overriding RedactorEditor class to customize Redactor options:
https://gist.github.com/hissy/8da3e9ffe9f3935d1be8...
Overriding RedactorEditor class to customize Redactor options:
https://gist.github.com/hissy/8da3e9ffe9f3935d1be8...
Thanks Hissy,
You can ignore my previous post, I was trying to follow the path listed further up this thread, but you can replace the file directly into application/js folder.
Also unlike the earlier poster you need to replace the concrete/js version of redactor.js not the deep nested path mentioned earlier. This file is minified, but if you search for 'replaceDivs' you can find the correct parameter to alter.
Thanks all.
You can ignore my previous post, I was trying to follow the path listed further up this thread, but you can replace the file directly into application/js folder.
Also unlike the earlier poster you need to replace the concrete/js version of redactor.js not the deep nested path mentioned earlier. This file is minified, but if you search for 'replaceDivs' you can find the correct parameter to alter.
Thanks all.
Am I the only one who thinks it's ridiculous to have to jump through these hoops to alter Redactor's basic settings? Is there some unintended consequences to having a page of check boxes where we could turn on/off Redator's basic behaviours?
Agreed!
Thanks, Hissy, that's great. I was doing it the hard way.
-Steve
-Steve
@hissy
Thank you hissy, that is very clever.
Thank you hissy, that is very clever.
computer went nuts - deleted!
computer went nuts - deleted!
computer went nuts - deleted!
I have not tried this, but at a guess you need to clear the override cache.
This issue is really important and deserves attention from the core developpers. At the very least, it should have an entry in the docs, it took me 1.5 hours to find.
Hi MrJC
I had problems getting this to work. As a deadline was looming I resorted to the following (horrible hack):
1) Copy concrete/js/redactor.js and save it to application/js/redactor.js
2) Open up your new redactor.js file in your code editor and do a "find and replace" for
3) Clear the cache (as JohnTheFish says)
and change it to:
Caveats:
- It's a quick and dirty hack which is likely to break Redactor every time it's updated in Concrete5. Therefore you will need to replicate the above steps after every update.
- This works for 5.7.4.2 but it may not work in later (or earlier versions)
Good luck!
I had problems getting this to work. As a deadline was looming I resorted to the following (horrible hack):
1) Copy concrete/js/redactor.js and save it to application/js/redactor.js
2) Open up your new redactor.js file in your code editor and do a "find and replace" for
replaceDivs:!0
3) Clear the cache (as JohnTheFish says)
and change it to:
replaceDivs:!1
Caveats:
- It's a quick and dirty hack which is likely to break Redactor every time it's updated in Concrete5. Therefore you will need to replicate the above steps after every update.
- This works for 5.7.4.2 but it may not work in later (or earlier versions)
Good luck!
Update - I missed Hissy's post. That looks like the right way to do it ;-)
@SmoothPixel that's what I did in the end - will study doing it properly when I get 5 lol!
Yep - me too when I get 5 :-)
As @mhawke says, there's a lot of jumping through hoops to get Redactor working.
As @mhawke says, there's a lot of jumping through hoops to get Redactor working.
Hi,
I wrote an answer to a similarly post
https://www.concrete5.org/community/forums/5-7-discussion/content-bl...
The problem is that if you use DIV in Redactor, you need to include all it content into a P tag (ie: DIV P ... /P /DIV), otherwise, Redactor breaks the DIV when we insert an element (text, image...). Look at the html view in Redactor...
Same issue with SECTION tag.
And if you use the linebreaks options (use BR instead of P), you no longer can use the P tag.
In many case, the DIV can be replaced with P or SPAN tags or moving it class to the child. And if not, there are the HTML block or it's possible to create a specific theme page.
We need to keep in mind that Redactor can't (currently) make complex design, it's for Redacting text. For the design, we have grid and theme page.
So, I think it's better to use a specific theme page to add SECTION tags, the grid system to add DIV, with Redactor inside to put the text, instead of using DIV inside Redactor.
Do you agree with me?
Thanks,
ARuben
I wrote an answer to a similarly post
https://www.concrete5.org/community/forums/5-7-discussion/content-bl...
The problem is that if you use DIV in Redactor, you need to include all it content into a P tag (ie: DIV P ... /P /DIV), otherwise, Redactor breaks the DIV when we insert an element (text, image...). Look at the html view in Redactor...
Same issue with SECTION tag.
And if you use the linebreaks options (use BR instead of P), you no longer can use the P tag.
In many case, the DIV can be replaced with P or SPAN tags or moving it class to the child. And if not, there are the HTML block or it's possible to create a specific theme page.
We need to keep in mind that Redactor can't (currently) make complex design, it's for Redacting text. For the design, we have grid and theme page.
So, I think it's better to use a specific theme page to add SECTION tags, the grid system to add DIV, with Redactor inside to put the text, instead of using DIV inside Redactor.
Do you agree with me?
Thanks,
ARuben
