[Pro] Centering a markup item (PayPal button)

I’ve been trying to follow Ernie’s instructions here, but I’m doing something wrong. As I will have both a “donate” button and a “join” button on one page, I tried to change the class style as Ernie directed near the end of the thread.

I would like the “donate” button to be centered in the footer.

Thanks!

Doty


freewaytalk mailing list
email@hidden
Update your subscriptions at:

I have added my second button to this page. I would also like it to be centered. Would I need an additional class style for this?

Note: I did not make any changes to the code on this membership button sample.


freewaytalk mailing list
email@hidden
Update your subscriptions at:

Hi Doty,
Select the item ‘paypal-wrapper’ or ‘paypal-button’ and apply a paragraph style to it that contains a centered text style.

You should end up with some CSS on the page that looks like this;
text-align:center;

Regards,
Tim.

On 9 Sep 2015, at 12:22, Doty wrote:

I would also like it to be centered


Experienced Freeway designer for hire - http://www.freewayactions.com


freewaytalk mailing list
email@hidden
Update your subscriptions at:
https://freewaytalk.softpress.com/person/options

Hi Tim. Thanks for weighing in!

I did what you suggested to the membership button here and it gets me half-way there. But I want all of the markup code centered.

I haven’t messed with the donate button in the footer yet.


freewaytalk mailing list
email@hidden
Update your subscriptions at:

Any other thoughts on this? It seems like it should be simple, but it’s causing me all kinds of grief!


freewaytalk mailing list
email@hidden
Update your subscriptions at:

As a side issue, your image “Early Scene of Mill Street-crop” is way too big at nearly 900kb and takes a while to load. If you use the “save for web and devices” option in Photoshop you can easily get this to less than 125kb.


freewaytalk mailing list
email@hidden
Update your subscriptions at:

If Tim can’t help, I do not know much more people on this planet who could. And for the footer paypal button, it is EXACTLY as Tim already said!!

You call this “MarkUp” so in fact, I do not understand your construction at all, cause the “membership option” is wrapped in a table while the paypal button is not. Is this introduced by the markup? Or by native construction? Or can this even be constructed native - I mean within Freeway rather than firing in external code snippets?

Oh - and by writing, coming something in mind. Head into the styles dialogue and create a TAG style there. In the TAG field write table, delete whatever is in the name field and tab back into the TAG field. Hit extended and enter width (as name) and 100% (as value). But note: All tables in use will now have a width of 100% but I think there isn’t much wrong with this.

Cheers

Thomas


freewaytalk mailing list
email@hidden
Update your subscriptions at:

Well, since I was initially mentioned in this post, I probably should weigh in.

There is a time, Doty, when the most helpful thing to do is just step back from the work a bit and try and get a fresh handle on what is going on.

You no doubt have a good grasp of how to center items in Freeway’s workspace… the problem you are faced with now is how to center the contents of a Markup item-- something which is much more conceptual and less direct.

Freeway generates your page code for you, and when you center an item in your Freeway workspace, it also generates the code for that. But a Markup item is a way for you to manually introduce page code that is not written or managed by Freeway… which means you are responsible for managing its style and appearance as well.

How an item is positioned depends on what that item is-- exactly. Because we are not dealing with Freeway but with page code. Also, as we learned in the other thread, if there are more than one of those buttons then how such items are centered “together” changes to reflect that reality. So, it’s not a one-size fits-all kind of answer, but a more nuanced solution that depends on understanding the page code.

Tim’s answer is simplest for the single button which is there, now.

Select the container item “paypal-button” in the Freeway workspace and open its Extended Style dialog. Under the <div style> tab create a new style definition:

NAME: text-align
VALUE: center

And that will do what you need. Alternatively, you can also create a new style in the Style Editor, name it

NAME: align-center

then use the paragraph styles to select centered alignment. Back in the workspace, apply the style to the container by selecting the “paypal-button” box then clicking the style name “align-center” from the Style Palette to apply it. That will also do what you need.

Why it works, exactly, I’m not sure… I mean, I know that it works through the CSS mechanism of Inheritance-- the text-align property is passed to the child contents of the container… what I don’t yet get is how text-align affects HTML elements like form and input. I had thought it was simply to affect the paragraph <p> element that Freeway inserts to wrap the stupid span element generated by the Markup Item process… but using the Inspect Element tool in Safari shows the browser sees that wrapping paragraph as malformed code, splitting it to before and after the form element inserted by the Markup Item. So, I don’t get it. Perhaps it is more the browser trying to accommodate unclear code than how it is supposed to work?

In any case, the result produced is what is wanted-- which I have learned to take as I can get. I’m not sure why you are having so much trouble with this, but Tim’s suggestion is about as straight-forward as it gets.

Best of luck.


freewaytalk mailing list
email@hidden
Update your subscriptions at:

Thank you, all, for your help! One down, one to go. This was the magic sauce to get the button to center properly in the footer:

On 10 Sep 2015, 4:13 pm, The Big Erns wrote:

Select the container item “paypal-button” in the Freeway workspace and open its Extended Style dialog. Under the

tab create a new style definition:

NAME: text-align
VALUE: center

And that will do what you need.

I now have a “donate” button in my footer on every page that looks like I want! Now, can I get this one in the middle of the page to also center??? It’s a mystery to me why one is working and the other is not. Note: I realize the “add to cart” is centered, but I want the “Select Membership Option” and the drop down menu to center with the “add to cart” button. All of that is a markup item.

Noel, thanks for the tip about the large image. I thought I got them all “downsized” but clearly I missed this one. Going back to check them now!


freewaytalk mailing list
email@hidden
Update your subscriptions at:
https://freewaytalk.softpress.com/person/options

I now have a “donate” button in my footer on every page that looks like I want! Now, can I get this one in the middle of the page to also center??? It’s a mystery to me why one is working and the other is not. Note: I realize the “add to cart” is centered, but I want the “Select Membership Option” and the drop down menu to center with the “add to cart” button. All of that is a markup item.

Have you read my comment above? Do it, I’m not used to write stuff twice.

Cheers

Thomas


freewaytalk mailing list
email@hidden
Update your subscriptions at:
https://freewaytalk.softpress.com/person/options

Thomas,

I didn’t mean to dismiss your comments. Rather, I was confused by them. Your post prompted me to try again. I added

Name: width 
and 
Value: 100%

To my .form-paypal extended style. I did this in addition to the other extended styles recommenced by Ernie. I’m sure I did something wrong, but I don’t see any change. I must confess, I have no clue what you mean by TAG style. I could not find a “TAG field” anywhere and I’m not at all sure what you’re talking about on that point.

On 10 Sep 2015, 3:14 pm, Thomas Kimmich wrote:

Head into the styles dialogue and create a TAG style there. In the TAG field write table, delete whatever is in the name field and tab back into the TAG field. Hit extended and enter width (as name) and 100% (as value). But note: All tables in use will now have a width of 100% but I think there isn’t much wrong with this.


freewaytalk mailing list
email@hidden
Update your subscriptions at:
https://freewaytalk.softpress.com/person/options

This is to be found in the

Edit → Styles dialogue which is the most important place to create and manage styles.

Once opened this dialogue, you perhaps find some of the places I meant. THERE is a TAG field where you add the word table and so on and so on.

In all honesty, I expect Pros being used to this, if not get used to. Or how do you create and adjust your Heading styles and stuff?

Cheers

Thomas


freewaytalk mailing list
email@hidden
Update your subscriptions at:

Thomas,

I’m familiar with the Edit > Styles dialogue. I have about 10 styles defined there for this document. It is how I create and manage styles. In the event I inadvertently create a “.style1” I immediately run to the styles dialogue and remedy the situation.

My confusion comes in with exactly what you want me to do once I’m there. I’ve added the 100% width, I also have a text-align center as suggested. But somehow, I’m still missing something…


freewaytalk mailing list
email@hidden
Update your subscriptions at:

Create a new style (+)!

Then there is a thing called Tag: and a box to the right, correct?

If so, enter in this field the word “table” (without quotes and prefix). If there is any name in Name: delete it. Tab back into the previous box. Hit then the “Extended” button pretty much to the right of your dialogue-box and create there a new name/value pair. For “name” you’d enter width and for value (because it is the value of this property) enter 100%. Click OK and OK - done. Nothing to apply anywhere cause it is a user-agent style.

Cheers

Thomas


freewaytalk mailing list
email@hidden
Update your subscriptions at:

Would you look at that! Thanks Thomas! Exactly what I was looking for. I didn’t know I could add new “Tag” fields. I thought I needed to stick with the ones already on the list. I also didn’t know I could leave the name field empty. Thank you for helping me learn!


freewaytalk mailing list
email@hidden
Update your subscriptions at: