in
Innovasys Logo

Image with Instructions

Last post 08-09-2007 7:22 PM by DDH. 2 replies.
Page 1 of 1 (3 items)
Sort Posts: Previous Next
  • 08-08-2007 5:39 PM

    • DDH
    • Top 50 Contributor
    • Joined on 07-24-2007
    • Posts 5

    Image with Instructions

    Still getting to know the product but love it so far.  Getting just what I want out of it.  One topic visualization that I can't seem to create is an image with instructions to the right or left of it.  I'd like to show a data input window with the instructions next to it rather than above or below.  I haven't been able to figure out the right combination of paragraphs and widgte to do it.  Any help would be appreciated.

    Thx 

     

  • 08-09-2007 4:57 AM In reply to

    Re: Image with Instructions

    There are a couple of ways to do this. The first would be to go into HTML source mode and wrap your image widget with a DIV that had a style of float:left. e.g.

    <div style="float: left">

    <innovasys:widget layout="block" type="Dynamic Image">

    <innovasys:widgetproperty layout="inline" name="ImageTitle"></innovasys:widgetproperty>

    <innovasys:widgetproperty layout="inline" name="ThumbnailURL">

    Images/ScreenCap_thumb.png</innovasys:widgetproperty>

    </innovasys:widget>

    </div>

    <p>Just some text to wrap around</p>

    You could also create a copy of the image widget and add the style="float: left" (or right for text on the left of the image) to the widget definition HTML.

    The only caveat is that the text does not show as flowing around the image whilst you are editing (because of the way that widgets work at edit-time). The generated output or preview will be correct though.

    Richard Sloggett
    Innovasys
    http://www.innovasys.com
    Filed under: ,
  • 08-09-2007 7:22 PM In reply to

    • DDH
    • Top 50 Contributor
    • Joined on 07-24-2007
    • Posts 5

    Re: Image with Instructions

    Works great!

    Thx 

     

Page 1 of 1 (3 items)