Upload File

how to design a custom opt-in form without a plugin // part 2

  • Home
  • Technology
  • How to Design a Custom Opt-in form without a Plugin // Part 2
25
Design a Custom Opt-in form DESIGN YOUR OWN BLOG by Marianne Manthey without a Plugin How to 2

Upload: marianne-manthey

Post on 13-May-2015

2.618 views

Category:

Technology


2 download

Report

Tags:

DESCRIPTION

How to Design a Custom Opt-in form without a Plugin // Part 2: Embed a Sign Up Form into your Blog This is part 2 of a 4 part series. All 4 parts should be published by end of Nov. 2013.

TRANSCRIPT

Page 1: How to Design a Custom Opt-in form without a Plugin // Part 2

Design a Custom Opt-in form

DESIGN YOUR OWN BLOG

by Marianne Manthey

without a Plugin

How to

2

Page 2: How to Design a Custom Opt-in form without a Plugin // Part 2

DESIGN YOUR OWN BLOG

PART 2

Embed a Sign Up Form into your Blog

Page 3: How to Design a Custom Opt-in form without a Plugin // Part 2

TABLE OF CONTENTS

©2013 DesignYourOwnBlog.com. All rights reserved.

This Slideshare is Part 2 of a 4 part tutorial

on designing a custom opt-in (sign up) form

for your blog.

The entire tutorial can be found here:

DesignYourOwnBlog.com

https://www.facebook.com/DesignYourOwnLovelyBlog
https://twitter.com/marianney
http://designyourownblog.com/blog-design-resources/tutorials/how-to-design-a-custom-opt-in-form-without-a-plugin-part-1
Page 4: How to Design a Custom Opt-in form without a Plugin // Part 2

Part 1 (last slideshow)

Create a Sign Up Form in MailChimp

• Create a List

• Create a Form

• Get the Embed Code

TABLE OF CONTENTS

©2013 DesignYourOwnBlog.com. All rights reserved.

http://eepurl.com/wV_FD
https://www.facebook.com/DesignYourOwnLovelyBlog
https://twitter.com/marianney
Page 5: How to Design a Custom Opt-in form without a Plugin // Part 2

Part 2 (this slideshow)

Embed a Sign Up Form into your Blog

• Embed into WordPress Widget

• Embed into Blogger Gadget

TABLE OF CONTENTS

©2013 DesignYourOwnBlog.com. All rights reserved.

https://www.facebook.com/DesignYourOwnLovelyBlog
https://twitter.com/marianney
Page 6: How to Design a Custom Opt-in form without a Plugin // Part 2

Part 3 (video)

Design Your Opt-in Form in PicMonkey

• Upload a background “photo”

• Add graphic elements

• Save as a background image

TABLE OF CONTENTS

©2013 DesignYourOwnBlog.com. All rights reserved.

https://www.facebook.com/DesignYourOwnLovelyBlog
https://twitter.com/marianney
Page 7: How to Design a Custom Opt-in form without a Plugin // Part 2

Part 4 (slideshow)

Style the Opt-in Form Design in your Blog

• A few simple CSS lessons – don’t be scared!

TABLE OF CONTENTS

©2013 DesignYourOwnBlog.com. All rights reserved.

https://www.facebook.com/DesignYourOwnLovelyBlog
https://twitter.com/marianney
Page 8: How to Design a Custom Opt-in form without a Plugin // Part 2

A: Embed Form into a WordPress Widget

Skip to slide 17 if you’re on Blogger

EMBED A FORM INTO YOUR WORDPRESS BLOG

©2013 DesignYourOwnBlog.com. All rights reserved.

https://www.facebook.com/DesignYourOwnLovelyBlog
https://twitter.com/marianney
Page 9: How to Design a Custom Opt-in form without a Plugin // Part 2

From your Dashboard, click on Appearance>Widgets

EMBED A FORM INTO YOUR WORDPRESS BLOG

©2013 DesignYourOwnBlog.com. All rights reserved.

https://www.facebook.com/DesignYourOwnLovelyBlog
https://twitter.com/marianney
Page 10: How to Design a Custom Opt-in form without a Plugin // Part 2

Expand the Sidebar

EMBED A FORM INTO YOUR WORDPRESS BLOG

©2013 DesignYourOwnBlog.com. All rights reserved.

https://www.facebook.com/DesignYourOwnLovelyBlog
https://twitter.com/marianney
Page 11: How to Design a Custom Opt-in form without a Plugin // Part 2

Drag a Text Widget into the Sidebar

EMBED A FORM INTO YOUR WORDPRESS BLOG

©2013 DesignYourOwnBlog.com. All rights reserved.

https://www.facebook.com/DesignYourOwnLovelyBlog
https://twitter.com/marianney
Page 12: How to Design a Custom Opt-in form without a Plugin // Part 2

Expand the Text Widget

EMBED A FORM INTO YOUR WORDPRESS BLOG

©2013 DesignYourOwnBlog.com. All rights reserved.

https://www.facebook.com/DesignYourOwnLovelyBlog
https://twitter.com/marianney
Page 13: How to Design a Custom Opt-in form without a Plugin // Part 2

Go back to MailChimp and copy the embed

code from Part 1.

EMBED A FORM INTO YOUR WORDPRESS BLOG

©2013 DesignYourOwnBlog.com. All rights reserved.

http://eepurl.com/wV_FD
http://designyourownblog.com/blog-design-resources/tutorials/how-to-design-a-custom-opt-in-form-without-a-plugin-part-1/
https://www.facebook.com/DesignYourOwnLovelyBlog
https://twitter.com/marianney
Page 14: How to Design a Custom Opt-in form without a Plugin // Part 2

Paste the HTML

code into the text

widget.

EMBED A FORM INTO YOUR WORDPRESS BLOG

©2013 DesignYourOwnBlog.com. All rights reserved.

https://www.facebook.com/DesignYourOwnLovelyBlog
https://twitter.com/marianney
Page 15: How to Design a Custom Opt-in form without a Plugin // Part 2

View your blog

page…

And refresh.

EMBED A FORM INTO YOUR WORDPRESS BLOG

©2013 DesignYourOwnBlog.com. All rights reserved.

https://www.facebook.com/DesignYourOwnLovelyBlog
https://twitter.com/marianney
Page 16: How to Design a Custom Opt-in form without a Plugin // Part 2

Your new form

should now

appear.

Hmm… needs

work!

EMBED A FORM INTO YOUR WORDPRESS BLOG

©2013 DesignYourOwnBlog.com. All rights reserved.

https://www.facebook.com/DesignYourOwnLovelyBlog
https://twitter.com/marianney
Page 17: How to Design a Custom Opt-in form without a Plugin // Part 2

B: Embed Form into a Blogger Gadget

WordPress folks, skip to slide 24

EMBED A FORM INTO YOUR BLOGGER BLOG

©2013 DesignYourOwnBlog.com. All rights reserved.

https://www.facebook.com/DesignYourOwnLovelyBlog
https://twitter.com/marianney
Page 18: How to Design a Custom Opt-in form without a Plugin // Part 2

From your Dashboard, click on Layout

EMBED A FORM INTO YOUR BLOGGER BLOG

©2013 DesignYourOwnBlog.com. All rights reserved.

https://www.facebook.com/DesignYourOwnLovelyBlog
https://twitter.com/marianney
Page 19: How to Design a Custom Opt-in form without a Plugin // Part 2

Next, click Add a Gadget in the sidebar

EMBED A FORM INTO YOUR BLOGGER BLOG

©2013 DesignYourOwnBlog.com. All rights reserved.

https://www.facebook.com/DesignYourOwnLovelyBlog
https://twitter.com/marianney
Page 20: How to Design a Custom Opt-in form without a Plugin // Part 2

Click the [+] to add the HTML/JavaScript gadget

EMBED A FORM INTO YOUR BLOGGER BLOG

©2013 DesignYourOwnBlog.com. All rights reserved.

https://www.facebook.com/DesignYourOwnLovelyBlog
https://twitter.com/marianney
Page 21: How to Design a Custom Opt-in form without a Plugin // Part 2

Go back to MailChimp and copy the embed

code from Part 1.

EMBED A FORM INTO YOUR BLOGGER BLOG

©2013 DesignYourOwnBlog.com. All rights reserved.

http://eepurl.com/wV_FD
http://designyourownblog.com/blog-design-resources/tutorials/how-to-design-a-custom-opt-in-form-without-a-plugin-part-1/
https://www.facebook.com/DesignYourOwnLovelyBlog
https://twitter.com/marianney
Page 22: How to Design a Custom Opt-in form without a Plugin // Part 2

Paste the HTML code into the window

EMBED A FORM INTO YOUR BLOGGER BLOG

©2013 DesignYourOwnBlog.com. All rights reserved.

https://www.facebook.com/DesignYourOwnLovelyBlog
https://twitter.com/marianney
Page 23: How to Design a Custom Opt-in form without a Plugin // Part 2

View your blog

and refresh.

Your new form

should now

appear!

EMBED A FORM INTO YOUR BLOGGER BLOG

©2013 DesignYourOwnBlog.com. All rights reserved.

https://www.facebook.com/DesignYourOwnLovelyBlog
https://twitter.com/marianney
Page 24: How to Design a Custom Opt-in form without a Plugin // Part 2

Our forms aren’t exactly very pretty are they?

That’s ok. In Part 3, we’ll have fun designing

our new forms!

EMBED A FORM INTO YOUR BLOG

©2013 DesignYourOwnBlog.com. All rights reserved.

https://www.facebook.com/DesignYourOwnLovelyBlog
https://twitter.com/marianney
Page 25: How to Design a Custom Opt-in form without a Plugin // Part 2

Continue the 4 Part Tutorial

THANK YOU

©2013 DesignYourOwnBlog.com. All rights reserved.

Thank you for watching Part 2 of How to Design a Custom Opt-in Form without a Plugin!

*All MailChimp links are referral links.

©2013 DesignYourOwnBlog.com. All rights reserved.

http://designyourownblog.com/blog-design-resources/tutorials/how-to-design-a-custom-opt-in-form-without-a-plugin-part-1
https://www.facebook.com/DesignYourOwnLovelyBlog
https://twitter.com/marianney
http://eepurl.com/wV_FD

(2016-08-13) [Grupy-SP] Plugin pytest-doctest-custom v1.0.0

10 Great Custom Contact Form examples for Magento - Plugin Company

WordPress Colorbox Plugin Noor's Plugin

dkd - archive.apachecon.comarchive.apachecon.com/.../TYPO3_and_SOLR.pdf · Apache Solr for TYPO3 Solutions Record Monitor and Indexing Queue Custom Solr Query Parser plugin Integration

How to create a stylish opt-in box for your WordPress website using the Magic Action Box plugin

Easyazon plugin - Easyazon plugin review, Easyazon plugin download, and use

Software Engineering for Android – Security and User Experience … · 2011-07-07 · Bugtracking Code Review Common Build Telekom Plugin Plugin Plugin Plugin Plugin Plugin integrationPlugin

GARANTIE NORMAND wagons de ferme • Bennes Basculantes€¦ · Rotation par engrenage Opt. Opt. Opt. Opt. Opt. Opt. Opt. Opt. Opt. Opt. Opt. Chute 1 ou 2 défl ect eu rs 1 111 1111

Advanced Business Applications for the Cloud: Pacific ...media.progress.com/exchange/2014/slides/workshop_rollbase-advan… · Custom UI Control – jQuery Plugin ... jQuery Plugin

Create Custom Post Type Plugin

What is a Plugin?teamtom.wpfoxhole.com/wp-content/uploads/2019/11/Plugins... · 2019. 11. 14. · A Plugin is a collection of custom functions that can do a number of things: 1. “Extend”

Plugin Index - link.springer.com3A978-1-4302-2896-7%2F… · Custom Post Types, Taxonomies, and Fields Custom Post Type UI provides an options page that allows you to create and manage

Table of Contents - LiveCodelivecode.byu.edu/standalone/StandaloneBuilderTutorial.pdfTable of Contents Standalone Builder ... .dmg custom install volume ... Open IconBuilder plugin

How to create a 100% custom email opt in form with aweber

Unity Plugin for Android User Guide - mkt.adlibr.com · - 3 Page-플러그인import Unity Plugin for Android User Guide 1. Assets > Import Package > Custom Package 메뉴를클합니다

Plugin-Space Marine Custom Tray Reference Sheet

PORTAFOLIO-17!12!2014 Opt Opt Opt Opt

Cordova Plugin Roundup - TJ VanToll€¦ · Manage the custom Apache Cordova plugins used in your project. To start, select a plugin from the list. The Telerik Verified Plugins Marketplace

Jurnal Uhamzah Opt Opt Opt

Lobo - Custom Home Builders Rio Rancho - RayLeerayleehomes.com/wp-content/uploads/2019/04/2009-Lobo-4... · 2019-04-24 · RAYLEEHOMES.COM Lobo 9068 SGD OPT 9080 SGD OPT 12080 SGD

The 8 Top Reasons to Opt for Custom eLearning

(Opt.) Fl. 2 (Opt.) Bsn. (Opt. ) (Opt. ) (Opt. ) A. Sax. 1 A. Sax. 2 (Opt. ) T. Sax. B. Sax. (Opt.) I (Opt. Hrn. I Hrn. 2 Trb.2 Trb.3 (Opt.) Euph. ... Picc. (Opt.) Fl. 2 (Opt.) Bsn

mama/o Sec CO simile simile (Opt. ) (Opt. ) Bsn. (Opt.) Cl. 2 (Opt.) (Opt. ) A. Sax. T. Sax. (Opt.) B. sax (Opt.) Trp. 2 (Opt.) Hr-n. 1 Hrn. 2 (Opt.) Trb. I 2 (Opt.) Euph. (Opt.) Tuba

How to Design a Custom Opt-in form without a Plugin // Part 3

 · (Opt) (Opt.) (Opt) Cl. 1 Cl. 2 Cl. 3 (Opt) (Opt.) (Opt.) B. Sax. (Opt,) Trp 1 Trp. 2 (Opt,) Try 3 (Opt.) 1 Hrn, 2 (Opt.) Hrn. 3 (Opt.) Trb, 1 Trb 2

collaboration with the client Modern tools for remote · 2019. 10. 20. · WordPress API + vue.js custom plugin custom theme development. How to get feedback? How to optimize remote

DIALux4[1].0- · PDF filedialux 2 plugin. 1.X. plugin , plugin. luminaire selection Plugin plugin . home page, Intenet Explorer

Design a Custom Opt-in Form without a Plugin // Part 4

Human Interpreters - US...Wordpress Statistics plugin 2017-07 vulnerability in wordpress plugin Joomla CMS web application 2017-05 sites exposed to execution of custom sql code Moodle

Devonshire Front Page - Keystone Custom Homesdata.keystonecustomhome.com/Brochures/ads00.pdfStudy opt. Bed 5) 13'5 x 140 Garage 194 x 208 reakfa Kitchen Pntry Inin Opt. Angled Breakfast

Do it in code! A guide to creating a custom site structure plugin in WordPress

IWATA CUSTOM MICRON AIRBRUSH SERIES (VERSION 2) · 2020. 10. 16. · IWATA CUSTOM MICRON AIRBRUSH SERIES (VERSION 2) REPLACEMENT PARTS CM-SB x OPT OPT OPT OPT CM-C OPT x x x x OPT

Shells! - ritlug.com · Favorite Shells Continued Agnosterzak: - Custom Oh-my-zsh theme based on powerline vim plugin and agnoster theme. Plugins. Bash Aliases Still and custom commands

How to Design a Custom Opt-in form without a Plugin // Part 1

CONTINUOUS EVERYTHINGc938f2a2-d85c-43d1...Build & Release Management Continuous Integration & Deployment Workflow Configuration & Automation Custom Add-On (plugin) Development Our