Switch to visual editor changes content [ccode] block
-
Hi folks,
When I switch from the HTML editor to the Visual editor, the content in my [code] block changes. For example, in the HTML editor I enter (ignore the word wrapping):[code language="cpp"]
const int update_percent = 5;
const int num_loops = 100000;
int update_interval = static_cast<int>( num_loops(update_percent/100.0) );
if( update_interval == 0 )
update_interval = 1;int percent = 0;
for( int i = 0; i < num_loops; ++i )
{
if( i % update_interval == 0 )
{
percent += update_percent;
ProgressBar1->Value = percent;
Label1->Text = String().sprintf( L"Finished %d%% of work", percent );
Application->ProcessMessages();
}// do lots of work, e.g.
int s = 0;
for( int j = 0; j < 10000; ++j )
s += j;
}
[/code]If I look at the preview, it is fine. But as soon as I click on the Visual editor,
the content changes to:[code language="cpp"]
const int update_percent = 5;
const int num_loops = 100000;
int update_interval = static_cast<int>( num_loops(update_percent/100.0) );
if( update_interval == 0 )
update_interval = 1;int percent = 0;
for( int i = 0; i < num_loops; ++i ) { if( i % update_interval == 0 ) { percent += update_percent; ProgressBar1->Value = percent;
Label1->Text = String().sprintf( L"Finished %d%% of work", percent );
Application->ProcessMessages();
}// do lots of work, e.g.
int s = 0;
for( int j = 0; j < 10000; ++j )
s += j;
}
[/code]Note that the nine lines starting with
"for( int i = 0; i < num_loops; ++i ) "
in the top code have been changed to five lines in the second code. How can I prevent this? It's a pain.Thanks.
Greg ReeseThe blog I need help with is: (visible only to logged in users)
-
Hi there, is this an issue that has recently occurred? Have you always been able to post the source code in the HTML Editor and then switch to the Visual Editor without problem? https://en.support.wordpress.com/code/posting-source-code/
Please let us know which Editor you are using: Calypso or the WP Admin?
-
Hi, @gregreese,
Try this method:
Paste the code in the HTML Editor and publish your page or post without switching to the Visual Editor.
I did this and had the same result as shown here https://wp.me/P9mOlL-S.
Let us know if this is the result you wanted!
P.S. I tested using both the Calypso or the WP Admin. Both worked!
Cheers:)
-
@eemmanuelokon thanks for your help here.
@gregreese, if you are still unable to accomplish what you want to do after following @eemmanuelokon’s suggestions, please answer the questions I asked in my earlier reply and also let us know what browser and version you are using. Thanks.
-
justjennifer:
– I have posted code before and don’t remember having this problem
– I am using Calypso (the display with the light blue background)
– I am using FireFox 57.0, but I also tried this in Microsoft Edge, Internet Explorer 11 and Chrome. The same problem happens in all four browsers.eemmanuelokon:
– Thanks for your suggestion but as I mentioned in the first post, things work if I just stay in the HTML editor. The Visual editor is in general better and I’d prefer to use it. That’s why I’m trying to figure out how to work in it without it messing up the text in the [code] blocks. In addition, it's easy to accidentally click on the Visual tab instead of the HTML tab, and thus inadvertently change the content.justjennifer and eemmanueloko:
- Would you mind trying the code block in my initial post in this thread and seeing if switching to the Visual editor messes things up in your browser?
- As a side note, I tried using [code] instead of [code language="cpp"] but had the same problem. -
Hi there,
There’s definitely something weird going on here – I can replicate what you’re seeing, but with your code only. I suspected it might have something to do with the curly braces being on their own lines, or otherwise the fact that you’re using line breaks rather than paragraph breaks in the code, but I’m not able to trigger the same thing with fake code so I wonder if it could be something specific to your code that’s not playing well with the editor or our syntax highlighter.
If I repeatedly switch between visual and HTML I also see some rogue html code being added to the function at the end of your snipped. I can’t replicate that either. (By the way, I’m able to replicate the lost spacing with your code in WP-Admin as well, but there the rogue code isn’t getting added.)
Do you perhaps have any other examples of this happening? That might help narrow down exactly what’s causing this. And are you pasting this code in from somewhere else, or are you typing it directly in the editor?
While this does appear to be a bug, I also want to note you don’t need to use the HTML editor to post source code. The [code] shortcode can be used in the visual editor entirely, so unless there's other content in the post that you need to edit in the HTML view, there's really no reason to switch between the editors.
-
I suspected it might have something to do with the curly braces being on their own lines,
Possibly, but it might also have to do with the left angle bracket (<) – see below.
And are you pasting this code in from somewhere else, or are you typing it directly in the editor?
I was pasting the code in from either my programming IDE or NotePad++. In either case, they’re just text editors so they shouldn’t be doing anything weird. They do however use line breaks, not paragraph breaks.
Do you perhaps have any other examples of this happening? That might help narrow down exactly what’s causing this.
Well, I’ve narrowed it down to a minimal example – one character!
Try the following by typing the lines in directly to the HTML editor. (This avoids any issue of line breaks vs. paragraph breaks.)
[code language="cpp"]
<
[/code]Now switch to the Visual Editor and you’ll see a mess. Switch back and you’ll see that the above three lines have been changed to
[code language="cpp"]
<span data-mce-type="bookmark" id="mce_SELREST_start" data-mce-style="overflow:hidden;line-height:0" style="overflow:hidden;line-height:0" ></span><
[/code]If you use [code] instead of [code language="cpp"], you get the same error, so I don't think the problem has to do with the cpp language option. Hope this helps.
Greg Reese
-
Possibly, but it might also have to do with the left angle bracket (<) – see below.
Aha! That appears to be it. Excellent catch.
I can consistently reproduce this using both the less-than symbol and its HTML entity.
I’ve reported the bug in https://github.com/Automattic/wp-calypso/issues/20039 if you want to follow along. I can’t make any promises on when this might be fixed, though, as it’s unlikely to be a top priority. If you don’t switch to HTML mode in Calypso, or otherwise use the WP-Admin editor for posts where you need to do this your code shouldn’t be changed. I know that’s not ideal, but it’s what we have for now.
-
Kokkieh,
Thanks for looking into this and moving on it so quickly. You’ve provided excellent customer service.
Greg Reese -
-
Sorry to barge into this thread, but it (may?) relate to some frustrating things that happen to me when / if I switch between visual and html (or ‘text’ mode in the classic editor). If I go to visual to add, say a block indent, or a text color change, each time I do so, a large paragraph of junk html is added onto the bottom of my whole post – visible only in the html or text editor page.
Worse: Often, when editing/ updating an already published post, if I switch to visual, change something, and then go back to html/ text editor, all my page jumps are disabled. I think this has happened even if I don’t hit ‘update’ in visual, wait to update til I’m back in html/text mode. The code for either the ‘anchor’ or the link (I can’t now remember which) is stripped out. This is really a pain, as some of my posts have a lot of page jumps that I then have to manually reload. This has been happening for ages, it’s not new. I’m pretty sure it was happening even in my previous theme. And doesn’t happen every time, so I sometimes get fooled into thinking it’s been fixed.
I’ve posted about this page jump issue before but never had it resolved. Mostly I avoid going to visual but it’s so much easier to change text color in visual, I really wish I could use it more. Html mode is better for other things, though…
My site is https://loopbraider.com/
-
Hi @ingridcc Rather than posting into an unrelated thread (this thread is about posting source code) which sends an unnecessary email to everyone who is subscribed to the thread, Staff and volunteers can better help you if you open your own forum topic at https://wordpress.com/help/contact Thanks.
-
Please start your own thread, please, yes. As you have a paid plan, the link @justjennifer provided will actually connect you to an operator on live chat or let you submit an email ticket, or you can create a forum thread if you prefer here:
https://en.forums.wordpress.com/?new=1
Either way, please include a link to the post/page where this is happening, and let us know if this is in the My Sites or in the WP-Admin editor, and we’ll keep troubleshooting it with you there :)
- The topic ‘Switch to visual editor changes content [ccode] block’ is closed to new replies.
WordPress.com Forums 