Page Builder Online

Choose a Template

Tip: Choose based on layout. Image and color scheme can be changed easily.

Opt-in page

Thank you page

Review page

Sales page

Download page

Blank page

Full content width

Content left offset

Content right offset

1-column with header

1-column with no top margin

1-column, no content background

1-column with full-width top bar

with video

with ad

with count down

with animation

out-of-the-box design

2-column with header

2-column with ad

2-column, 60-40 ratio, with video

2-column, 60-40 ratio

2-column, 40-60 ratio

2-column, full content width

Choose a List Manager:

Use SendSteed (LeadsLeap List Manager)

Use 3rd-Party List Manager

No opt-in form on this page

Choose a Row Type to add:

1-Column Row

2-Column Row

50-50

Left on top

Right on top

40-60

Left on top

Right on top

60-40

Left on top

Right on top

3-Column Row

Dedicated Row For Ad Widget

Copy and paste the HTML opt-in form code provided by your autoresponder provider here. The system will merge it into this widget.

Note: The form code should start with <form ...> and end with </form>. You should copy everything, starting from <form ...> including and until </form>. Everything before and after should be ignored.

✖

Popup CampaignID is set up in the Page Manager.

Go back to Page Manager (should be opened already in another tab), click 1, click 2, select the Popup. Then click Save.

Please note that the Popup CampaignID in this setting will only be updated after reloading.

Page and content backgrounds only
Other elements cannot be added

Ad widget only
Other elements cannot be added

Paypal payment button only
Other elements cannot be added

Add New Element:

Tip 1: Sort editor to move element to front / back.
Tip 2. Click and drag across locks to lock/unlock elements.

No element in this row.
Use the buttons above to add a new element.

Page Background Settings

Background type:

Content Background Settings

Position & Size

Warning: This element is outside its row/column. It may not be seeable in small browsers.

Width:

Top/Bottom Offset:

Left Offset:

Right Offset:

Setting & Styling

Background type:

Bkground Corner Radius:

Bkground Shadow:

Bkground Border:

You're about to save the design in the selected Row/Column as a Set. To proceed, enter a name for this Set for your reference.

Tip: Lock these elements in one group before saving. They will remain locked when inserted. You can then move them in group.

Background (For This Row)

Background type:

Full Page Width:

Position & Size

Warning: This element is outside its row/column. It may not be seeable in small browsers.

Left Offset: px	Middle	Top Offset: px
Width: px	Full Width

Setting & Styling

Text Editor:

Text Font:

Text Font Size: px

Text General Color:

Text Line Height:

Text Shadow:

Rotate: (-180 to 180)

Background Color:

Bkground Corner Radius:

Bkground Shadow:

Bkground Border:

Animation

Type:

Speed:

Repeat:

Start Delay:

Position & Size

Warning: This element is outside its row/column. It may not be seeable in small browsers.

Left Offset: px	Middle	Top Offset: px
Width: px	Full Width

Setting & Styling

Link URL:

Placeholder: ~source~

Link Target:

Link Title:

Text Editor:

Text Align:

Text Font:

Text Font Size: px

Text General Color:

Text Line Height:

Text Shadow:

Rotate: (-180 to 180)

Animation

Type:

Speed:

Repeat:

Start Delay:

Position & Size

Warning: This element is outside its row/column. It may not be seeable in small browsers.

Left Offset: px		Top Offset: px
Width: px	Full Width	Height: px	Lock Ratio

Setting & Styling

Current Icon:

Icon Action:

On Click:

Icon Styling

Icon Color:

Icon Shadow:

Rotate: (-180 to 180)

Blur: (0 - 20)

Skew: (-180 to 180)

Opacity: (0 - 1)

Animation

Type:

Speed:

Repeat:

Start Delay:

(Deprecated)

Font Icon element is now deprecated. Please replace this element with element ASAP.

Position & Size

Warning: This element is outside its row/column. It may not be seeable in small browsers.

Left Offset: px		Top Offset: px
Icon Size: px

Setting & Styling

Icon:

Icon Color:

Icon Shadow:

Icon Action:

On Click:

Animation

Type:

Speed:

Repeat:

Start Delay:

Position & Size

Warning: This element is outside its row/column. It may not be seeable in small browsers.

Left Offset: px	Middle	Top Offset: px
Width: px	Full Width	Height: px	Full Height

Setting & Styling

Background type:

Rotate: (-180 to 180)

Blur: (0 - 20)

Skew: (-180 to 180)

Opacity: (0 - 1)

Bkground Corner Radius:

Bkground Shadow:

Bkground Border:

Animation

Type:

Speed:

Repeat:

Start Delay:

Line

Position & Size

Warning: This element is outside its row/column. It may not be seeable in small browsers.

Left Offset: px	Middle	Top Offset: px
Width: px	Full Width

Setting & Styling

Line type:

Thickness: px

Color:

Bkground Shadow:

Rotate: (-180 to 180)

Animation

Type:

Speed:

Repeat:

Start Delay:

Position & Size

Warning: This element is outside its row/column. It may not be seeable in small browsers.

Left Offset: px	Middle	Top Offset: px
Width: px	Full Width	Height: px	Lock Ratio

Setting & Styling

Image URL:

Image Action:

On Click:

Image Styling

Position:

Grayscale:

Rotate: (-180 to 180)

Blur: (0 - 20)

Opacity: (0 - 1)

Bkground Brightness: (-9 to 9)

Bkground Corner Radius:

Bkground Shadow:

Bkground Border:

Animation

Type:

Speed:

Repeat:

Start Delay:

Position & Size

Warning: This element is outside its row/column. It may not be seeable in small browsers.

Left Offset: px	Middle	Top Offset: px
Width: px	Full Width	Height: px	Lock Ratio

Custom HTML Code

Mute, Autoplay, Loop Settings:

By default, we activate mute, autoplay and loop. To turn any variable off, in the HTML Code above, find mute=1 (or autoplay=1 or loop=1) and change 1 to 0 (for Youtube and Vimeo) or delete the variable (for mp4).

Please note that browsers do not allow autoplay with sound. If you want the video to autoplay, mute must be on. If you want sound, autoplay must be off.

Rotate: (-180 to 180)

Bkground Corner Radius:

Bkground Shadow:

Bkground Border:

Animation

Type:

Speed:

Repeat:

Start Delay:

Position & Size

Warning: This element is outside its row/column. It may not be seeable in small browsers.

Left Offset: px	Middle	Top Offset: px
Width: px	Full Width	Height: px	Lock Ratio

Settings

Type:

Countdown Method:

Page Load
Fixed Time
Weekly

Days Hide
Hours Hide
Minutes
Seconds

When countdown ends, go to: (Leave blank to stay)

Placeholder: ~source~

Animation

Type:

Speed:

Repeat:

Start Delay:

Position & Size

Warning: This element is outside its row/column. It may not be seeable in small browsers.

Left Offset: px	Top Offset: px
Width: px	Height: px

Paypal Payment Button Code

==Replace with your code from Paypal==

<div id="smart-button-container">
	<div style="text-align: center;">
		<div id="paypal-button-container"></div>
	</div>
</div>
<script src="https://www.paypal.com/sdk/js?client-id=AQBqCFwcJA9_zIqwbCv9wK1jmd5HGZVIR9ss_1VWo3ZgFS44-zP-trtNttPKZzw7l9lOZaJlVaINY2RD&enable-funding=venmo&currency=USD" data-sdk-integration-source="button-factory"></script>
<script>
	function initPayPalButton() {
		paypal.Buttons({
			style: {
				shape: 'rect',
				color: 'gold',
				layout: 'vertical',
				label: 'paypal',
				
			},

			createOrder: function(data, actions) {
				return actions.order.create({
					purchase_units: [{"amount":{"currency_code":"USD","value":1}}]
				});
			},

			onApprove: function(data, actions) {
				return actions.order.capture().then(function(orderData) {
					
					// Full available details
					console.log('Capture result', orderData, JSON.stringify(orderData, null, 2));

					// Show a success message within this page, e.g.
					const element = document.getElementById('paypal-button-container');
					element.innerHTML = '';
					element.innerHTML = '<h3>Thank you for your payment!</h3>';

					// Or go to another URL:  actions.redirect('thank_you.html');
					
				});
			},

			onError: function(err) {
				console.log(err);
			}
		}).render('#paypal-button-container');
	}
	initPayPalButton();
</script>

Position & Size

Warning: This element is outside its row/column. It may not be seeable in small browsers.

Left Offset: px	Top Offset: px
Width: px	Height: Autopx

Ad Settings

Number of ads:

Shadow:

Border:

Position & Size

Warning: This element is outside its row/column. It may not be seeable in small browsers.

Left Offset: px	Middle	Top Offset: px
Width: px	Full Width	Height: px

Button Setting & Styling

Button Action:

On Click:

Button Text:

Text Font:

Text Font Size: px

Text General Color:

Text Line Height:

Button Color:

Button Corner Radius:

Button Shadow:

Button Border:

Button Name:

Rotate: (-180 to 180)

Animation

Type:

Speed:

Repeat:

Start Delay:

Position & Size

Warning: This element is outside its row/column. It may not be seeable in small browsers.

Left Offset: px	Middle	Top Offset: px
Width: px	Full Width	Height: px

Setting & Styling

Input Type:

Input Name:

Incorrect Input Name will break your opt-in form. Make sure it is correct.

For SendSteed, please use these:

Input Name	Purpose
email name lastname any1word	Email First name Last name Other custom fields

Input Placeholder:

Text Font Size: px

Text Font:

Input Field Color:

Input Field Corner Radius:

Input Field Shadow:

Input Field Border:

Required Field: (Uncheck if it is optional)

Rotate: (-180 to 180)

Animation

Type:

Speed:

Repeat:

Start Delay:

	Border
	Grid