Versions (2014-05-28) (Downloaded 396 times)


  • Read More (action) - v. 0.1.5

Compatible: Pro 4, Pro 5, Pro 5.5, and Pro 6

Author: Walter Davis

javascript css effects prototype

This Action creates a little ‘more…’ link in an overflowed HTML box, and shifts the overflow content into a lightbox-style overlay.

To use, insert the Action inline at the end of the last paragraph of text that you want to be normally visible. All the remaining text in the parent container will be hidden from normal view, and a new P tag containing the desired link text will be inserted to replace it.

You may set the following options: Text, Include all content, and Popup Width. The defaults are ‘more…’, no, and 400px.

The Action does not create any styles for the more… link, you will need to do this by hand using the Styles palette. Create a Tag-only Styles with the Tag set to .more. At a minimum, you will want to set the following Extended attributes:

  • cursor: pointer
  • text-decoration: underline

These will help the user discover your fake link. If you have set a body style for your page, then you won’t need to set a font or font-size for these links. But if not, you will want to do that, otherwise you will get Times 16px by default in most browsers. If you have a desired link color, set that as well.

You don’t have to set Overflow: Hidden on your HTML box (because the Action sets it automatically) but if you do, your layout will look a lot cleaner while you’re working and you won’t have to do so much squinting as you design.



Walter, have you had issues with his action not working with FW7? I've inserted the action as described but the 'more…' is placed at the end of the text even though I have placed it where I want it.

Hey Walter.. an interesting thing happens when I installed the Read More action 0.1.5 to replace the older 0.1.4 I did this many times - and put the newer action in the Application support actions in Library, but it reverts back to 0.1.4

when I make sure I hit Get Info.. so I wonder what to do thx!

In the Styles palette, create a new style. In the Tag field, enter


Do not put any value in the Name field. If Freeway helpfully adds one, delete it and press Tab so you get an empty value. Now, use the style tools in the Edit Style dialog to decorate your style.

Very important: you don’t have to apply this style to anything to make it work. You won’t see the effect in the design view in Freeway, either—only in preview or the live site.


Sign In or to comment.