Properly Display CK Editor Content

How to keep the same styling as indicated in CKEditor into the website.
Properly Display CK Editor Content
Properly Display CK Editor Content

Use the ckContent class, this class is inside bootstrapXP.css that need to be added to the wrapper of the content coming from a CK Editor field. NOTE: The wrapper cannot be a <p>

 

<div class="ckContent "><?php echo $content_res->result(0,'content_'.LANG); ?></div>

 

If after adding this classthings are not back to the default then new updates need to be implemented in KASCORE/css/bootstrapXP.css, after the changes are made update KAS.

When it comes to images, all images are set to 100% in order to adapt to responsive scenarios, for example 

 

.ckContent img{
   width:100%
 }

 

To restrict the size of an image add local class with a max-width:

 

.ckContent img{
  max-width:400px;
 }

Comments