Switching to Visual Mode removed HTML code

sajo8 · Member · Jan 30, 2018 at 4:18 pm
Copy link

Add topic to favorites
I have written a guide inside a Collapsible Content (accordion effect), the appropriate ‘details’ and ‘summary’ tags, and it comes out alright.

However, when I switch to Visual mode from HTML mode, it immediately gets rid of all of my ‘summary’ tags, replacing the text mean to be the summary/button on which you click on to ‘Details’, and displacing the aforementioned text to being showed after you click on ‘Details’.

This is the effect I’m having issues with- https://en.support.wordpress.com/advanced-html/#collapsible-content-accordion-effect
The blog I’m having issues with is https://sajostwistedtech.wordpress.com (in particular, the Get Started with Dero guide)

Would appreciate any help for this annoying issue. Thanks a lot :D

The blog I need help with is: (visible only to logged in users)
justjennifer · Member · Jan 30, 2018 at 5:41 pm
Copy link
Hello there, I’m not certain that this is related to the current issue with the TinyMCE editor mentioned in this Github thread https://core.trac.wordpress.org/ticket/42908 but I’ve gone ahead and tagged your thread for Staff attention. Thanks for your patience while they get back to you.
staff-zinnia · Staff · Jan 30, 2018 at 6:02 pm
Copy link
Hi –

Thanks for the tag here, justjennifer.

I agree. This does appear to be related to the issue we’ve filed in https://core.trac.wordpress.org/ticket/42908.

Please know that a fix is planned for the upcoming release of 4.9.3.

In the meantime, my best suggestion, and what I’ve found as a temporary fix, is to stay in the html mode and publish directly from there. If you do not switch to the visual mode, and the cursor stays put in the html mode of the editor it should work.

Please give that a try and let me know. Also, feel free to write back with any other questions.

Best, Liz
sajo8 · Member · Feb 1, 2018 at 1:12 am
Copy link
Awesome, thanks! :D
sajo8 · Member · Feb 1, 2018 at 2:22 pm
Copy link
Oh, and also, when I use the collapsible content effect, then the arrow appears on the line on top of the summary, instead of right next to it.
my code is as such-
```
<details>
<summary><h5><i>Cast XMR</i></h5></summary>
So, you know....

But, regardless, it is still an option, so let's cover it!

</details>
```
And this is how it looks- http://prntscr.com/i8ojma

Is there any way to get rid of this?
dphyled · Member · Feb 1, 2018 at 2:44 pm
Copy link
Hello sajo8,

If you add style=”display: inline-block;” to each h5 tag, does it fix the issue?

In the example you posted above, would change to:
```
<details>
<summary><h5 style="display: inline-block;"><i>Cast XMR</i></h5></summary>
So, you know....

But, regardless, it is still an option, so let's cover it!

</details>
```
sajo8 · Member · Feb 2, 2018 at 10:38 am
Copy link
It does! Thanks dphyled!
staff-zinnia · Staff · Feb 2, 2018 at 3:19 pm
Copy link
Marking resolved.

No items found.