Blog Archives

Hide RapidWeaver Stack

Hide – New FREE Stack

To kick things off I have a new free stack for you too. HIDE is a simple stack that does exactly what it’s name suggests… it hides content on your page, though you can also use it to reveal content. HIDE is made for parts of your website that you don’t want to display to users or only want to display to users when they are viewing your site in particular screen sizes, such as on a tablet or smart phone. Simply place stacks inside of hide and choose what screen sizes you want to hide/reveal the content in.

Check it out!

Control Panel 2.0

Control Panel 2.0

Update includes a greatly improved user interface for the customization section. In addition, new inherit options, pixel vs percentages for sizing controls, hexadecimal or rgba color controls, and other features that speed up, simplify, or add complexity to stack design control.

20% Discount Code: 20_controlPanel_062014
Offer Expires July 11th

Check it out!

Charis RapidWeaver Theme

Charis – RapidWeaver Theme

Charis is a beautiful flat modern theme designed with a stunning menu section, powerful slider, and a simplified setup process. Subtle animation effects and visuals add a wonderful user experience – all fully responsive and designed to for all devices and screen sizes.

30% Off Discount Code: 30_charisTheme_122013
Offer Expires December 27, 2013

Augment Pic

Augment Pic 2.0 Update

Augment Pic has undergone a huge upgrade making it a far handier tool to have when displaying engaging pictures on any page. New effects and image filters make this stack a photo or graphics display tool must.

20% Off Discount Code: 20_augmentPic_122013
Offer Expires December 27, 2013

ourGlass

ourGlass

ourGlass offers beautiful loading animations that can be easily added to any page. Use CSS animations or add an animated gif of your own. The stack comes with 6 CSS loading icon animations with more to come.

30% Off Discount Code: 30_ourGlass_102013
Offer Expires October 31

Check it out!

Phantom RapidWeaver Stack

Phantom 1.5 – BIG UPDATE!

  • Added font size control to the Knob/Dial version
  • The Knob/Dial can now also display titles
  • The Knob/Dial has an option to display titles only on mouse hover
  • You can use custom icon images in both the button and Knob/Dial version of the stack, more info will be added to the tutorial page
  • The Knob/Dial is no longer limited to 5 items, you can now add between 2 and 5 items
  • You can now increase the size for the icons and titles to 30px
  • The Buttons version now allows you to adjust the padding and spacing of the buttons
  • Fixed various small bugs

20% Off Discount Code: 20_phantom15_102013
Offer Expires October 31

Check it out!

Phantom RapidWeaver Stack

2 New Stacks & One Update

Phantom

Phantom is a navigational sorting tool that beautifully animates content based on categories that you decide. Create 1-10 of these categories in the sorting navigation section and items will beautifully animate with a jQuery masonry effect (such as seen in the Hang Glider stack).

30% OFF Discount Code: 30_Phantom_082013
Offer Expires 8/30/2013

Check it out!

cleanSearch RapidWeaver Stack

cleanSearch

cleanSearch is a powerful search stack that allows you to create searchable content sections and a customizable search engine text tool. Searched content can animate into place or simple not show. Results can also be displayed in a drop down menu for quicker use.

30% OFF Discount Code: 30_cleanSearch_082013
Offer Expires 8/30/2013

Check it out!

Control Panel 1.5 – Fixes certain text editing options (automatic update).

Odin RapidWeaver Theme

Odin – New RapidWeaver Theme

Our newest theme Odin combines modern minimal design with beautiful parallax and CSS3 animation effects. Inspired by high-end storefronts and perfect for displaying luxury products of any kind.

Fully responsive with built-in responsive lightbox gallery page, built-in extra content sections that allow for even great control, and tons of easy customization options.

Check it out!

Control Panel RapidWeaver Stack

Control Panel – New CSS3 Animation Stack

Take control of powerful CSS and CSS3 web animation with ease!

Control Panel provides full control over page elements for those who don’t know how to code, as well as improve the workflow for those who do code. With nearly 100 control options, you can make your site look exactly the way you want it and add a new level of interactivity and audience engagement.

Check it out!

Hemera RapidWeaver Theme

Hemera – New Responsive RapidWeaver Theme

Quickly and easily build a fully responsive sharp looking website for your online business with Hemera. Simple and intuitive customization options packed with our great support team helps you launch your new site or change your existing site’s design. Supported by all modern browsers: Chrome, Safari, Firefox, Opera, and Internet Explorer 8+. Subtle animation and design effects give your visitors that “wow” reaction and professional glare perfect for any small to medium sized business. Another one of the very cool things you get with this theme is this pre-built demonstration site packed in for Free, so you can see exactly how we achieved all the effects that are shown (images not included).

Check it out!

Augment PIC RapidWeaver Stack

Augment PIC – New RapidWeaver Stack

Augment Pic allows you to place captions on images anywhere in your site. Comments can glide beautifully in from the top, bottom, left and right sides.

Augment Pic also takes advantage of some very cool effects currently supported only by Chrome & Safari, but trends suggest support in all other modern browsers will soon follow. These image effects include
Blur, Brightness, Contrast, Grayscale, Hue-Rotate, Invert, Opacity, Saturate, and Sepia.

Check it out!

RapidWeaver Snippets Button

Simple Text Button Snippets

If you wanted separate install options for the snippets used in the Simple Text page, which come as free installs with the free stack, then you have a couple other options.

1. You can manually add them yourself using the codes below.

2. You can simple copy and paste the code below without ever installing them as snippets.

RapidWeaver Snippets Button

The code in these snippets controls the CSS and can be dragged and dropped in the Page Info > Header > CSS section.You then need to create the HTML that will take the CSS styling. These are not in the Snippets and can be easily created by copying and pasting this code:

1
2
3

<a class="buttonDark" href="http://YourLinkSomewhere.com">Button for Dark Backgrounds</a>
<a class="buttonLight" href="http://YourLinkSomewhere.com">Button for Light Backgrounds</a>
<a class="buttonSimple" href="http://YourLinkSomewhere.com">Button that's just dang Simple</a>

The snippets are not necessary to have in your Snippets section in Edit Mode either (so if you want that section cleaned up you can use the following codes):

For Button on Dark backgrounds

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35

.buttonDark {
     -webkit-border-radius: 3px;
     -moz-border-radius: 3px;
     -ms-border-radius: 3px;
     -o-border-radius: 3px;
     border-radius: 3px;
     text-shadow: 0 1px 1px #000;
     width: 80px;
     text-align: center;
     cursor: pointer;
     margin: 20px auto;
     display: block;
     padding: 7px 15px !important;
     -webkit-border-radius: 5px;
     -moz-border-radius: 5px;
     border-radius: 5px;
     text-shadow: 0px 1px 2px rgba(0, 0, 0, .7);
     border: 1px solid rgba(0,0,0,0.5);
     box-shadow: 0px 1px 1px rgba(255, 255, 255, .2), inset 0px 1px 1px rgba(255, 255, 255, .4);
     -webkit-box-shadow: 0px 1px 1px rgba(255, 255, 255, .2), inset 0px 1px 1px rgba(255, 255, 255, .4);
     -moz-box-shadow: 0px 1px 1px rgba(255, 255, 255, .2), inset 0px 1px 1px rgba(255, 255, 255, .4);
     -ms-box-shadow: 0px 1px 1px rgba(255, 255, 255, .2), inset 0px 1px 1px rgba(255, 255, 255, .4);
     -o-box-shadow: 0px 1px 1px rgba(255, 255, 255, .2), inset 0px 1px 1px rgba(255, 255, 255, .4);
     background-image: -moz-linear-gradient(top, rgba(255,255,255,0.05) 0%, rgba(0,0,0,0.05) 100%);
     background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(255,255,255,0.05)), color-  stop(100%,rgba(0,0,0,0.05)));
     background-image: -webkit-linear-gradient(top, rgba(255,255,255,0.05) 0%,rgba(0,0,0,0.05) 100%);
     background-image: -o-linear-gradient(top, rgba(255,255,255,0.05) 0%,rgba(0,0,0,0.05) 100%);
     background-image: -ms-linear-gradient(top, rgba(255,255,255,0.05) 0%,rgba(0,0,0,0.05) 100%);
     background-image: linear-gradient(to bottom, rgba(255,255,255,0.05) 0%,rgba(0,0,0,0.05) 100%);
     transition: all 0.4s ease-in-out;
     -moz-transition: all 0.4s ease-in-out;
     -webkit-transition: all 0.4s ease-in-out;
     -o-transition: all 0.4s ease-in-out;
     -ms-transition: all 0.4s ease-in-out;
}

For Button on Light backgrounds

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35

.buttonLight {
     -webkit-border-radius: 3px;
     -moz-border-radius: 3px;
     -ms-border-radius: 3px;
     -o-border-radius: 3px;
     border-radius: 3px;
     text-shadow: 0 1px 1px #FFF;
     width: 80px;
     text-align: center;
     cursor: pointer;
     margin: 20px auto;
     display: block;
     padding: 7px 15px !important;
     -webkit-border-radius: 5px;
     -moz-border-radius: 5px;
     border-radius: 5px;
     text-shadow: 0px 1px 2px rgba(0, 0, 0, .7);
     border: 1px solid rgba(0,0,0,0.5);
     box-shadow: 0px 1px 1px rgba(255, 255, 255, .2), inset 0px 1px 1px rgba(255, 255, 255, .4);
     -webkit-box-shadow: 0px 1px 1px rgba(255, 255, 255, .2), inset 0px 1px 1px rgba(255, 255, 255, .4);
     -moz-box-shadow: 0px 1px 1px rgba(255, 255, 255, .2), inset 0px 1px 1px rgba(255, 255, 255, .4);
     -ms-box-shadow: 0px 1px 1px rgba(255, 255, 255, .2), inset 0px 1px 1px rgba(255, 255, 255, .4);
     -o-box-shadow: 0px 1px 1px rgba(255, 255, 255, .2), inset 0px 1px 1px rgba(255, 255, 255, .4);
     background-image: -moz-linear-gradient(top, rgba(255,255,255,0.05) 0%, rgba(0,0,0,0.05) 100%);
     background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(255,255,255,0.05)), color-stop(100%,rgba(0,0,0,0.05)));
     background-image: -webkit-linear-gradient(top, rgba(255,255,255,0.05) 0%,rgba(0,0,0,0.05) 100%);
     background-image: -o-linear-gradient(top, rgba(255,255,255,0.05) 0%,rgba(0,0,0,0.05) 100%);
     background-image: -ms-linear-gradient(top, rgba(255,255,255,0.05) 0%,rgba(0,0,0,0.05) 100%);
     background-image: linear-gradient(to bottom, rgba(255,255,255,0.05) 0%,rgba(0,0,0,0.05) 100%);
     transition: all 0.4s ease-in-out;
     -moz-transition: all 0.4s ease-in-out;
     -webkit-transition: all 0.4s ease-in-out;
     -o-transition: all 0.4s ease-in-out;
     -ms-transition: all 0.4s ease-in-out;
}

The Simple Button

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22

.buttonSimple {
	text-align: center;
	cursor: pointer;
	background: #349BCE;
	-o-border-radius: 3px;
	-ms-border-radius: 3px;
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
	border-radius: 3px;
	border: 3px solid #4CAAD9;
	padding: 7px 15px !important;
	display: block;
	margin: 20px auto;	
	width: 90px;
}
.buttonSimple:hover {
	background: #4CAAD9;
}
.buttonSimple:active {
	background: #349BCE;
	border: 3px solid #349BCE;
}
Poseidon RapidWeaver Theme

Poseidon Theme Release

Poseidon powerfully & beautifully brings subtle design features, powerful functionality, and a fully responsive design. The navigation menu is fixed to the top of the page so every user never loses their ability to quickly navigate through your site. As users move throughout the site subtle web animation techniques employ an unforgettable experience without being too flashy. This theme is perfect for coupling with Hang Glider creating a dazzling experience as user’s screen sizes change from landscape to portrait on mobile devices and tablets.

Check it out

Lynda.com Online Tutorials

Improving Your Coding Skills

To find resources to help improve your coding is not difficult on the internet these days – fact it’s hard not to find your answers in many cases. You can find blogs and forums from just about any web design topic such as HTML, CSS, jQuery, JavaScript or even more advanced topics like MySQL and PHP. Over time I’ve found a hand full that are my personal favorites and that I’d like to recommend if you are a RapidWeaver user who wants to sharpen their coding skills. RapidWeaver is great software for users who want to avoid having to know much if any code, though knowing code is only going to enhance your experience and unlock more possibilities for you. The choice is yours.

1. Code Academy

For free help it really is hard to beat Code Academy. They don’t cover every topic, though they do touch on some great foundation topics and give you a chance to see your code live.

2. lynda.com

I’ve been a member at Lynda.com for years now and have used it to learn most of what I know today. They do not cover all topics or even every piece of software, but they do have a very extensive library and its growing all the time. In addition, they cover not only topics of web design, but also graphic design, SEO, business, and much much more.

On the downside Lynda.com does require a $25/mo membership fee, though I think it’s well worth every penny. You can also upgrade your membership and pay $37.50/mo which will give you access to all their exercise files.

3. CSS-Tricks

If you subscribe to a blog and want to improve your coding then definitely add CSS-Tricks to your list… if you haven’t already. Chris Coyier continues to delve deeper into some fun and amazing coding that doesn’t stop at CSS. In addition, he provides great example and snippets for achieving CSS and jQuery techniques.

What’s Yours?

There are lots more tools out there in the internet for increasing your skills and I’ve only touched on 3 ones that I love here. If you have one you love please comment and share what you love about it so much. If you want to explore other great ones that are not my personal favorites, but still very useful, check out these:

Aether RapidWeaver Theme

Aether RapidWeaver Theme Release

Our new theme Aether offers a minimal & business design with a rich set of customization options and all new design features. Aether is fully responsive and works in all modern browsers (works back to IE8). The theme takes advantage of some very awesome HTML5 & CSS3 effects to add an even more beautiful experience for visitors using the latest browsers, though will still appear great in older browsers.

Aether features both a built in slider and an extra content section for imported sliders (this is typically done with plugins like PlusKit). In addition, Aether comes packed with the Glide Slide slider completely FREE. Glide Slide is a fully responsive slider that allows inner content to be placed with a transition effect that emulates parallax animations.

WeaverPix has been tested inside the extra content slider section and performs beautifully – demos of some of our favorite sliders from WeaverPix has been displayed inside the preview of Aether as well.

Finally, Aether comes loaded with a fully responsive lightbox for your photo galleries.

Preview Page for Aether

Augment FLIP RapidWeaver Stack by 1LD

Augment Flip Release

Augment FLIP enables content to animate in the motion of a card flipping. This makes it a unique way to conceal and reveal content.

This Premium Rapid Weaver Stack uses the latest in CSS3 and also will not break older browsers such as ie8. It is programmed to be very user friendly and straight forward.

Compatible with all modern browsers.

Modern Browser Icons

Erebus Responsive RapidWeaver Theme by 1LD

New ‘Erebus’ Theme

Our newest theme Erebus is out and features some awesome web animation effects, clean layout, along with a very rich and engaging mobile display.

The site is, of course, fully responsive as well.

The theme takes advantage of some awesome new HTML 5 and CSS3 effects, but do not worry as we made it fully compatible all the way back to IE7. Older versions of Internet Explorer won’t have the animation effects, but the site will still display beautifully and function perfectly.

Latest News

One Little Designer

Popular Links