<!DOCTYPE html>
<html lang="en">
<head>
<meta name="application-name" content="Creative Educator">
<meta name="msapplication-config" content="https://creativeeducator.tech4learning.com/browserconfig.xml" />
<meta charset="UTF-8">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="robots" content="index,follow" />
<meta name="msapplication-TileImage" content="/images/mstile-144x144.png">
<meta name="msapplication-TileColor" content="#0e0e0e">
<meta property="og:site_name" content="Creative Educator"/>
<meta property="og:type" content="article" />
<meta name="twitter:card" content="summary_large_image">
<meta name="twitter:site" content="@CreativeEduc8r">
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link rel="icon" type="image/png" href="/images/favicon-16x16.png" sizes="16x16">
<link rel="icon" type="image/png" href="/images/favicon-32x32.png" sizes="32x32">
<link rel="icon" type="image/png" href="/images/favicon-96x96.png" sizes="96x96">
<link rel="apple-touch-icon" href="/images/apple-touch-icon-57x57.png" sizes="57x57">
<link rel="apple-touch-icon" href="/images/apple-touch-icon-60x60.png" sizes="60x60">
<link rel="apple-touch-icon" href="/images/apple-touch-icon-72x72.png" sizes="72x72">
<link rel="apple-touch-icon" href="/images/apple-touch-icon-76x76.png" sizes="76x76">
<link rel="apple-touch-icon" href="/images/apple-touch-icon-114x114.png" sizes="114x114">
<link rel="apple-touch-icon" href="/images/apple-touch-icon-120x120.png" sizes="120x120">
<link rel="apple-touch-icon" href="/images/apple-touch-icon-144x144.png" sizes="144x144">
<link rel="apple-touch-icon" href="/images/apple-touch-icon-152x152.png" sizes="152x152">
<!--<link href='https://fonts.googleapis.com/css?family=Cabin:600' rel='stylesheet' type='text/css'>-->
<link href="https://fonts.googleapis.com/css?family=Roboto+Condensed" rel="stylesheet">
<link href='https://fonts.googleapis.com/css?family=Roboto:400,500&display=swap' rel='stylesheet' type='text/css'>
<link href='https://fonts.googleapis.com/css?family=Oswald:500' rel='stylesheet' type='text/css'>
<link type="text/css" rel="stylesheet" media="screen" href="/css/ce_main-2024.css">
<link type="text/css" rel="stylesheet" media="print" href="/css/ce_print.css">
<script type="text/javascript" src="/js/ce.js" async></script>
<script>
var
pageType = "general";
</script>
<!-- Meta Pixel Code -->
<script>
!function(f,b,e,v,n,t,s)
{if(f.fbq)return;n=f.fbq=function(){n.callMethod?
n.callMethod.apply(n,arguments):n.queue.push(arguments)};
if(!f._fbq)f._fbq=n;n.push=n;n.loaded=!0;n.version='2.0';
n.queue=[];t=b.createElement(e);t.async=!0;
t.src=v;s=b.getElementsByTagName(e)[0];
s.parentNode.insertBefore(t,s)}(window, document,'script',
'https://connect.facebook.net/en_US/fbevents.js');
//fbq('init', '689667733649262');
fbq('init', '722970576812014');
fbq('track', 'PageView');
</script>
<noscript><img height="1" width="1" style="display:none"
src="https://www.facebook.com/tr?id=722970576812014&ev=PageView&noscript=1"
/></noscript>
<!-- End Meta Pixel Code -->
<!-- Google Tracking Code -->
<!-- Google tag (gtag.js) -->
<script async src="https://www.googletagmanager.com/gtag/js?id=AW-1067247009"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', 'AW-1067247009');
</script>
<!-- Event conversion
<script>
gtag('event', 'conversion', {'send_to': 'AW-1067247009/Hm94CNrLiK0DEKHL8_wD'});
</script> -->
<script>
// Fires in addition to the automatic page_view
gtag('event', 'landing_page_view', {
event_category: 'engagement',
event_label: 'LP - CE'
});
</script>
<!-- End Google Tracking Code -->
<!-- Edit the following items on every page -->
<meta name="description" content="A simple tool to create and print custom graphic organizer worksheets to use in your classroom." />
<title>Graphic Organizer Maker | Creative Educator</title>
<!-- Open Graph data -->
<meta property="og:url" content="https://creativeeducator.tech4learning.com/goapp/graphic-organizer-maker" />
<meta property="og:title" content="Graphic Organizer Maker | Creative Educator" />
<meta property="og:description" content="Create a graphic organizer worksheets to use in your classroom." />
<meta property="og:image" content="https://creativeeducator.tech4learning.com/images/pl_main_629.jpg" />
<!-- Twitter Card data -->
<meta name="twitter:title" content="Graphic Organizer Maker | Creative Educator">
<meta name="twitter:description" content="Create a graphic organizer worksheets to use in your classroom.">
<meta name="twitter:image" content="https://creativeeducator.tech4learning.com/images/pl_main_629.jpg">
<!-- Additional css and js -->
<link type="text/css" rel="stylesheet" href="/css/goapp.css">
<!-- <script type="text/javascript" src="/js/jspdf.min.js"></script> -->
<script type="text/javascript" src="/js/goapp.js"></script>
<!-- End items to edit -->
</head>
<body class="page-goapp">
<!-- Begin Include Main CE Header -->
<div id="header">
<a href="/" aria-label="Go to Home Page" title="Go to Home Page">
<img src="/images/ce_logo_wide.svg" alt="Creative Educator" title="Creative Educator" width="544px" height="52px"/>
</a>
<div id="navText">
<ul class="nav">
<li id="nav-topic" class="nav"><a href="/topic-menu">Topics</a></li>
<li id="nav-lessons" class="nav"><a href="/lesson-plans">Lessons</a></li>
<li id="nav-services" class="nav training"><a href="/professional-learning">Training</a></li>
<!-- <li id="nav-services" class="nav" onClick="show_services_menu()">Services</li> -->
</ul>
</div>
</div>
<!-- End Include Main CE Header -->
<div class="pageDividerFull"></div>
<div id="pageBody" class="pageBody fullwidth">
<!-- Begin Include Topic Page Headline Article -->
<div class="columnMain">
<!-- Begin Article Body -->
<h1 class="topic">Create a Graphic Organizer</h1>
<div class="gosection">
<h2>Step 1: Choose the type of organizer</h2>
<div class="gotypes">
<button id="btn-go-type-thoughtweb" class="go-type" data-image="thoughtweb.svg" data-imgclass="square" data-name="Thought Web" data-desc="Write the main idea in the center bubble. Brainstorm related ideas in the connecting bubbles. Add details to the bubble connected to each idea. If you need more space, draw your own bubbles and connections.">
<img src="/goapp/images/thoughtweb.svg" alt=""/>
<span>Thought Web</span>
</button>
<button id="btn-go-type-flowchart" class="go-type" data-image="flowchart.svg" data-imgclass="rect" data-name="Flowchart" data-desc="Think about all the steps in the process. Write the first step in the process in the First box. Write the next steps in their own boxes. Write the last step in the bottom box. If there are too many boxes on the page, skip one. If you need more boxes, number the steps and continue them on the back of the page.">
<img src="/goapp/images/flowchart.svg" alt=""/>
<span>Flowchart</span>
</button>
<button id="btn-go-type-cluster" class="go-type" data-image="cluster.svg" data-imgclass="square" data-name="Cluster" data-desc="Write the word you want to describe in the center bubble. Write details about the word in the bubbles connected to it. Use the five senses and who, what, when, where, why, and how to think of more details.">
<img src="/goapp/images/cluster.svg" alt=""/>
<span>Cluster</span>
</button>
<button id="btn-go-type-funnel" class="go-type" data-image="funnel.svg" data-imgclass="square" data-name="Idea Funnel" data-desc="Write down the big idea or all the ideas you brainstormed in the top box. The next box is smaller. Write a narrower description of the idea or get rid of at least two ideas in the list. The next box is even smaller. Once again, pick the best ideas or parts of the larger idea. Repeat this process until you only have one specific idea in the bottom box.">
<img src="/goapp/images/funnel.svg" alt=""/>
<span>Idea Funnel</span>
</button>
<button id="btn-go-type-spider" class="go-type" data-image="spider.svg" data-imgclass="square" data-name="Spider" data-desc="Write the topic or idea in the body of the spider. Write connected ideas and details on each leg of the spider.">
<img src="/goapp/images/spider.svg" alt=""/>
<span>Spider</span>
</button>
<button id="btn-go-type-frayer" class="go-type" data-image="frayer.svg" data-imgclass="square" data-name="Frayer Model" data-desc="Write the topic or idea in the middle box. Write four different ways to represent it in the outside boxes.">
<img src="/goapp/images/frayer.svg" alt=""/>
<span>Frayer Model</span>
</button>
<button id="btn-go-type-timeline" class="go-type" data-image="timeline.svg" data-imgclass="square" data-name="Timeline" data-desc="Write the starting date on the left end and the ending date on the right side. If necessary, add other dates to the marks on the timeline. Sequence events in order on the timeline. Be sure to include a date and description for all events on the timeline.">
<img src="/goapp/images/timeline.svg" alt=""/>
<span>Timeline</span>
</button>
<button id="btn-go-type-venn2" class="go-type" data-image="venn2.svg" data-imgclass="square" data-name="Two-circle Venn" data-desc="Write the name for the two things you are comparing next to each of the circles below. Write words that describe how these two things are different in the areas that do not overlap. Write words that describe how these two things are similar in the area where the circles overlap.">
<img src="/goapp/images/venn2.svg" alt=""/>
<span>Two-circle Venn</span>
</button>
<button id="btn-go-type-cycle" class="go-type" data-image="cycle.svg" data-imgclass="square" data-name="Cycle" data-desc="Think of all the steps in the _____ process. You may want to write them down on the back of the paper. In the first box, write the first step in _____. Write the next step in the next box. Continue writing each step in its own box. Make sure the cycle repeats when it reaches the top box.">
<img src="/goapp/images/cycle.svg" alt=""/>
<span>Cycle</span>
</button>
<button id="btn-go-type-fivews" class="go-type" data-image="fivews.svg" data-imgclass="rect" data-name="Five W's" data-desc="Reread your information about the topic. Fill in the Who, What, Where, When, Why, and How boxes.">
<img src="/goapp/images/fivews.svg" alt=""/>
<span>Five W's</span>
</button>
<button id="btn-go-type-scale" class="go-type" data-image="scale.svg" data-imgclass="square" data-name="Scale" data-desc="Write the words you want to use at each end of the scale. Mark the point on the scale that best represents your position. Use the space below the scale to explain your position.">
<img src="/goapp/images/scale.svg" alt=""/>
<span>Scale</span>
</button>
<button id="btn-go-type-venn3" class="go-type" data-image="venn3.svg" data-imgclass="square" data-name="Three-circle Venn" data-desc="Write the name for the three things you are comparing next to each of the circles below. Write words that describe how these things are different in the areas that do not overlap. Write words that describe how these things are similar in the area where the circles overlap.">
<img src="/goapp/images/venn3.svg" alt=""/>
<span>Three-circle Venn</span>
</button>
<button id="btn-go-type-kwhl" class="go-type" data-image="kwhl.svg" data-imgclass="rect" data-name="KWHL" data-desc="Think of the topic. In the K column, write the things that you already know about it. In the W column, write the things that you want to know about it. In the H column, write how you can learn about it. When you are done with research and experiments, write what you learned about it in the L column.">
<img src="/goapp/images/kwhl.svg" alt=""/>
<span>KWHL</span>
</button>
<button id="btn-go-type-kwhl" class="go-type" data-image="kwl.svg" data-imgclass="rect" data-name="KWL" data-desc="Think of the topic. In the K column, write the things that you already know about it. In the W column, write the things that you want to know about it. When you are done with research and experiments, write what you learned about it in the L column.">
<img src="/goapp/images/kwl.svg" alt=""/>
<span>KWL</span>
</button>
<button id="btn-go-type-factopinion" class="go-type" data-image="factopinion.svg" data-imgclass="rect" data-name="Fact vs Opinion" data-desc="Reread the information about the topic. Write down facts about the topic in the fact column. Write down opinions about the topic in the opinion column.">
<img src="/goapp/images/factopinion.svg" alt=""/>
<span>Fact vs Opinion</span>
</button>
<button id="btn-go-type-proscons" class="go-type" data-image="proscons.svg" data-imgclass="rect" data-name="Pros and Cons" data-desc="Write the problem at the top of the page. Write a solution below the problem. List possible benefits in the Pros column. List possible negative outcomes in the Cons column.">
<img src="/goapp/images/proscons.svg" alt=""/>
<span>Pros and Cons</span>
</button>
</div>
</div>
<div class="gosection">
<h2>Step 2 <span class="grey">(optional)</span>: Add a title</h2>
<input type="text" id="go-title" aria-label="Title field"></input>
</div>
<div class="gosection">
<h2>Step 3 <span class="grey">(optional)</span>: Add instructions or a description</h2>
<textarea id="go-description" rows="4" maxlength="500" aria-label="Description field"></textarea>
<button class="link disabled" id="btn-desc">Inspiration</button>
</div>
<div class="gosection last">
<h2>Step 4: Print your organizer</h2>
<!-- <button id="btn-go-download" class="submitButton disabled">Download PDF</button> -->
<button id="btn-go-print" class="go-button disabled">
<svg xmlns="https://www.w3.org/2000/svg" viewBox="0 -960 960 960"><path d="M640-640v-120H320v120h-80v-200h480v200h-80Zm-480 80h640-640Zm560 100q17 0 28.5-11.5T760-500q0-17-11.5-28.5T720-540q-17 0-28.5 11.5T680-500q0 17 11.5 28.5T720-460Zm-80 260v-160H320v160h320Zm80 80H240v-160H80v-240q0-51 35-85.5t85-34.5h560q51 0 85.5 34.5T880-520v240H720v160Zm80-240v-160q0-17-11.5-28.5T760-560H200q-17 0-28.5 11.5T160-520v160h80v-80h480v80h80Z"/></svg>
<span>Print</span>
</button>
<p>To save a PDF file, at the Print dialog, use the Destination pull-down menu to choose Save as PDF.</p>
</div>
<!-- End Article Body -->
</div>
<!-- Begin Right Column -->
<div class="columnRight">
<a class="normal" href="https://instagram.com/CreativeEduc8r" title="Creative Educator on Instagram" aria-label="Creative Educator on Instagram" target="_blank">
<div id="instagram-follow-right" class="signup-callout instagram">
<img class="instagramfollow" src="/images/CE-instagram_no-background.svg" alt="" />
<p>Follow us on Instagram for daily inspiration</p>
</div>
</a>
<div class="popularBox">
<h3 class="popular">Sample Organizers</h3>
</div>
<div class="popularList">
<ul class="popular">
<li class="popular"><a class="popular" href="/goapp/samples/thought_web.pdf" target="_blank">Thought Web</a></li>
<li class="popular"><a class="popular" href="/goapp/samples/flowchart.pdf" target="_blank">Flowchart</a></li>
<li class="popular"><a class="popular" href="/goapp/samples/cluster.pdf" target="_blank">Cluster</a></li>
<li class="popular"><a class="popular" href="/goapp/samples/idea_funnel.pdf" target="_blank">Idea Funnel</a></li>
<li class="popular"><a class="popular" href="/goapp/samples/spider.pdf" target="_blank">Spider</a></li>
<li class="popular"><a class="popular" href="/goapp/samples/frayer.pdf" target="_blank">Frayer Model</a></li>
<li class="popular"><a class="popular" href="/goapp/samples/timeline.pdf" target="_blank">Timeline</a></li>
<li class="popular"><a class="popular" href="/goapp/samples/two-circle_venn.pdf" target="_blank">Two-circle Venn</a></li>
<li class="popular"><a class="popular" href="/goapp/samples/cycle.pdf" target="_blank">Cycle</a></li>
<li class="popular"><a class="popular" href="/goapp/samples/five_ws.pdf" target="_blank">Five W's</a></li>
<li class="popular"><a class="popular" href="/goapp/samples/scale.pdf" target="_blank">Scale</a></li>
<li class="popular"><a class="popular" href="/goapp/samples/three-circle_venn.pdf" target="_blank">Three-circle Venn</a></li>
<li class="popular"><a class="popular" href="/goapp/samples/kwhl.pdf" target="_blank">KWHL</a></li>
<li class="popular"><a class="popular" href="/goapp/samples/kwl.pdf" target="_blank">KWL</a></li>
<li class="popular"><a class="popular" href="/goapp/samples/fact_vs_opinion.pdf" target="_blank">Fact vs Opinion</a></li>
<li class="popular"><a class="popular" href="/goapp/samples/pros-cons.pdf" target="_blank">Pros and Cons</a></li>
</ul>
</div>
</div>
<!-- End Right Column -->
</div>
<!-- Add Bottom Boxes -->
<div class='holder-bottom-articles wixie-blog'>
<h2><div>Creative ways to use technology with students</div><div class="sponsor">Sponsored by Wixie</div></h2>
<!--<div class="contentBox wixie firstprojects" onclick="window.location='https://wixie.com/blog?id=5759&mtm_campaign=ce_bottom_boxes'">
<p>8 first projects to get students using technology</p>
</div>
<div class="contentBox wixie firstprojects" onclick="window.location='https://www.wixie.com/blog?id=5842&mtm_campaign=ce_bottom_boxes'">
<p>Five ideas for creative classroom centers</p>
</div>-->
<div class="contentBox wixie timelines" onclick="window.location='https://www.wixie.com/blog?id=5769&mtm_campaign=ce_bottom_boxes'">
<p>Creating timelines with Wixie's Mind Map tool</p>
</div>
<div class="contentBox wixie bookreviews" onclick="window.location='https://www.wixie.com/blog?id=5699&mtm_campaign=ce_bottom_boxes'">
<p>Creative, digital book reviews</p>
</div>
<div class="contentBox wixie talkies" onclick="window.location='https://wixie.com/blog?id=5758&mtm_campaign=ce_bottom_boxes'">
<p>Fun and powerful ideas with animated characters</p>
</div>
</div>
<div class='holder-bottom-articles'>
<h2>More from Creative Educator</h2>
<div class="contentBox">
<a href="/v08/articles/Reaching_and_Teaching_English_Language_Learners">
<img class="contentBox-Image" src="/v08/articles/images/article_ell_box.jpg" alt="Leearners">
</a>
<div class="contentBox-Topic-ELA"><a class="nav" href="/english-language-acquisition">English Language Acquisition</a></div>
<p class="contentBox-Text"><a class="contentBox-Text" href="/v08/articles/Reaching_and_Teaching_English_Language_Learners">Reaching and teaching English language learners</a></p>
</div><div class="contentBox">
<a href="/v07/lessons/Entice_Your_Reader">
<img class="contentBox-Image" src="/v07/lessons/images/lessons_entice_box.jpg" alt="Book trailers">
</a>
<div class="lessonTopic-LA"><a class="nav" href="/language-arts">Language Arts</a></div>
<p class="contentBox-Text"><a class="contentBox-Text" href="/v07/lessons/Entice_Your_Reader">Lesson: Book Trailers</a></p>
</div><div class="contentBox">
<a href="/v02/lessons/Create_a_Video_Poem">
<img class="contentBox-Image" src="/v02/lessons/images/lesson_videopoem_box.jpg" alt="Create a Visual Poem">
</a>
<div class="lessonTopic-LA"><a class="nav" href="/language-arts">Language Arts</a></div>
<p class="contentBox-Text"><a class="contentBox-Text" href="/v02/lessons/Create_a_Video_Poem">Lesson: Create a Visual Poem</a></p>
</div><div class="contentBox">
<a href="/v10/lessons/Animal_Riddles">
<img loading="lazy" class="contentBox-Image" src="/v10/lessons/images/animal_riddles_box.jpg" alt="Animal riddle" width="307px" height="160px"/>
</a>
<div class="lessonTopic-Science"><a class="nav" href="/science">Science</a></div>
<p class="contentBox-Text"><a class="contentBox-Text" href="/v10/lessons/Animal_Riddles">Lesson: Animal Riddles</a></p>
</div><div class="contentBox">
<a href="/v04/articles/PBL_Approach_to_PD">
<img class="contentBox-Image" src="/v04/articles/images/articles_pbpbd_box.jpg" alt="Professional Development">
</a>
<div class="contentBox-Topic-PBL"><a class="nav" href="/project-based-learning">Project-based Learning</a></div>
<p class="contentBox-Text"><a class="contentBox-Text" href="/v04/articles/PBL_Approach_to_PD">A project approach to professional development</a></p>
</div><div class="contentBox">
<a href="/v09/lessons/Not_Your_Average_Portfolio">
<img class="contentBox-Image" src="/v09/lessons/images/lesson_portfolio_box.jpg" alt="Not Your Average Portfolio">
</a>
<div class="lessonTopic-SS"><a class="nav" href="/social-studies">Social Studies</a></div>
<p class="contentBox-Text"><a class="contentBox-Text" href="/v09/lessons/Not_Your_Average_Portfolio">Lesson: Not Your Average Portfolio</a></p>
</div></div>
<!-- End Bottom Boxes -->
<!-- Begin Include Main CE Foooter -->
<div id="pageBottom">
<div class="boxBottom first">
<img src="/images/ce_logo_wide.svg" alt="Creative Educator" title="Creative Educator"/>
<p class="bottomBody"><a class="normal" href="/professional-learning?utm_campaign=ce_footer">Professional Learning</a></p>
<p class="bottomBody"><a class="normal" href="/about?utm_campaign=ce_footer">About Us</a></p>
<p class="bottomBody">
<a class="normal" href="https://twitter.com/CreativeEduc8r">
<img src="/images/ce_twitter_circle_gray_32.png" alt="Twitter Logo">
</a>
<a class="normal" href="https://instagram.com/CreativeEduc8r">
<img src="/images/ce_instagram_circle_gray_32.png" alt="Instagram Logo">
</a>
</p>
</div>
<div class="boxBottom">
<p class="bottomHeading">Topics</p>
<p class="bottomBody"><a class="normal" href="/creativity?utm_campaign=ce_footer">Creativity</a></p>
<p class="bottomBody"><a class="normal" href="/digital-storytelling?utm_campaign=ce_footer">Digital Storytelling</a></p>
<p class="bottomBody"><a class="normal" href="/21st-century-classrooms?utm_campaign=ce_footer">21st Century Classrooms</a></p>
<p class="bottomBody"><a class="normal" href="/project-based-learning?utm_campaign=ce_footer">Project-based Learning</a></p>
<p class="bottomBody"><a class="normal" href="/teaching?utm_campaign=ce_footer">Teaching and Learning</a></p>
</div>
<div class="boxBottom">
<p class="bottomHeading">Curriculum</p>
<p class="bottomBody"><a class="normal" href="/literacy?utm_campaign=ce_footer">Literacy</a></p>
<p class="bottomBody"><a class="normal" href="/literature?utm_campaign=ce_footer">Literature</a></p>
<p class="bottomBody"><a class="normal" href="/informational-text?utm_campaign=ce_footer">Informational Text</a></p>
<p class="bottomBody"><a class="normal" href="/english-language-acquisition?utm_campaign=ce_footer">English Language Aquisition</a></p>
<p class="bottomBody"><a class="normal" href="/stem?utm_campaign=ce_footer">STEM</a></p>
</div>
<div class="boxBottom">
<p class="bottomHeading">Lessons</p>
<p class="bottomBody"><a class="normal" href="/language-arts?utm_campaign=ce_footer">Language Arts</a></p>
<p class="bottomBody"><a class="normal" href="/math?utm_campaign=ce_footer">Math</a></p>
<p class="bottomBody"><a class="normal" href="/science?utm_campaign=ce_footer">Science</a></p>
<p class="bottomBody"><a class="normal" href="/social-studies?utm_campaign=ce_footer">Social Studies</a></p>
<p class="bottomBody"><a class="normal" href="/visual-arts?utm_campaign=ce_footer">Visual Arts</a></p>
</div>
</div>
<div class="footerScreen">
<p class="footer">© 2025 <a class="footer" href="https://www.tech4learning.com">Tech4Learning, Inc</a> | All Rights Reserved | <a class="footer" href="/privacy">Privacy Policy</a></p>
</div>
<div class="footerPrint">
<p class="footer">© 2025 Tech4Learning, Inc | All Rights Reserved | https://www.thecreativeeducator.com</p>
</div>
<div id="ce-list-signup" class="signup-form-holder hide">
<div class="signup-form">
<button id="signup-cancel-button" class="closeDialogButton">X</button>
<div id="form" class="form">
<p>Add me to the Creative Educator email list!</p>
<form name="frmRequestPD" action="" method="post" id="pdForm">
<script>
function __ValidateForm()
{
// do this when when changing the dropdown value and submitting
// as an extra precaution in case some weird action happens
let
obj_form = document.frmRequestPD,
emailaddress = obj_form.from.value,
badregex = /\b(?:xyz|asd|mail4u|mail5u)\b/gi,
validRegex = /^[a-zA-Z0-9.!#$%&'*+/=?^_`{|}~-]+@[a-zA-Z0-9-]+(?:\.[a-zA-Z0-9-]+)*$/,
bot;
bot = emailaddress.match(badregex);
if ( bot ) {
return;
} else if (
obj_form.First_Name.value == ""
||
obj_form.Last_Name.value == ""
||
obj_form.from.value == ""
)
// any required fields are missing?
{
var str_alert = "The following errors have occurred:\n";
if ( obj_form.First_Name.value == "" ) { str_alert += " - \"First Name\" must have a value\n"; }
if ( obj_form.Last_Name.value == "" ) { str_alert += " - \"Last Name\" must have a value\n"; }
if ( obj_form.from.value == "" ) { str_alert += " - \"Email\" must have a value\n"; }
alert( str_alert );
}
// if email is valid, submit form
else if (obj_form.from.value.match(validRegex)) {
obj_form.action = "https://www.tech4learning.com/other/genericformdb";
obj_form.submit();
gtag('event', 'conversion', {'send_to': 'AW-1067247009/Hm94CNrLiK0DEKHL8_wD'});
}
// if email is invalid, close the dialog
else {
document.getElementById("ce-list-signup").classList.add("hide");
}
// all fields are good, submit the form
}
</script>
<div class="hide">
<input type="hidden" name="Product" value="Creative Educator">
<input type="hidden" name="to" value="mkolk@tech4learning.com">
<input type="hidden" name="campaignId" value="16">
<input type="hidden" name="subject" value="List Signup - Creative Educator">
<input type="hidden" name="url" value="//creativeeducator.tech4learning.com/goapp/graphic-organizer-maker">
</div>
<div class="page-row fields">
<label class="fieldName">First Name</label>
<input type="text" name="First_Name" value="" class="anyFormField">
</div>
<div class="page-row fields">
<label class="fieldName">Last Name</label>
<input type="text" name="Last_Name" value="" class="anyFormField">
</div>
<div class="page-row fields">
<label class="fieldName">Email</label>
<input type="text" name="from" value="" class="anyFormField">
</div>
<div class="page-row fields">
<label></label>
<input type="button" value="Submit" class="submitButton" onClick="__ValidateForm();">
</div>
</form>
</div>
</div>
</div>
<!-- End Include Main CE Foooter -->
<!-- Begin Include of Analytics Code -->
<!-- Matomo -->
<script>
var _paq = window._paq = window._paq || [];
/* tracker methods like "setCustomDimension" should be called before "trackPageView" */
_paq.push(['trackPageView']);
_paq.push(['enableLinkTracking']);
(function() {
var u="https://analytics.tech4learning.com/";
_paq.push(['setTrackerUrl', u+'matomo.php']);
_paq.push(['setSiteId', '3']);
var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
g.async=true; g.src=u+'matomo.js'; s.parentNode.insertBefore(g,s);
})();
</script>
<!-- End Matomo Code -->
<!-- End of Include Analytics -->
</body>
</html>