1LD Tutorials & Blogs



Add the Webfont Helper stack to the stacks editor. Then simply select the font you want to use and drag/drop it anywhere outside of the Webfont Helper stack.

Important: Do not publish your project with the Webfont Helper stack still in the editor. While this will certainly not cause any harm to your project/website it can cause an insanely long upload time as there are over 1000 font files included in this stack. We have broken each of the 45 fonts into separate stacks that can be dragged and dropped outside of the Webfont Helper stack to use. Once you have chosen fonts you want to use, delete the Webfont Helper stack from the editor and only the selected font files will be uploaded.

Each individual font stack has its own settings for implementation.


By default you must apply the font manually by using any of the highlighted font titles in a “Font-family” field inside of another stack. You may need to add quotation marks (“”) around the title depending on the stack you are using.

If you are familiar with CSS you can use the titles in the “font-family” rule. The example below will apply the font to the entire webpage.

body {
  font-family: “Nunito”;

Headers, Text, Headers & Text

There are options to automatically apply the font to Headers, text, or both.

Note: Some stacks may overwrite the font if they have their own font settings.

Wrapped content

When set to apply to wrapped content, only text content placed inside of the font stack will have the font applied to it.

Custom CSS Class

There is also an option to create a custom class if you have the ability to add classes to your elements.

GDPR Compliance

Google Fonts fall into a grey area with the new GDPR regulations and most professionals suggest you do not load fonts externally to be safe. This stack allows you to use some great fonts hosted on your own server without linking to Google.

More info: https://www.lifehacker.com.au/2018/06/how-to-be-gdpr-compliant-if-you-use-google-fonts-on-your-website/

RapidWeaver Stack Tutorials

RapidWeaver Theme Tutorials

RapidWeaver Project Documentation

Tutorials and documentation for all 1LD Project files can be found at the link below.

See Documentation

Get the power of a framework, for the price of a theme, in the convenience of a prebuilt RapidWeaver project file


Scroll Shift Stack

Scroll Shift Screenshot

Scroll Shift is the ultimate tool for adding seamless scroll-based animations to your web design projects. Create captivating and engaging websites by effortlessly animating elements as the user scrolls through the page. This tool can bring your designs to life with smooth transitions, eye-catching movements, and precise timing.

Create captivating visuals by linking multiple elements together to form a stacked layer effect. These elements can separate and come together to form a unified element, adding depth and dimension to your designs. The possibilities are endless as you craft intricate animations that leave a lasting impression.

Drive attention to essential content by implementing animations that trigger only when the user scrolls past a specific section. By strategically timing the animations, you can ensure that users take notice of crucial information and engage with your content effectively.

Check it out!

Latest News


Join our newsletter to get notified of new releases, updates, and discounts.


Popular Links

Free Stacks & Themes
See Order History
Product Tutorials

© 2011 One Little Designer, 1 Little Designer (1LD)

RapidWeaver is a trademark of Realmac Software