My Website - In Honor of WA...

Last Update: October 15, 2011

I looked high and lo...and have been trying to find a theme with a style and look similar to Wealthy Affiliate's look.  There are two reasons

  1. I really like the lay-out and the look of the site
  2. It is a business I really believe in and that I treasure as one that has made a HUGE difference!

Yesterday I was trying to find a new theme for http://alternativehealthsolutionsmd.com ; Wow, most of the free themes are rubbish, to say the least!  There are only about four or five themes in the entire offerings that I would use...

I came across one that, from a thumb-nail, had remote resemblance to WA's look...

...the "Mantra" Theme.  When I previewed it, well, it kind of does, but disappointingly, not good enough.

Nothing Comes as Close in the Free World Though...

It's as close as I would come, I could see.  So, I went ahead and installed it.  The first disappointment I found with this is that when I made a solid color block the size of the header.  I could only have that size...it is otherwise not customizable.

The color block revealed where the header ended and the in-line menu element started.  There was a 30-or-so pixel height that separated the actual tabs from the header.  Well, I guess this isn't going to work...or so I thought...

I looked through the rest of the themes...nothing...

So, I went to experimenting...I knew right where to go.  I've played around with CSS files before.  There had to be ways to "force" stuff into subjection.  The one and only thing that gives WA its striking look was where I began...

I began with the tab line.  This is the most striking thing about WA that stands out the most to me, so I played around with it until 4:30 this morning.  (Wow!  I'm beat!)

I made up my header.  The very top of the in-line menu (what I also call the tab-line) is actually how I achieved creating the rounded corners.  Then I put negative values into the stylesheet, in the lay-out area, forcing the tabs up over the bottom portion of the header where I put the "fake" rounded corners.  Of course, I matched the colors so they look seamless.

I made the tabs closer together in the 'li' portion of the stylesheet.  Finally, I replicated the background after having changed the background color white, tweaking my background image until I was able to get the line to line up with the base of the tabs (like it is in WA.)  The color shading is a bit off, but it doesn't have to be perfect.  I did all my work with Paint.net.

It would not scroll with the rest of the site...until I found that in the stylesheet and changed it so it would stay together.  When I did this, the image dropped.  All I did was chop off the difference in the image file until they lined up again.

I experimented with changing values in the stylesheet and going back and forth to see what happened.  I've used negative numbers before.  It isn't always the best thing to do but it worked here.  I kept doing this, tweaking, seeing what moves, what doesn't, and began putting negative values in places until I was able to come up with this...

http://alternativehealthsolutionsmd.com

I have nearly what I want!  I could not find the theme (WA is certainly a premium theme) I'm very happy with what I created with a free theme!  It is not exact but it is similar.

It is in honor of a great place that Wealthy Affiliate is!  There are things I will probably not be able to get this theme to do, but again, with enough persistence and experimentation, I could probably...

I'm very tired.  I went through a lot of crap with Yahoo trying to get our domain pointed to the servers I have chosen (HostGator.) and I'm on my way.

This is my oldest website and it's time it had a professional look to it.

I've done it!  Whaddya' all think of it?  No, it's not done and I have yet to put the WA touch to it (besides what it looks like.)

Join the Discussion
Write something…
Recent messages
jroth728 Premium
Hi Daniel, just a for your information WA is not hosted on a WordPress theme... I saw Carson say one day that it's strictly code written from scratch. I learned how to customize themes the exact way that you are talking about though (trial and error from changing the code) so keep on doing what you're doing buddy and the rest should follow. BTW your site is looking good from what I can see (layout/design), now I would just focus on adding your content.
That's interesting, I was told it was a premium theme. Anyway, I am now working on the slider at the top. It is a lot of work but will make thing look much better and save space without cluttering it up. Yes, a LOT of experimentation went into my free WP theme to make it resemble WA's site. I can usually replicate things pretty well though it sometimes takes more time than I should put into it having no income right now.
Thanks, btw for you kind comments on it!
nadianasrallah Premium
Hi Euergetes! I really like the look of your site. As a web designer, I can point you in the right direction for getting the background website image to look like what you want it to. The black block of color at the top comes from the 5 X 700 px background image embeded in the through CSS. It repeats itself horizontally to create that background look. You must open that image in an image editor and change the top black portion to the color you want. PM me if you'd like more info.
It's strange what you are seeing. I don't see a 5px block at the top. There is a much wider block with the doctor's head sticking up over it that I intentionally put there. Is this what you are seeing? It's much taller however. Otherwise I'm not seeing what you are.Can you send me a small image of what you are experiencing? If it is the dark grey place above, that's intentional. Perhaps I need to put a fine border at the line so it looks better. I'm curious now as to what you are experiencing because I've tweaked the code to make the horizontal menu come up higher...and I remember changing a value about 5px. I may not be seeing what you are seeing. This is the Mantra Theme and the header starts about 32px above the menu...and I didn't like that.
I brought the menu up (and the rest of the site below) by putting a -27 value in there. I could not go any further because the menu starts coming apart from the content at that point and is why I went to experimenting with other values, hence the 5 extra pixels. This may not be visible to me as it might other people.
Top