Changes for page Embedding Forms in Web Pages
Last modified by Admin on 2020/01/03 13:53
Summary
-
Page properties (3 modified, 0 added, 0 removed)
-
Attachments (0 modified, 5 added, 0 removed)
-
Objects (1 modified, 0 added, 0 removed)
Details
- Page properties
-
- Parent
-
... ... @@ -1,0 +1,1 @@ 1 +System Setup Detail and Technical Information - Author
-
... ... @@ -1,1 +1,1 @@ 1 -XWiki.m elanie@one-count_com1 +XWiki.Admin - Content
-
... ... @@ -1,7 +1,10 @@ 1 +{{layout}} 2 +{{layout-section ac:type="two_right_sidebar"}} 3 +{{layout-cell}} 1 1 2 2 3 3 {{id name="Start ScreenSteps Content"/}} 4 - 7 +(% style="color: rgb(128,128,128);" %)//By default, when a ONEcount form is called it will display on its own landing page or as a pop-up. If, however, you want to embed a short form on a web page containing other content, e.g. display a newsletter sign-up form on your home page and/or article pages, you can include some javascript with an option object to do so.// 5 5 6 6 (% style="color: rgb(128,128,128);" %)//This lesson provides direction on the steps to embed a form on a web page.// 7 7 ... ... @@ -10,7 +10,7 @@ 10 10 The id name can be whatever you choose, e.g. “oc-form” as in the example below. 11 11 12 12 In ONEcount, the height and width is set to 100% , so the height and width defined in the div will be the actual size of the form. 13 - 16 +In the example below, the height and width will be 1500px. 14 14 15 15 (% style="color: rgb(0,128,128);" %)** <div**(% style="color: rgb(127,0,127);" %)** id**(% style="color: rgb(44,44,44);" %)**=**(% style="color: rgb(0,0,255);" %)**//"oc-form"//**(% style="color: rgb(127,0,127);" %)** style**(% style="color: rgb(44,44,44);" %)**="**(% style="color: rgb(127,0,127);" %)**width//: //**(% style="color: rgb(127, 0, 127); color: rgb(0, 0, 255)" %)**//1500px//**(% style="color: rgb(44,44,44);" %)**;**(% style="color: rgb(128,0,128);" %)**height//~://**(% style="color: rgb(0,0,255);" %)**//1500px//**(% style="color: rgb(51,153,102);" %)**></div>**(% style="color: rgb(63,127,127);" %)** ** 16 16 ... ... @@ -19,12 +19,11 @@ 19 19 **Include the script** – example shown below – **after the div.** Options are defined below the example. 20 20 21 21 **Example:** 22 - 23 -(% style="color: rgb(0, 128, 128); color: rgb(0, 0, 0)" %) (% style="color: rgb(0, 128, 128); color: rgb(0, 0, 0); color: rgb(128, 0, 128)" %)var(% style="color: rgb(0, 128, 128); color: rgb(0, 0, 0)" %) option ={'(% style="color: rgb(0, 128, 128); color: rgb(0, 0, 0); color: rgb(128, 0, 128); color: rgb(0, 0, 255)" %)containerid(% style="color: rgb(0, 128, 128); color: rgb(0, 0, 0)" %)' : 'oc-form','(% style="color: rgb(0, 128, 128); color: rgb(0, 0, 0); color: rgb(128, 0, 128); color: rgb(0, 0, 255); color: rgb(0, 0, 255)" %)domain(% style="color: rgb(0, 128, 128); color: rgb(0, 0, 0)" %)' : '[[(% style="color: rgb(0, 128, 128); color: rgb(0, 0, 0); color: rgb(128, 0, 128); color: rgb(0, 0, 255); color: rgb(0, 0, 255); color: rgb(0, 0, 0)" %) sonish.onecount.net>>url:http://sonish.onecount.net||shape="rect"]](%%)','type' : 'form', '(% style="color: rgb(0, 128, 128); color: rgb(0, 0, 0); color: rgb(128, 0, 128); color: rgb(0, 0, 255); color: rgb(0, 0, 255); color: rgb(0, 0, 0); color: rgb(0, 0, 255)" %)formid(% style="color: rgb(0, 128, 128); color: rgb(0, 0, 0)" %)' : 777}(% style="color: rgb(0,128,128);" %)24 -(% style="color: rgb(0, 128, 128); color: rgb(0, 0, 0)" %) GCN. 25 +(% style="color: rgb(0,128,128);" %)<script> 26 +(% style="color: rgb(0, 128, 128); color: rgb(0, 0, 0)" %) (% style="color: rgb(0, 128, 128); color: rgb(0, 0, 0); color: rgb(128, 0, 128)" %)var(% style="color: rgb(0, 128, 128); color: rgb(0, 0, 0)" %) option ={'(% style="color: rgb(0, 128, 128); color: rgb(0, 0, 0); color: rgb(128, 0, 128); color: rgb(0, 0, 255)" %)containerid(% style="color: rgb(0, 128, 128); color: rgb(0, 0, 0)" %)' : 'oc-form','(% style="color: rgb(0, 128, 128); color: rgb(0, 0, 0); color: rgb(128, 0, 128); color: rgb(0, 0, 255); color: rgb(0, 0, 255)" %)domain(% style="color: rgb(0, 128, 128); color: rgb(0, 0, 0)" %)' : 'xxx-reg[[(% style="color: rgb(0, 128, 128); color: rgb(0, 0, 0); color: rgb(128, 0, 128); color: rgb(0, 0, 255); color: rgb(0, 0, 255); color: rgb(0, 0, 0)" %).onecount.net>>url:http://sonish.onecount.net||shape="rect"]](%%)','type' : 'form', '(% style="color: rgb(0, 128, 128); color: rgb(0, 0, 0); color: rgb(128, 0, 128); color: rgb(0, 0, 255); color: rgb(0, 0, 255); color: rgb(0, 0, 0); color: rgb(0, 0, 255)" %)formid(% style="color: rgb(0, 128, 128); color: rgb(0, 0, 0)" %)' : 777}(% style="color: rgb(0,128,128);" %) 27 +(% style="color: rgb(0, 128, 128); color: rgb(0, 0, 0)" %) GCN.onecount.form.embed(option);(% style="color: rgb(0,128,128);" %) 25 25 </script>(%%) 26 - 27 -\\(% style="text-decoration: underline;" %)Options(%%): 29 +\\\\(% style="text-decoration: underline;" %)Options(%%): 28 28 29 29 **containerId :** This is a required option that must be included. It is the id of the div, created in Step 2 above, where the form will be embedded. 30 30 ... ... @@ -40,9 +40,9 @@ 40 40 41 41 (% style="color: rgb(0,128,128);" %)**<**(% style="color: rgb(63,127,127);" %) script(% style="color: rgb(0,128,128);" %)> 42 42 43 -(% style="color: rgb(0,128,128);" %) (% style="color: rgb(128,0,128);" %)var(%%) option ={'(% style="color: rgb(0,0,255);" %)containerid'(%%) : 'oc-form','(% style="color: rgb(0,0,255);" %)domain'(%%) : '[[ sonish.onecount.net>>url:http://sonish.onecount.net||shape="rect"]]','(% style="color: rgb(0,0,255);" %)type(%%)' : 'form', 'formid' : 777} ; GCN. onecount.form.embed(option);45 +(% style="color: rgb(0,128,128);" %) (% style="color: rgb(128,0,128);" %)var(%%) option ={'(% style="color: rgb(0,0,255);" %)containerid'(%%) : 'oc-form','(% style="color: rgb(0,0,255);" %)domain'(%%) : 'xxx-reg[[.onecount.net>>url:http://sonish.onecount.net||shape="rect"]]','(% style="color: rgb(0,0,255);" %)type(%%)' : 'form', 'formid' : 777} ; GCN. onecount.form.embed(option); 44 44 (% style="color: rgb(51,153,102);" %)</script>(%%) 45 - 47 +(% style="color: rgb(127,0,85);" %) 46 46 47 47 (% style="text-decoration: underline; color: rgb(0, 64, 128); text-decoration: underline" %)**Standard ONEcount Form** 48 48 ... ... @@ -57,9 +57,9 @@ 57 57 (% style="color: rgb(0,0,0);" %)**Example of script to embed standard ONEcount form #777 created under sonish.onecount.net domain:** 58 58 59 59 (% style="color: rgb(0,128,128);" %)**<**(% style="color: rgb(63,127,127);" %) script(% style="color: rgb(0,128,128);" %)> (% style="color: rgb(128,0,128);" %) 60 -var(%%) option ={'(% style="color: rgb(0,0,255);" %)containerid'(%%) : 'oc-form','(% style="color: rgb(0,0,255);" %)domain'(%%) : '[[ sonish.onecount.net>>url:http://sonish.onecount.net||shape="rect"]]','(% style="color: rgb(0,0,255);" %)type(%%)' : 'form', 'formid' : 777} ; GCN. onecount.form.embed(option);62 +var(%%) option ={'(% style="color: rgb(0,0,255);" %)containerid'(%%) : 'oc-form','(% style="color: rgb(0,0,255);" %)domain'(%%) : 'xxx-reg[[.onecount.net>>url:http://sonish.onecount.net||shape="rect"]]','(% style="color: rgb(0,0,255);" %)type(%%)' : 'form', 'formid' : 777} ; GCN. onecount.form.embed(option); 61 61 (% style="color: rgb(51,153,102);" %)</script>(%%) 62 - 64 +(% style="color: rgb(0,128,128);" %) 63 63 64 64 (% style="text-decoration: underline; color: rgb(0, 64, 128); text-decoration: underline" %)**Lookup/Login Form** 65 65 ... ... @@ -69,18 +69,20 @@ 69 69 70 70 **type: loginlogout** – This choice will embed the lookup/login form for the client of the domain passed. 71 71 74 +**return: 'a url'** – This is where the user will be redirected to after form submission. 75 + 72 72 **formid not required.** 73 73 74 74 (% style="color: rgb(0,0,0);" %)**Example of script to embed a ONEcount Lookup/Login form created under sonish.onecount.net domain:**(%%) 75 - 76 -var(% style="color: rgb(0,128,128);" %) (% style="color: rgb(0, 128, 128); color: rgb(0, 0, 0)" %)option =(% style="color: rgb(0, 128, 128); color: rgb(0, 0, 0); color: rgb(0, 0, 255)" %){(% style="color: rgb(0, 128, 128); color: rgb(0, 0, 255)" %)'containerid(% style="color: rgb(0,128,128);" %)' (% style="color: rgb(0, 128, 128); color: rgb(0, 0, 0)" %): 'oc-form','(% style="color: rgb(0, 128, 128); color: rgb(0, 0, 255)" %)domain'(% style="color: rgb(0,128,128);" %) (% style="color: rgb(0, 128, 128); color: rgb(0, 0, 0)" %): '[[(% style="color: rgb(0, 128, 128); color: rgb(0, 0, 0); color: rgb(0, 0, 0)" %) sonish.onecount.net>>url:http://sonish.onecount.net||shape="rect"]](%%)',(% style="color: rgb(0,128,128);" %)'(% style="color: rgb(0, 128, 128); color: rgb(0, 0, 255)" %)type(% style="color: rgb(0,128,128);" %)'(% style="color: rgb(0, 128, 128); color: rgb(0, 0, 0)" %) (%%): 'loginlogout'}77 -GCN.e mbed.form(option);79 +(% style="color: rgb(0,128,128);" %)**<**(% style="color: rgb(0, 128, 128); color: rgb(0, 128, 128)" %)** **(% style="color: rgb(0, 128, 128); color: rgb(63, 127, 127)" %) script(% style="color: rgb(0, 128, 128); color: rgb(0, 128, 128)" %)> (% style="color: rgb(0, 128, 128); color: rgb(128, 0, 128)" %) 80 +var(% style="color: rgb(0,128,128);" %) (% style="color: rgb(0, 128, 128); color: rgb(0, 0, 0)" %)option =(% style="color: rgb(0, 128, 128); color: rgb(0, 0, 0); color: rgb(0, 0, 255)" %){(% style="color: rgb(0, 128, 128); color: rgb(0, 0, 255)" %)'containerid(% style="color: rgb(0,128,128);" %)' (% style="color: rgb(0, 128, 128); color: rgb(0, 0, 0)" %): 'oc-form','(% style="color: rgb(0, 128, 128); color: rgb(0, 0, 255)" %)domain'(% style="color: rgb(0,128,128);" %) (% style="color: rgb(0, 128, 128); color: rgb(0, 0, 0)" %): 'xxx-reg[[(% style="color: rgb(0, 128, 128); color: rgb(0, 0, 0); color: rgb(0, 0, 0)" %).onecount.net>>url:http://sonish.onecount.net||shape="rect"]](%%)',(% style="color: rgb(0,128,128);" %)'(% style="color: rgb(0, 128, 128); color: rgb(0, 0, 255)" %)type(% style="color: rgb(0,128,128);" %)'(% style="color: rgb(0, 128, 128); color: rgb(0, 0, 0)" %) (%%): 'loginlogout'; '(% style="color: rgb(0,0,255);" %)return(%%)':'(% style="color: rgb(0,0,0);" %)[[(% style="color: rgb(0, 0, 0); color: rgb(0, 0, 0)" %)https:~~/~~/www.one-count.com>>url:http://www.onecount.com||shape="rect"]](%%)'} 81 +GCN.(% style="color: rgb(0, 128, 128); color: rgb(0, 0, 0)" %)onecount.form.embed(%%)(option); 78 78 (% style="color: rgb(51,153,102);" %)</script> 79 79 80 80 (% style="color: rgb(0, 128, 128); color: rgb(51, 153, 102)" %) 81 81 82 82 Note: 83 - 87 +You must create a lookup form in Manage Forms and set that form as the lookup form under Config Manager > Mappings > Lookup Form ID in the Config Manager. 84 84 85 85 (% style="text-decoration: underline; color: rgb(0, 64, 128); text-decoration: underline" %)**Lookup Form** 86 86 ... ... @@ -93,7 +93,7 @@ 93 93 **type: lookup** – This choice will embed the subscriber lookup form for the client of the domain passed. 94 94 95 95 **formid – optional, not required.** 96 - 100 +If the form id is provided in this script, that form will be displayed; if not provided in this script, the system will display the lookup form identified in the Config Manager. 97 97 98 98 (% style="color: rgb(0,0,0);" %)**Example of script to embed ONEcount lookup form #45 ceated under sonish.onecount.net domain:** 99 99 ... ... @@ -100,7 +100,7 @@ 100 100 (% style="color: rgb(0,0,0);" %)**With Form ID:** 101 101 (% style="color: rgb(0, 0, 0); color: rgb(51, 153, 102)" %)<script>(% style="color: rgb(0,0,0);" %) 102 102 (% style="color: rgb(0, 0, 0); color: rgb(128, 0, 128)" %) var(% style="color: rgb(0,0,0);" %) option ={(% style="color: rgb(0, 0, 0); color: rgb(0, 0, 255)" %)'containerId'(% style="color: rgb(0,0,0);" %) : 'oc-form',(% style="color: rgb(0, 0, 0); color: rgb(0, 0, 255)" %)'domain'(% style="color: rgb(0,0,0);" %) : '[[sonish.onecount.net>>url:http://sonish.onecount.net||shape="rect"]]',(% style="color: rgb(0, 0, 0); color: rgb(0, 0, 255)" %)'type'(% style="color: rgb(0,0,0);" %) : 'lookup',(% style="color: rgb(0, 0, 0); color: rgb(0, 0, 255)" %)'formid'(% style="color: rgb(0,0,0);" %) : 45} 103 - GCN.e mbed.form(option);107 + GCN.(% style="color: rgb(0, 0, 0); color: rgb(0, 128, 128); color: rgb(0, 0, 0)" %)onecount.form.embed(% style="color: rgb(0,0,0);" %)(option); 104 104 (% style="color: rgb(0, 0, 0); color: rgb(51, 153, 102)" %) </script>(% style="color: rgb(0,0,0);" %) 105 105 106 106 OR ... ... @@ -108,13 +108,13 @@ 108 108 **Without Form ID:** 109 109 (% style="color: rgb(0, 0, 0); color: rgb(51, 153, 102)" %)<script>(% style="color: rgb(0,0,0);" %) 110 110 (% style="color: rgb(0, 0, 0); color: rgb(128, 0, 128)" %)var(% style="color: rgb(0,0,0);" %) option ={(% style="color: rgb(0, 0, 0); color: rgb(0, 0, 255)" %)'containerId'(% style="color: rgb(0,0,0);" %) : 'oc-form'(% style="color: rgb(0, 0, 0); color: rgb(0, 0, 255)" %),'domain'(% style="color: rgb(0,0,0);" %) : '[[sonish.onecount.net>>url:http://sonish.onecount.net||shape="rect"]]',(% style="color: rgb(0, 0, 0); color: rgb(0, 0, 255)" %)'type'(% style="color: rgb(0,0,0);" %) : 'lookup'} 111 - GCN.e mbed.form(option);115 + GCN.(% style="color: rgb(0, 0, 0); color: rgb(0, 128, 128); color: rgb(0, 0, 0)" %)onecount.form.embed(% style="color: rgb(0,0,0);" %)(option); 112 112 (% style="color: rgb(0, 0, 0); color: rgb(51, 153, 102)" %) </script> 113 113 114 114 Note: 115 - 119 +You must create a lookup form in Manage Forms and set that form as the lookup form under Config Manager > Mappings > Lookup Form ID in the Config Manager. 116 116 117 -=== Tostyleanembedded form:===121 +=== 3. Style the embedded form (optional) === 118 118 119 119 [[image:attach:media_1478726466081.png||align="center"]] 120 120 ... ... @@ -129,3 +129,52 @@ 129 129 130 130 131 131 {{id name="End ScreenSteps Content"/}} 136 +{{/layout-cell}} 137 + 138 +{{layout-cell}} 139 +{{panel borderStyle="solid" title="Search all Documentation:"}} 140 + 141 + 142 +{{livesearch/}} 143 +{{/panel}} 144 + 145 +{{panel borderStyle="solid" title=" Search System and Setup Information:"}} 146 + 147 + 148 +{{pagetreesearch rootPage="System and Setup Information"/}} 149 +{{/panel}} 150 + 151 +{{panel borderStyle="solid" title="More System and Setup Information"}} 152 +{{expand}} 153 +[[ONEcount Cookies>>url:http://bos-jira01-cl01.onecount.net:8090/pages/viewpage.action?pageId=65727||shape="rect"]] 154 +\\[[Widget Implementation>>url:http://bos-jira01-cl01.onecount.net:8090/pages/viewpage.action?pageId=65622||shape="rect"]] 155 +\\[[Widget Builder>>url:http://bos-jira01-cl01.onecount.net:8090/pages/viewpage.action?pageId=65735||shape="rect"]] 156 +\\[[doc:ONEcount Javascript Widgets]][[ 157 +\\ONEcount Javascript Widget Changes>>url:http://bos-jira01-cl01.onecount.net:8090/pages/viewpage.action?pageId=65751||shape="rect"]][[ 158 +\\>>url:http://bos-jira01-cl01.onecount.net:8090/pages/viewpage.action?pageId=65735||shape="rect"]][[Configuration Manager>>url:http://bos-jira01-cl01.onecount.net:8090/pages/viewpage.action?pageId=65754||shape="rect"]][[ 159 +\\>>url:http://bos-jira01-cl01.onecount.net:8090/pages/viewpage.action?pageId=65735||shape="rect"]][[Smartlinks, Brand Codes, and Other Form Linkouts>>url:http://bos-jira01-cl01.onecount.net:8090/pages/viewpage.action?pageId=65829||shape="rect"]][[ 160 +>>url:http://bos-jira01-cl01.onecount.net:8090/pages/viewpage.action?pageId=65735||shape="rect"]][[ 161 +ONEcount SSL and non-SSL Client Brand Pages>>url:http://bos-jira01-cl01.onecount.net:8090/display/OD/ONEcount+SSL+and+non-SSL+Client+Brand+Pages||shape="rect"]][[ 162 +\\>>url:http://bos-jira01-cl01.onecount.net:8090/pages/viewpage.action?pageId=65735||shape="rect"]][[OpenX Zone Setup for Banner Tracking and Viewability>>url:http://bos-jira01-cl01.onecount.net:8090/display/OD/OpenX+Zone+Setup+for+Banner+Tracking+and+Viewability||shape="rect"]][[ 163 +\\>>url:http://bos-jira01-cl01.onecount.net:8090/pages/viewpage.action?pageId=65735||shape="rect"]][[DFP Small Business – Create Key/Value Pair for Ad Targeting>>url:http://bos-jira01-cl01.onecount.net:8090/pages/viewpage.action?pageId=65873||shape="rect"]][[ 164 +\\>>url:http://bos-jira01-cl01.onecount.net:8090/pages/viewpage.action?pageId=65735||shape="rect"]][[DFP Premium – Create Key/Value Pair for Ad Targeting>>url:http://bos-jira01-cl01.onecount.net:8090/pages/viewpage.action?pageId=65879||shape="rect"]][[ 165 +\\>>url:http://bos-jira01-cl01.onecount.net:8090/pages/viewpage.action?pageId=65735||shape="rect"]][[Progressive Lookup>>url:http://bos-jira01-cl01.onecount.net:8090/display/OD/Progressive+Lookup||shape="rect"]][[ 166 +\\>>url:http://bos-jira01-cl01.onecount.net:8090/pages/viewpage.action?pageId=65735||shape="rect"]][[Embedding Forms in Web Pages>>url:http://bos-jira01-cl01.onecount.net:8090/display/OD/Embedding+Forms+in+Web+Pages||shape="rect"]][[ 167 +\\>>url:http://bos-jira01-cl01.onecount.net:8090/pages/viewpage.action?pageId=65735||shape="rect"]][[Overriding Lookup/Login Page Settings>>url:http://bos-jira01-cl01.onecount.net:8090/pages/viewpage.action?pageId=65896||shape="rect"]][[ 168 +>>url:http://bos-jira01-cl01.onecount.net:8090/pages/viewpage.action?pageId=65735||shape="rect"]][[ 169 +Email Engine and Sender Score>>url:http://bos-jira01-cl01.onecount.net:8090/display/OD/Email+Engine+and+Sender+Score||shape="rect"]][[ 170 +\\>>url:http://bos-jira01-cl01.onecount.net:8090/pages/viewpage.action?pageId=65735||shape="rect"]][[Global Features>>url:http://bos-jira01-cl01.onecount.net:8090/pages/viewpage.action?pageId=65905||shape="rect"]][[ 171 +>>url:http://bos-jira01-cl01.onecount.net:8090/pages/viewpage.action?pageId=65735||shape="rect"]][[ 172 +>>url:http://bos-jira01-cl01.onecount.net:8090/pages/viewpage.action?pageId=65751||shape="rect"]][[ 173 +>>url:http://bos-jira01-cl01.onecount.net:8090/pages/viewpage.action?pageId=65751||shape="rect"]] 174 +{{/expand}} 175 +{{/panel}} 176 + 177 +\\ 178 + 179 +\\ 180 + 181 +\\ 182 +{{/layout-cell}} 183 +{{/layout-section}} 184 +{{/layout}}
- media_1476291374169.png
-
- Author
-
... ... @@ -1,0 +1,1 @@ 1 +XWiki.XWikiGuest - Size
-
... ... @@ -1,0 +1,1 @@ 1 +13.0 KB - Content
- media_1476291758554.png
-
- Author
-
... ... @@ -1,0 +1,1 @@ 1 +XWiki.XWikiGuest - Size
-
... ... @@ -1,0 +1,1 @@ 1 +13.5 KB - Content
- media_1476291817160.png
-
- Author
-
... ... @@ -1,0 +1,1 @@ 1 +XWiki.XWikiGuest - Size
-
... ... @@ -1,0 +1,1 @@ 1 +9.8 KB - Content
- media_1478726466081.png
-
- Author
-
... ... @@ -1,0 +1,1 @@ 1 +XWiki.XWikiGuest - Size
-
... ... @@ -1,0 +1,1 @@ 1 +44.3 KB - Content
- media_1478726631145.png
-
- Author
-
... ... @@ -1,0 +1,1 @@ 1 +XWiki.XWikiGuest - Size
-
... ... @@ -1,0 +1,1 @@ 1 +14.9 KB - Content
- Confluence.Code.ConfluencePageClass[0]
-
- id
-
... ... @@ -1,1 +1,1 @@ 1 -659 511 +65924 - url
-
... ... @@ -1,1 +1,1 @@ 1 -https://info.onecount.net//wiki/spaces/OD/pages/659 51/Embedding Forms in Web Pages1 +https://info.onecount.net//wiki/spaces/OD/pages/65924/Embedding Forms in Web Pages