Come together with the global Drupal community in Rotterdam, 28 Sept – 1 Oct 2026. Sessions, contribution, connection, and Early Bird savings until 8 June.
By matthew gibbon on
Can anyone help with Aligning a cck image field left of the body so as to wrap the body text around the cck image field.
thanks
Comments
Use css
Hi matt1,
You can do this a couple of ways. Are you using a WYSIWYG editor? If so, the Image Properties dialog box may have an "Advanced" tab where you can specify either specific css for this particular image (in which case, you can set it to float: left; padding-right: 10px; padding-bottom: 10px; for example) or you can create a css class (does your theme have a local.css file you can use?) and then enter the class name there.
Specific to cck and body
I am useing a wysiwyg editor, with wysiwyg image upload (WIU). WIU works well and was almost perfect for me, except there are still some issues with views unresolved. see http://drupal.org/node/1251922
I have created a cck image field for a "cover" image for the story to be able to create views with relatable image content lists. I could just cancel the view of the cck field in the node but would prefer to have it, just not on its own with no content next to it, would much rather have the body wraping around the image.
Firstly, what happens if you
Firstly, what happens if you click on the image and then click on the text alignment button in the wysiwyg toolbar? In my experience, that will align the images left or right with the text flowing around them.
The WIU module looks ok, but the thing about it (and the IMCE module) is that the uploaded/inserted images are not 'tracked' by Drupal. By that, I mean that if the image is deleted from the post, or if the whole node is deleted, the original image and imagecache sizes and thumbnails will be left on the server.
The great thing about IMCE is that images can be shared by users and re-used around the site. WIU doesn't seem to share that benefit though.
A more 'Drupaly' way to use inline images is to upload via CCK imagefield module (which are 'tracked'), and then use the insert module (and you disable the cck display of the imagefield, so that you can only see the inline image). You can then align as described above, using the text align buttons.
http://drupal.org/project/imagefield
http://drupal.org/project/insert
The real benefit of this method isn't deletion tracking, but that the cck imagefield is then usable in the Views module, so you can display your images in other ways in other places in your site.
it is a cck field
It really doesnt have anything to do with the Wysisyg, because the field is a seperate cck field. what I am trying to do is wrap the "body" field around a cck field which happens to be an image.
> the field is a seperate cck
> the field is a seperate cck field
> I am using a wysiwyg editor, with wysiwyg image upload (WIU)
You started off using WIU to insert inline images and it was 'almost perfect'. Then you appear to have moved to CCK, and have realised that it's hard to theme the field into a fixed position in the node using css, and are asking how to do it.
I am trying to tell you that you that as an alternative you can use CCK + Insert Module to go back to using inline images, which you can then place and align with the wysiwyg. This method also has the additional benefit of creating the image 'in the system' so that it is tracked properly and is available in the Views module.
My workflow is:
· Upload image using cck imagefield
· Next to the Insert button I choose between the original uploaded image or a colorboxed thumbnail.
· Press the 'Insert' button to put the image or thumbnail inline.
· Drag the image to where I want in the text vertically.
· Press the right or left align button in the wysiwyg to align the image.
· Repeat this process as many times as I need, so the node has multiple inline images.
The display of the cck field is disabled in the content-type settings so that only the inline images are visible.
Or you can continue trying to theme the cck field into a static, fixed position in your nodes.
Or you can try IMCE, which is a much more complex version of WIU.