Freeway, WebYep and "Padding"

Thanks for an amazing WebYep plugin package.
One question. How can I get padding (space from sides, top and bottom) on a css text in the freeway styles dialog?
When I set up a text style for use with WebYep I want to have padding.
As seen here:
http://www.obdev.at/resources/webyep/demo_2/demoslot-1987/en/
Where the submenu to the left has text with space from the top/bottom and sides of
the menu box. Im only able to set padding in the inspector, but that does not help me
when wanting to use a style with a webyep item…
Hope I managed to explain this…puh… :slight_smile:

Thanks in advance,

Tom - Norway


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

On 19 May 2008, 9:26 pm, Tom Sommerseth wrote:

…How can I get padding (space from sides, top and bottom) on a css text in the freeway styles dialog?..

This is done by using the Extended option in the Styles Editor. Open the style you wish to add padding to and click on the Extended button. In the Name field type “padding” (without the quotes) and in the value field type in whatever amount of padding you need. To save it click on ok. To target specific sides for padding you can use padding-left or padding-right or padding-top or padding-bottom in the name field.


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

WOW! Thanks!
I will try this out. Padding should really be available in the “style” setup.

Tom


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

I thought I should probably mention that in order to use text styles with a WebYep text item you must have a space before and after the WebYep item and style all three. This is a quirk of Freeway. There is a place in the action window designating a style for the WebYep item in question but I find it works only intermittently.

… Im only able to set padding in the inspector, but that does not help me
when wanting to use a style with a webyep item…


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Hi again!
I followed your example with the padding extended command. It worked.
One question tho, when I enter text into one of the boxes/field, the others
grow in height with it…even tho they dont have any more text added.Why is that?
This is the page Im talking about:
http://www.tannlegekontoret.no/index.php
(the boxes at the bottom of this page)

Thanks again,
Tom-Norway


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

One question tho, when I enter text into one of the boxes/field, the others
grow in height with it…even tho they dont have any more text added.Why is that?

How many WebYep text items are there? Is there one for each box? I’m gonna make a huge guess here that maybe you have named each WebYep item the same name? Make sure that each one has a distinct name. Also, there is a setting in the Action pallet for making an item global, make sure it is set to False.


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

“chuckamuck”: Yes, they all have its own name. It not that the content is “global” is more that when I enter text into one of those boxes the others grow in height as well. I think I learned (Max Court, that produces the freeway WebYep action) that if I check the “shrink in height” then it should work.

Thanks again.

Tom


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

HI Tom

I would imagine that the css is turned off in your freeway artwork?!? though I am only guessing… if so then freeway will produce a table based layout.
If you want independent heights on your grey box’s then you need to make these items divs (layers)

Normally I would (as suggested before) add the padding via the extended button within a style but in your example:

  1. I would draw a table with the correct number of columns and rows.

  2. Then insert a div in each table cell as an inline and adjust the width of this div so it is the same width as the table cell.

  3. And for this scenario I would add your padding to the div plus colour the div grey.

  4. Now click inside the div and insert a webyep long-text and remove the height attribute of this div by clicking on the height button

  5. Now all you need to do is copy the DIV into the other cell and name them differently within the action palette

  6. That’s it now you will have grey boxes that will expand independently from each other.

I will send you an example to show what I mean.

As far as assigning the css to an inline item goes, only the short text item has a designated style field for this purpose within its own action palette.

This becomes active only when the short text has been place in a run of text or as an inline item, for example:

If you had a heading with a h1 tag and you wanted the short text to be in the middle of this text and you wanted this to be in a different style font colour etc. then you would click in the middle of the text and insert the webyep short text item. Then you would create a new style and name this new style in the name field, for example “wytext”.

Then click on the actual webyep short-text box outline and assign the WYshort text box with this new style via the inspector palette.
Then type this style name in the activated field within the action palette.
The result once you populate this webyep item is you will have a heading using the h1 tag but in the middle you should have a different styled text.

kind regards max


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

This becomes active only when the short text has been place in a run of text or as an inline item, for example:

Hmm, I hadn’t thought of that.


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

Thanks again Max. I have mailed you a couple of attachments. I think I’ve figured it out. I only wish that I could draw html objects that would behave as the table with “shrink” in height and not just inline items inside a table. Yo get the picture when you see my files. I actually think my items are not layers.

Tom


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options

I agree. However, many people have some trouble at first visualising the difference between padding on blocks of text and the padding on containers of text blocks. If your goal is to put space between your text and the edges of the html box containing it, you’d be better off assigning the padding value to the box. Padding the text blocks merely creates more space around the type – which can lead to unpredictable behaviors , such as paragraphs having more space between them.

On Mon, May 19, 2008 at 2:44 PM, Tom Sommerseth wrote:

I will try this out. Padding should really be available in the “style” setup.


Ernie Simpson – Freeway 5 Pro User – http://www.thebigerns.com/freeway/

HI tom
I have sent you back your example artwork. the problem I could see was that the grey boxes were not layers and so freeway would have published these as table items.

What I have done is amended the boxes by turning on layers then I used both methods, so you can see the result. The grey boxes once populated all look the same except that they can be different heights depending on there content and all have the Padding assigned via the containing DIV. and this div have had there heights turned off. The last grey box is constructed slightly differently in that this is a stand alone WYitem and the height again has been turned off. The padding has been added via a style this should now behave in the same way as the others.

kind regards max


freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options