Monday, November 8, 2010

Installation of WYSIWYG image upload

Just have a look in the video-podcast, as its explained there also.
  1. Dependencies: Install all dependencies and watch out for the correct versions! eg:
    1. jquery_ui module 6.x-1.4 (IMPORTANT: Install the jQuery UI Library according to this howto. You have to replace the jquery.ui folder with the (js library) with the 1.7.x version !!)
    2. jQuery Update (IMPORTANT: Be sure you have installed jquery_update 6.x-2.0-alpha1 or newer and NOT jquery_update 6.x-1.1)
    3. Jquery UI Dialog
    4. ImageCache
      • (IMPORTANT: Even though imagecache is automtically activated, the imageAPI implementations are not. Please activate 'ImageAPI GD2' or 'ImageAPI ImageMagic'.)
      • (IMPORTANT:You NEED to have at least one preset in imagecache, otherwise you wont see any images. Create at least one!)
    5. Wysiwyg (Then install and configure your required editor)
    6. Translatoins can be found on the localization server
  2. Enable (a) the WYSIWYG imageupload module
    (optional) Enable (b) the WYSIWYG Image upload Browser if you wish to be able to browse and insert images that have already been uploaded.
  3. Enable image uploading plugin in the WYSIWYG editor:, Go to the Wysiwyg setting, and click the "Edit" link on the required input format. Under "Buttons and plugins", check the new "Image uploading" option. You'll also need to check all the buttons and plugins you want.
  4. Input Filters: Activate the input filter "Drupal Wiki inline images" for all input-types you want to use wysiwyg_imageupload in. If you are using 'HTML filter' for your 'Input filter', you probably have to add img as a allowed html tag. Be sure to run the filter very early ( heavy weight ), otherwise other filters can strip out CSS
  5. Cache: Clear your cache once (theme cache)
  6. Easy check: Starting from 6.2-RC2 you can go to the status page (reports/status) and check the requirements ( shouldn`t look like this )
  7. Configuration: Under Settings ( admin/settings/wysiwyg_imageupload ) you can set the paths, styles, presets and other things
  8. Permissions: Give the roles you actually want to be able to use the wyswig image upload plugin the 'use wysiwyg image upload' user permission
  9. Translations: For translations check the official localize server. Just select your language and export the .po file or install the i10nupdate client to fetch the language (i18n module)

Migration steps

  1. If you used wyswiyg_imageupload 6.1.x before, please read the migration guide

Activating extensions (submodules)

  • If you want to use the Image-Browser, activate the submodule Wysiwyg ImageUpload Browser
  • If you want to have lightbox integration, activate the submodule Wysiwyg ImageUpload Ligthbox (Note: there is an issue with Lightbox2 v6.x-1.9 and jquery update v6x-2.x-dev, which is solved by installing Lightbox2 v6.x-1.x-dev)
  • If you want to migrate from 6.1. lightbox integration, activate the submodule Wysiwyg ImageUpload migrate 1 to 2
For more information about Drupal Development, Drupal Expert, Drupal Developer and Drupal Programmer visit at 


No comments:

Post a Comment