How to build a site like the new RapidWeaver7 site


(Gary) #1

As an exercise to see if it was possible, I have created a version of the great looking RapidWeaver7 site using my Template system with BWD & PADDY stacks. This was put together in a few hours and most of that time was taking measurements and copying and pasting content. The site scales very well at all screen sizes, is image optimised and which helps to keep it lean and fast.

I have created a one-page version and added the amazing BWD MagicGellan2 navigation system. The Template doesn’t use a conventional RW Theme but is based on a Blank Theme into which 100% of the content goes.

The whole Template is Easy/TotalCMS ready and all text is Font Vault ready for use with FontPro, although the Google Fonts used match the RM fonts pretty well. Also all images can be warehoused and we have several videos that list the advantages and describe the process of using warehoused images.

This will probably be the basis of my next RapidTemplate so I would be interested to hear what others think.

The work in progress demo is at http://www.webdeersign.com/templates/tp4demo1 and to login use the code 8080.

Please be aware that this isn’t the RM site, but all links go to the correct destination in the RM system so the worst that can happen is that RM get more exposure and orders.

From a users point of view this is a relatively easy build and the modular approach makes it easy to learn and make changes which would make this design an ideal basis for a fresh design with colour, graphic and content changes. The PADDY stacks have really simplified the construction of this site, which would previously have required a more complex framework approach.

If all goes well the RapidTemplate will be available early next week.


RapidTemplate4 now available
(r) #2

Hi, looks good! But since you asked for input… from my point of view it would be great if you could focus on different types of layouts that can be created with your stacks or 3rd party stacks. Your Grid template was a good example. We have plenty of offerings that have the big header scroll down, section type theme/projects to choose from. These are some example to get an idea:

http://codetic.net/demo/?item=privado_wp
http://demo.elated-themes.com/borderland9/#first
http://clapat.ro/themes/legrand-wordpress/
http://subsolardesigns.com/inez/

Thanks


(Gary) #3

Hi,

Actually Template 3 “The Grid” is perfect for your examples 2 & 4 and these type of pages are exactly what I had in mind when creating the PADDY stacks. All the rest of the tools to complete these with Template3 are available now.

Example 1 is something I have ben admiring for a while but would be a lot of work for a small amount of interest. It is one thing to take the existing code from Codypen and make it “work” in RW but it’s another big amount of serious effort to optimise it and make it work with everything else without causing errors and problems.

Example 3 could be created once someone creates an off screen type of slider. Certainly the modal navigation exists but just hasn’t been released yet.

It is a very exciting time for RapidWeaver and it is moving beyond the traditional menu bar at the top approach quickly. Big White Duck are doing amazing things to push the boundaries.

However, there still remains a hole in the RW solution for low cost and easy to use tools to create a site like the RapidWeaver7 one. My new RapidTemplate will fill that hole I believe.


(Steve Jenkins) #4

I really think this is in poor taste. You should not be using there site as an example. I seriously believe they are not cool with this.


(r) #5

Poor taste? to show what his stacks are capable of doing “build a site like the new RapidWeaver site” are you serious?


(Steve Jenkins) #6

Duping content and links will cause issues with search engines. Yes, I am very serious.


(r) #7

Whatever gets you thru the day


(Steve Jenkins) #8

There are plenty of examples of how to make a site with Stacks and RW. Check the gallery out on the community site. Scrapping another site is just not the right thing to do. I hope that gets you through your day.


(Michael Kane) #9

Is it correct that he scraped their site? It looks like he reversed engineered it using his own template/theme and stacks. He’s got the template behind a secured lock (I’d like to see that stack, btw) so Google’s robots won’t even pick it up. He’s properly attributed all the content. Even if he links were picked up–and they’re not–links are a good thing under Google’s search algorithms.

i have no problem with his post or page.


(r) #10

It’s joe workman’s page safe stack, I like it…gonna buy it


(Robert Ziebol 🖖🏼) #11

He actually used the Foundation theme to create it, his own template, yes, but not his own theme, that is Foundation by Joe Workman.


(Robert Ziebol 🖖🏼) #12

What proof do you have that he scrapped the site?? He is using Foundation, there is Foundation code all over the site. The slider is a Stacks4Stacks stack, which is NOT what Realmac uses. There is NO proof he scrapped the site. I think it is a good example of what you can do to make the same page with a different theme. Not something that I would do, but there is no way Google is touching that site the way he has it set up, and he NO WAY scrapped it.


(Michael Kane) #13

Foundation is a framework, not a theme. Is Bootstrap a theme?
Foundation is a blank slate. Bootstrap is two or three lines of code that calls JS libraries.
Neither of them have any design elements whatsoever.


(Michael M.) #14

Hi Gary,

it’s an interesting project. But I am not sure if there could be a problem with copyright. If a web designer creates a special layout for a customer he normally doesn’t want the layout of the site to be copied because creating a special layout is based on hard work he wants to be paid.

Maybe you got the permission to copy the layout of the Realmac page but what about all these people who will take your template and will so copy the layout of the Realmac site, too?

Did you think about that?
I am interested: What think other people in the forum about this problem?


(Gary) #15

OK, let’s just put the record straight here for those jumping to the wrong conclusions.

This demo page I created started as a free Foundation Blank theme but I didn’t use any Foundation stacks. The theme has a completely white blank page and user settings, so you must provide everything by code or otherwise, which I did. Alternatively, I could have used a Bootstrap bank theme but in this case the Foundation blank theme had significant advantages.

I then built up the page by looking at the rendered RM site, and from experience can pretty much work out the dimensions and match the fonts without too much trial and error. The hardest part was matching the white space. The stacks used are mostly from Big White duck, the slider is the first one I grabbed and is StackSlider from S4S (with one line of CSS code added) and the rest of the stacks are my own PADDY stacks. No code is used from the RM site. There was no scrapping or reverse engineering as has been suggested. The text and images are copied directly to make the site look correct. I resisted matching the fonts completely using embedded fonts (which the Template is setup for) and used Google Fonts throughout to make it as low cost to recreate as possible. I used the same methodology, so for example, the very first Realmac logo (which is now a Template logo) is a warehoused image just like the RM site.

The real power to create a site like this comes from the game changing Big White Duck stacks that make it so easy to match the text in every way and more. The navigation is BWDs MagicGellan suite. I used few of the great S4S stacks such as the Graphic stack which together with the BWD stacks, empowers the whole site with warehousing image capability. The PADDY stacks provided the correct white space which is so important in getting everything to look right. RM are masters of white space. The PADDY stacks also provided pixel adjustability on all column collapse decisions as well as our SWAP feature in the Testimonials section.

Also just to clarify, Foundation and Bootstrap Blank Themes are very much more than a few lines of code.

And the site is behind a lock (Joe Workman’s SiteLock stack) so search engines will not see it. Although if they did, it is debatable, but would probably increase the search score as all links are intact.


(Gary) #16

Hi apfelpurer,
I have asked Dan & Ben but not heard back yet. To make the purpose of this demo crystal clear, I put the message at the beginning of the site and hid it behind a JW SiteLock stack.

Normally I would totally agree with you but in this case, I believe it is in RM’s commercial interests to enable their customers to build a site like their own. It is not only real proof that indeed it can be made with RW, but the idea of this potentially becoming a RapidTemplate, would show and educate RW customers how to build the RM site. Anyone who wants to copy any website will get it copied and very likely not use RW to do it, so the that issue is beyond my demo and this forum.

The RM layout is actualy very straight forward in my opinion and there are hundreds of similar layouts and have been online for quite some time and the top navigation is a Wordpress layout. I don’t see anything new in it and that isn’t a criticism but just stating it is a mix of edge to edge BG images and 1, 2 & Column layouts. We have all seen sites like it but the focus here is how to use RW to build it. That is what this whole forum is about and that is what RW is all about after all. Certainly it would be easy for me to replace with open source icons and Unsplash images if that does prove an RM issue.

The RM site actually states it is built with RW but I don’t think that large majority of users would know how to do it.

Interestingly, as several people have pointed out to me, the site is built with RW6 and also I haven’t used any stacks from the RW Addons Section. On further consideration, I would think it isn’t even possible to build the RM site using content sourced from the RM Addons Section. The full Foundation stacks suite would get very close but you would also need, FontPro, Target, CSSbox, VimeoPlayer & Jack ($200 plus?) and then you couldn’t implement the MagicGellan navigation without the BWD stacks (not on the Addons). If someone proves me wrong then please do.


(r) #17

There is no problem except people overreacting. It’s a template people…to create a site.


(Will Woodgate) #18

Yes, it is: https://themeflood.com/bootstrap

Yikes, I think you’ve been very misinformed about frameworks like Bootstrap or you’re using the wrong terminology. It might be in your best interests to do some further research. I can’t speak for Foundation, but Bootstrap definitely has many dozens of design elements and components that ship as standard. Check the official website. Bootstrap is a lot more than just Javascript. It’s an entire frontend web development framework.


(Michael Kane) #19

([quote=“willwood, post:18, topic:7575”]
[Bootstrap is] an entire frontend web development framework.
[/quote]

Exactly. But lacking design elements, it’s not a theme. It’s a blank slate. There are web sites that use Bootstrap on the back end. If you’d like to use different terminology, go ahead; but “theme” usually refers to a design container, not a blank slate.


(Robert Ziebol 🖖🏼) #20

When it comes to RapidWeaver though, it means something different.