By spade on

TinyMCE and FCKeditor are very powerful and allows users to design their text as much as their heart desires.

I feel that smacks right in the face of what one tries to accomplish by separating content and design.

Therefore I like to ask if there is another editor (or a configuration for one of those named here) that only offers buttons or selectors to insert the HTML tags: <h1> <h2> <h3> <h4> <h5> <h6> <em> <strong> <code> <ins><del> <blockquote> <q> <sub> <p> <br> <ul> <ol> <li> <dl> <dt> <dd> <sup> <cite> <a> and <address> <span> (I may have missed some and/or listed some that should not be there)?

I like to offer my users maximum help with semantic tagging without the need to know HTML.

Kind regards,

Frank

⋅ Categories: Drupal 5.x

Comments

styro’s picture

styro commented

wymeditor? It aims to be purely semantic editor.

But if that isn't quite what you want - don't forget that TinyMCE can be heavily configured to just provide semantic options and even to rewrite non semantic elements as semantic ones.

Basically with TinyMCE, you put a theme function in your template.php (see the instructions in the TinyMCE Drupal module) that contains all the TinyMCE configuration options (see the TinyMCE docs for more info) you want to set - no need to edit any TinyMCE files. It can take a while to tune and test it, but you can get TinyMCE to behave pretty well (pity the defaults aren't like that).

What I recommend is using the TinyMCE advanced profile for all users (you need the advanced profile for all the best config options), and then get your Drupal theme to change the configuration dynamically if you need need different settings for different user roles.

--
Anton
New to Drupal? | Troubleshooting FAQ
Example knowledge base built with Drupal

spade’s picture

spade commented

Thank you Anton,

Too bad wymeditor is not ready for prime time ...

I am too new to Drupal to feel comfortable following your recommendation, even though it sounds alright. Can't belief that I am the only one who wants this. Was hoping for more ready to use instruction from somebody who has cut through the slack already. Isn't there anybody out there?

Kind regards,

Frank

styro’s picture

styro commented

OK this is a bit of a code dump, but it should give you a starting point.

All these TinyMCE settings can be looked up at:

http://wiki.moxiecode.com/index.php/TinyMCE:Configuration

eg: valid_elements is an important one:
http://wiki.moxiecode.com/index.php/TinyMCE:Configuration/valid_elements
it lets you do stuff like replace <i>...</i> with <em>...</em> or just disallow <i>...</i> altogether.

This config was a bit of a pain to create (the defaults should be closer to this IMO), and you'll need to tune it a bit for your own site, but it actually produces pretty clean semantic markup after all this palaver (even it it isn't perfect yet). I will move to wymeditor one day though :)

Put these two functions in your themes template.php file (and then start tweaking):

<?php

function phptemplate_tinymce_theme($init, $textarea_name, $theme_name, $is_running) {
  // Due to not wanting to customise the TinyMCE code itself, we have decided to
  // have all users use the Advanced TinyMCE theme. This is because only the Advanced
  // theme offers run time layout configuration. This function checks whether or not the
  // user is an admin, and adjusts TinyMCE accordingly.
  switch ($textarea_name) {
    // Disable tinymce for these textareas
    case 'teaser':
    case 'log': // book and page log
    case 'img_assist_pages':
    case 'caption': // signature
    case 'pages':
    case 'access_pages': //TinyMCE profile settings.
    case 'user_mail_welcome_body': // user config settings
    case 'user_mail_approval_body': // user config settings
    case 'user_mail_pass_body': // user config settings
    case 'synonyms': // taxonomy terms
    case 'description': // taxonomy terms
    case 'signature':
    case 'site_mission':
    case 'site_footer':
    case 'site_offline_message':
    case 'page_help':
    case 'user_registration_help':
    case 'user_picture_guidelines':
    case 'message':
    case 'relatedlinks_fieldset-relatedlinks':
      return;
  }
  
  // Common config
  $init['theme'] = 'advanced';
  $init['theme_advanced_resizing'] = 'true';
  $init['theme_advanced_statusbar_location'] = 'bottom';

  $valid_elements = 'area[alt|href|coords|shape],code,img[src|alt|usemap|title|class],map[name]';
  $valid_elements .= ',#p[class],-div[class],-ul[class],-ol[class],-li[class],-h1,-h2,-h3,-h4,-h5,-h6,-blockquote,br,hr,pre';
  $valid_elements .= ',+a[class|title|target|name|href],-span[class],-em/-i,-strong/-b,-u,-strike,-abbr[title],-acronym[title]';
  $valid_elements .= ',-cite,-sub,-sup,caption,dfn';
  $valid_elements .= ',table[class],thead[class],tfoot[class],tbody[class],tr[class],td[colspan|rowspan|class|width],th[colspan|rowspan|class|width],col[span|class|width],colgroup[span|class|width]';
  $valid_elements .= ',-dl[class],-dt[class],-dd[class]';
  $init['valid_elements'] = $valid_elements;
  $init['invalid_elements'] = '';
  
  $init['doctype'] = '<!DOCTYPE html PUBLIC \"-//W3C//DTD XHTML 1.0 Strict//EN\" \"DTD/xhtml1-strict.dtd\">';
  $init['object_resizing'] = 'false';
  $init['gecko_spellcheck'] = 'true';
  $init['inline_styles'] = 'true';
  $init['fix_list_elements'] = 'true';
  $init['fix_table_elements'] = 'true';
  $init['remove_linebreaks'] = 'false';
  $init['apply_source_formatting'] = 'true';
  $init['entity_encoding'] = 'raw'; // rely on Drupal filters for entity conversion
  
  $init['theme_advanced_styles'] = 'Lead in=leadin;Highlight=hilite;Note=note';
  $init['theme_advanced_blockformats'] = 'h2,h3,h4,p,div,blockquote,dt,dd,code';
  
  // Needs a lot more testing
  //$init['valid_child_elements'] = 'h1/h2/h3/h4/h5/h6[%istrict],ul/ol[li],table[thead|tbody|tfoot|tr],thead/tbody/tfoot[tr],tr[td|th],strong/b/p/div/em/i/td/th[%istrict|#text]';
  
  // Role specific config
  // this is where we put TinyMCE settings that need to change for different user roles 
  if (yourthemename_is_staff_member()) { // Note: change this function name to match your theme
    // staff members get extra plugins and buttons
    $init['plugins'] = 'table,searchreplace';
    
    $init['theme_advanced_buttons1'] = 'bold,italic,underline,strikethrough,separator,undo,redo,separator,bullist,numlist,separator,link,unlink,anchor,separator,formatselect,styleselect,separator,search,replace';
	  $init['theme_advanced_buttons2'] = 'tablecontrols,separator,removeformat,visualaid,sub,sup,charmap,separator,cleanup,code';
	  $init['theme_advanced_buttons3'] = '';
    
  }
  else {
    // everyone else just gets some basic buttons
    $init['theme_advanced_buttons1'] = 'bold,italic,underline,separator,undo,redo,separator,bullist,numlist,separator,link,unlink,separator,removeformat,charmap,code';
	  $init['theme_advanced_buttons2'] = '';
	  $init['theme_advanced_buttons3'] = '';
  }
  
  // Always return $init; !!
  return $init;
}

// Note: change this function name to match your theme
function yourthemename_is_staff_member($user_to_check = NULL) {
  global $user;
  $staff_role_id = 2; // change to the role id you want to check for
  if (is_null($user_to_check)) { $user_to_check = $user; }
  $roles = array_keys($user_to_check->roles);
  return (in_array($staff_role_id, $roles) || $user_to_check->uid == 1);
}

?>

--
Anton
New to Drupal? | Troubleshooting FAQ
Example knowledge base built with Drupal