1LD Tutorials & Blogs

Tutorials

Pattern Maker Canvas Breakdown

After adding the Pattern Maker stack to the editor you will see a Canvas above a “Drop stacks here” section. This canvas is where you are able to design a new pattern. The canvas is surrounded by a Preview Area that allows you to see the pattern duplicated in every direction.

Initially, a single circle shape is added to the Canvas in the center. When you select a shape by clicking on it, a number representing its Index out of the Total number of Shapes will show in the top right. More shapes can be added by clicking the Add New Shape Button or by copying and pasting (Cmd+c Cmd+v) a shape that is already in the canvas.

Adding Content

The Pattern Maker stack is for creating background patterns and requires content to where the pattern will be applied. And any stacks content to the “Drop stacks here” section and the pattern will be used as the background for that content.

You may also instead download the created pattern as an image that you can use anywhere images are accepted, most notably in any other stack that allows you to add background images. Learn more about how to download a pattern you have created in the “Downloading a Pattern Image” tutorial below.

Selecting and editing a shape

You can select a shape simply by clicking on it. If a shape is overlapped by another and you are unable to select it, you can use the arrow keys to navigate through the shapes by index number.

Open the Inspector to see the shapes settings panel.

Shape Settings Panel Breakdown

Category
Select from 3 different shape categories. There is also an option to use an image instead of one provided shapes.

Shape #
Each shape categories has 24 different shapes to choose from. Use this slider to select a shape.

Stroke
Increase the stroke of a shape to switch between solid and outlined shapes. Every value over 0 defines the width of the stroke.

Size
Adjusts the overall size or scale of the shape in pixels.

Color
Select from 3 different color categories. The Major, Minor, and Accent categories are defined in the Pattern Maker stack settings panel. You may also optionally define a custom color for the selected shape.

Shadow Color & Spread
If the shadow spread value is greater than 0 a shadow will display around the edges of the shape spread out by the defined pixel amount. Use the shadow color option to change the intensity and color of the shadow.

Blur
If the blur value is greater than 0 the entire shape will blur by the defined pixel amount.

Left/Right & Top/Bottom
Adjust the position of the shape in the canvas. Shapes are positioned by a pixel value based on an origin at the center of shape. The canvas is 200×200 pixels in size, though the size it displays at when published and in preview is defined in the Pattern Maker stack settings panel.

Rotate
Adjust the rotation of the shape in degrees.

Z-index
Adjust the stacking order of the shapes relative to one another. Higher z-index values will display on top of lower z-index values.

Pattern Maker Settings

Select the Pattern Maker stack and open the Page Inspector – settings panel.

Pattern Size
Adjust the overall scale and size of the created pattern. The pattern size can only be viewed when published or by switching to preview mode.

Shape Colors
The Major, Minor, and Accent color categories can be defined here. These colors can be applied to individual shapes by selecting a shape and clicking on a color category in the settings panel.

Use Image
Enable this option to use a pattern image instead of the pattern currently in the canvas.

Downloading a Pattern Image

By default, every pattern you design with the Pattern Maker stack will automatically be converted to a temporary image that will be used as the background for the stack. This temporary image is generated every time the page is loaded. This will not put a significant load our your website but the pattern may take a noticeable amount of time to load if you have multiple patterns throughout the stacks page.

It is recommended that you download the generated pattern image and use it as a background instead. To download a pattern image you will just need to preview the Stacks page by pressing Cmd+p (while the RapidWeaver app is active). Click on the “Download Pattern” button to download the image. If you are using the RapidWeaver preview mode you will need to drag and drop the image into a folder or the desktop.

After downloading the image, switch back to edit mode and select the Pattern Maker stack. In the settings panel enable the “Use Image” setting. Drag and drop the pattern image to apply the pattern. The download pattern button is only visible in preview mode and will not be present on a published website.

Once this is done, the pattern will no longer need to be generated. The downloaded pattern image can also be used anywhere images are accepted.

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

Blog

Super Forms 2 – 1.2.0 Update

Through customer feedback, we were able to add some new features and fix a few bugs with our Super Forms 2 stack. Check out the list of changes below. This update is free for those who own the Super Forms 2 stack. 

Super Forms 2 (Version 1.2.0)

  • NEW: You can now customize each field’s Required/Invalid input message
  • NEW: Customize checkbox true and false values (“Yes” and “No”)
  • NEW: Customize file upload error messages
  • NEW: reCAPTCHA now has an option to support non SSL (http) websites
  • NEW: Support for v2 invisible reCAPTCHA
  • NEW: Support for v3 reCAPTCHA
  • NEW: Set a specific locale/language for reCAPTCHA
  • NEW: Allow the form to submit to Google Sheets and an email address at the same time
  • NEW: Optionally customize the name of each field for Google Spreadsheets and the titles as shown in the sent message
  • Improved: Prevents notices for empty form fields from displaying in PHP logs
  • Improved: Date timezone defaults to UTC in case the server does not have a default defined timezone
  • Fixed: Bug that could stop attachments from being sent properly
  • Fixed: File upload field was rejecting files if the extensions had capital letters
  • Fixed: Bug that could cause attachments to arrive with 0kb file sizes
  • Fixed: Multi select now properly concats selected options
  • Fixed: Checkbox display bug in iOS Safari
  • Other minor bug fixes 

Check it out!

Latest News

Newsletter

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

Subscribe

Popular Links

Free Stacks & Themes
See Order History
Product Tutorials
FAQs

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

RapidWeaver is a trademark of Realmac Software