Customizing SignUp/Member/Login/Logout Pages

I'd like to change the look and layout of the aforementioned pages to fit with the rest of my site's theme, rather than the default bland table-on-white.

I know this has been done in other topics before (like here and here), however the PROCESS itself has never been outlined. I know it's possible, looking at this site, I just need some help. A tutorial, places to start.

Here's what I know, or surmise, so far:
-There needs to be tweaking to css, namely reset.css, amember.css, and site.dist.css
-The .html template connects to the .php page (ex. signup.html connects to signup.php, so in order to affect the "look" of a page, edit the html)

So far, I've tried basically copying the code from the default signup page onto a page with my site's template, and then attached the three aforementioned css sheets. The result is less than spectacular. The tables stretch far beyond my site's width, and I'm not sure which exact setting will fix that.

Beyond that aesthetic detail though, attempts to "hot-switch" out the default signup.html with my "experimental" signup.html give me Smarty errors when I try to even view the page.

Any ideas, advice, or suggestions would be greatly appreciated.

I have a video on my site (sorry paid) on how to customize amember. But you may want to save some time by hiring someone like MISO to do the customization for you.

David

Urm...thanks? I emailed Miso. Although getting this site up and up-to-spec is important, for my own knowledge I also wish to know HOW to do this, too.

So far I've successfully implemented my site's css pages onto signup.html

However, the table that signup.html uses extend far beyond my site's body width. More importantly, when I try to test it I get Smarty syntax errors, usually going down the script code's line of {/if}'s.

I don't want to remove them, because I know they're integral to the code.

So, my questions at this point are:

1) how do I tweak the table width (I believe the table is called "vedit"

2) How can I fix these Smarty Errors?

I've included in a zip file my "working" copy of signup.html, as well as the css pages attached to it: default, layout, and Spry Menu

eqewebmaster this is quite easy if I understand what you are wanting. Go to http://themanualslibrary.co.uk/amember/signup.php or http://themanualslibrary.co.uk/amember/profile.php where I have customised aMembers standard forms.

Rather than edit the aMember css files, which could have other side effects, change the first line of the table to something like "<table class="amem_table" style="width:550px;" summary="Signup Form" >". Now you can include the definitions for "amem_table" in your own css file and configure that to blend into your own site page.

Changing the "style="width:550px;" attribute will alter the width of the table. You could add just this to the existing vedit table but then to change other attributes of your table would require editing the amember css file.

Smarty errors should be avoided if you copy the entire original template to your new one and just edit what is contained within the table cells (which is what I have done).

Your new signup.html must go into the aMember templates folder of course.

My css for the amem_table is

Code:

.amem_table {
     
    border: solid 1px #E0E0E0;
}
/* vedit - usual column (right) */
.amem_table td {
    text-align: left;
    amemical-align: middle;
    padding: 15px 10px 10px 10px;

    background-color: white;
    border: solid 1px #E0E0E0;
}
/* vedit - header column (left) */
.amem_table th {
   padding: 10px 15px 10px 10px;
    text-align: center;
    amemical-align: middle;
    font-weight: bold;

    background-color: white;
    border: solid 1px #E0E0E0;
}
/* vedit - heading row */
.amem_table .headrow { font-weight: bold; text-align: center; }

Remember if you adjust the widths of the main tables you also need to customise the table used for the error messages!

Well, I've been able to transfer the table in signup.html to a page with my site's template. You can view it here. Right now that page isn't in the aMember templates folder, it is just to test.

However, the moment I copy that version of signup.html into the templates folder, and then try to access it via signup.php online, I get error messages saying there are Smarty errors. Now the error is:

Apparently it doesn't like the integrated log-in PHP code I have elsewhere in the page.

Any thoughts?

Update: I removed the log-in code, and now everything fully displays, except for some aesthetic things. I'll tinker with some custom CSS for that.

Customization of the sign-up and conformation pages

I am also looking to have the aMember sign-up and conformation pages match the look and feel of my website. I am looking for a programmer to do this work. Recommendations please.

I've heard good things of Miso.

David