Height property of CKEditor in Drupal 7

Submitted by larsbo on Sat, 2012-02-18 15:37
Posted: 
2012-02-18

I wanted to set the height property of my CKEditor, but I couldn't get anything to work. Setting the height of any parent div would just cause the editor to overflow. After some googling I then found this thread: http://groups.drupal.org/node/170324. After reading that I then added the below function to my theme's template.php.

/**
 * Implementation of CKEditor default height (http://groups.drupal.org/node/170324)
 */
function larsboorg_wysiwyg_editor_settings_alter(&$settings, $context) {
  if($context['profile']->editor == 'ckeditor') {
    $settings['height'] = 300;
  }
}
  


  
  

          
Comments

      
  



  


    
    

   
      

        
      

      

        John      

      

        Dec-04 2013      


    

  


  


        

    
    

      
Thanks alot for the link, quickly solved this problem for a site using Drupal WYSIWYG with CKEditor 4.3, which for some reason was not respecting the Drupal height settings for the form field.


In any case, I simply changed "larsboord" to the name of my Drupal theme, pasted the code at the end of the template.php file and that was it!


          
 

      








  


    
    

   
      

        
      

      

        John      

      

        Dec-04 2013      


    

  


  


        

    
    

      
Only challenge I can see with this approach is the need to autogrow the CKEditor field.  I don't think this is possible with the template.php approach?  Thoughts anyone?


          
 

      








  


    
    

   
      

        
      

      

        larsbo      

      

        Dec-04 2013      


    

  


  


        

    
    

      
Hey John,


Thanks for the comments, I don't have any clear ideas about auto-grow but would love to hear if anyone else do. Perhaps the dedicated CKeditor module allows better drupal/ckeditor integration :-) Also, perhaps some CKEditor plugin like AutoGrow (http://ckeditor.com/addon/autogrow) could help - although autogrow only seems to work on the x-axis...


          
 

      








  


    
    

   
      

        
      

      

        John      

      

        Dec-10 2013      


    

  


  


        

    
    

      
There are advantages and disadvantages to each module when using CKEditor.  I generally prefer the CKEditor Module with CKEditor in Drupal, but it does not seem to work with oembed.  As part of a general effort to simplify the UI for site members, I found it was important to be able to include easy oembed within the content body field, and this just would not work with the CKEditor module.


I switched to WYSIWG and added a little helper module called Simple Editor (Simple oembed) and got the oembed functionality I needed.


          
 

      








  


    
    

   
      

        
      

      

        John      

      

        Dec-10 2013      


    

  


  


        

    
    

      
Hio Lars:


 


Assuming all content entry body fields use ckeditor, how would you go about limitiing the height restriction to just one content type, or varying it for one content type or form type?  


For example, I need a height restriction of say 150px for the comment form for all of my content types, and I need to limit the height of all ckeditor enabled fields on one of my content types, "wall" to 150px.  Otherwise, I need a height of 300px.


For the 'wall' content type I tried this but it didn't work:


/**


 * Implementation of CKEditor default height (http://groups.drupal.org/node/170324)


 */


 function THEMENAME_wysiwyg_editor_settings_alter(&$settings, $context) {


 if($context['profile']->editor == 'ckeditor' AND !empty($node) && $node->type == 'wall') {


    $settings['height'] = 150;


 


Thoughts?


 


          
 

      








  


    
    

   
      

        
      

      

        John      

      

        Dec-10 2013      


    

  


  


        

    
    

      
Just in case someone stumbles across this, the PHP above is missing the last two brackets and note that THEMENAME must be replaced by the name of yoru theme... and it doesn't work!


/**


 * Implementation of CKEditor default height (http://groups.drupal.org/node/170324)


 */


 function bamboo_wysiwyg_editor_settings_alter(&$settings, $context) {


 if($context['profile']->editor == 'ckeditor') {


    $settings['height'] = 150;


  }


  }


 


 


          
 

      








  


    
    

   
      

        
      

      

        larsbo      

      

        Dec-10 2013      


    

  


  


        

    
    

      
Hey John


I am not sure if this works, but if you define a different text format and WYSIWYG profile for comments fields, wall-fields etc. then maybe you can do something like this:


/**

 * Implementation of CKEditor default height (http://groups.drupal.org/node/170324)

 */

 function bamboo_wysiwyg_editor_settings_alter(&$settings, $context) {

 if($context['profile']->editor == 'ckeditor' && $context['profile']->textformat == "filtered-html-for-comments") {

    $settings['height'] = 150;

  }

  }
But I am not sure what you can pull from the $context var and the $context['profile']->textformat is just a guess, but try printing it, maybe there is something in there :-)


          
 

      








  


    
    

   
      

        
      

      

        John      

      

        Dec-10 2013      


    

  


  


        

    
    

      
Hi Lars:


 


That is an excellent idea.  I'll give it a try and let you know.


          
 

      








  


    
    

   
      

        
      

      

        John      

      

        Dec-10 2013      


    

  


  


        

    
    

      
Just remembered a problem with this approach. There is a strange bug in WYSIWYG module that prevents the default assignment of different text formats for types of users.  


https://drupal.org/node/1278886


For example, if Authenticated Users have "Filtered HTML" as their first choice in the text format list for a form field, then that is what they get by default, no matter what text format you choose when creating the field!


The only way to avoid this bug is to enter some default text into the field.  Even a "." is sufficient, but there has to be something, and I don't really want to have default text, not even a "." in the comment form body field.


          
 

      








  


    
    

   
      

        
      

      

        larsbo      

      

        Dec-10 2013      


    

  


  


        

    
    

      
Wow, that's really annoying!


          
 

      








  


    
    

   
      

        
      

      

        John      

      

        Dec-10 2013      


    

  


  


        

    
    

      
Real Life English  is 150+ Drupal modules, all carefully selected and installed by me, and all with a mind of their own!


          
 

      








  


    
    

   
      

        
      

      

        John      

      

        Dec-10 2013      


    

  


  


        

    
    

      
Again, should someone stumble across this thread, the following might be a solution to the text formating issue, you will need to build a custom module, but there is a link in the thread explaining how to do that:


https://drupal.org/node/1003262


Going to give it a try.


          
 

      








  


    
    

   
      

        
      

      

        John      

      

        Dec-10 2013      


    

  


  


        

    
    

      
Again, should someone stumble across this thread, the following might be a solution to the text formating issue, you will need to build a custom module, but there is a link in the thread explaining how to do that:


https://drupal.org/node/1003262


Going to give it a try.


          
 

      








  


    
    

   
      

        
      

      

        Gearmonkey      

      

        Dec-11 2013      


    

  


  


        

    
    

      
Add the following to the "CKEditor Profile" --> "Custom JavaScript Configuration" --> "config.height='450';"


Change 450 to whatever size you want.


          
 

      








  


    
    

   
      

        
      

      

        John      

      

        Dec-31 2013      


    

  


  


        

    
    

      
I think that is only an option with the CKEditor module, not the WYSIWYG module?


For ckeditor 4.3 I guess the admin could modify the config.js file at libraries/ckeditor/config.js.  Thoughts?


          
 

      





      
Add new comment