hello forum ... I have a Highlight Box styled in a particular way with CSS (class="highlight-box") and marked up as follows:
I would like the client to be able to inject a styled Highlight Box wherever they wish within a RichText area. I have tried using custom_styles to wrap the sub-elements, <h4><ul><p> etc within a <div class="highlight-box"> - but each sub-element is wrapped in a separate <div class="highlight-box"> tag.
So, I thought I'd create a shortcode:
But problems arise with CKEditor when say, setting up a Heading 4 style from the dropdown Format list. Instead of creating a separate H4 within the shortcode tags I get this:
I have a feeling I'm missing something obvious - but can't see a way to do this ... any advice anyone? Thanks!!
- Code: Select all
<div class="highlight-box">
<h4>Heading</h4>
<ul>
<li>list items</li> ...
</ul>
<p>More content </p>
</div>
I would like the client to be able to inject a styled Highlight Box wherever they wish within a RichText area. I have tried using custom_styles to wrap the sub-elements, <h4><ul><p> etc within a <div class="highlight-box"> - but each sub-element is wrapped in a separate <div class="highlight-box"> tag.
So, I thought I'd create a shortcode:
- Code: Select all
function highlight_box_handler( $params, $content=null ){
if( is_null($content) ) return '';
return '<div class="highlight-box">' . $content . '</div>';
}
But problems arise with CKEditor when say, setting up a Heading 4 style from the dropdown Format list. Instead of creating a separate H4 within the shortcode tags I get this:
- Code: Select all
<h4> [highlight_box] heading [/highlight_box]</h4>
- Code: Select all
<h4> <div class="highlight-box"> heading </div></h4>
I have a feeling I'm missing something obvious - but can't see a way to do this ... any advice anyone? Thanks!!