Skip to Content
Last modified by Admin on 2025/06/27 12:14
From version 15.1
edited by steven@one-count_com
on 2018/07/17 17:35
Change comment: There is no comment for this version
To version 17.1
edited by Admin
on 2025/06/27 12:14
Change comment: Migrated property [stableId] from class [Confluence.Code.ConfluencePageClass]

Summary

Details

Page properties
Parent
... ... @@ -1,0 +1,1 @@
1 +System Setup Detail and Technical Information
Author
... ... @@ -1,1 +1,1 @@
1 -XWiki.steven@one-count_com
1 +XWiki.Admin
Content
... ... @@ -4,7 +4,7 @@
4 4  
5 5  
6 6  {{id name="Start ScreenSteps Content"/}}
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.//
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.//
8 8  
9 9  (% style="color: rgb(128,128,128);" %)//This lesson provides direction on the steps to embed a form on a web page.//
10 10  
... ... @@ -13,7 +13,7 @@
13 13  The id name can be whatever you choose, e.g. “oc-form” as in the example below.
14 14  
15 15  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.
16 - In the example below, the height and width will be 1500px.
16 +In the example below, the height and width will be 1500px.
17 17  
18 18  (% 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);" %)** **
19 19  
... ... @@ -22,12 +22,11 @@
22 22  **Include the script** – example shown below – **after the div.** Options are defined below the example.
23 23  
24 24  **Example:**
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)" %)' : '[[(% 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);" %)
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 27  (% style="color: rgb(0, 128, 128); color: rgb(0, 0, 0)" %) GCN.onecount.form.embed(option);(% style="color: rgb(0,128,128);" %)
28 28   </script>(%%)
29 -
30 -\\(% style="text-decoration: underline;" %)Options(%%):
29 +\\\\(% style="text-decoration: underline;" %)Options(%%):
31 31  
32 32  **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.
33 33  
... ... @@ -43,9 +43,9 @@
43 43  
44 44  (% style="color: rgb(0,128,128);" %)**<**(% style="color: rgb(63,127,127);" %) script(% style="color: rgb(0,128,128);" %)>
45 45  
46 -(% 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);
47 47  (% style="color: rgb(51,153,102);" %)</script>(%%)
48 - (% style="color: rgb(127,0,85);" %)
47 +(% style="color: rgb(127,0,85);" %)
49 49  
50 50  (% style="text-decoration: underline; color: rgb(0, 64, 128); text-decoration: underline" %)**Standard ONEcount Form**
51 51  
... ... @@ -60,9 +60,9 @@
60 60  (% style="color: rgb(0,0,0);" %)**Example of script to embed standard ONEcount form #777 created under sonish.onecount.net domain:**
61 61  
62 62  (% 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);" %)
63 -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);
64 64  (% style="color: rgb(51,153,102);" %)</script>(%%)
65 - (% style="color: rgb(0,128,128);" %)
64 +(% style="color: rgb(0,128,128);" %)
66 66  
67 67  (% style="text-decoration: underline; color: rgb(0, 64, 128); text-decoration: underline" %)**Lookup/Login Form**
68 68  
... ... @@ -77,8 +77,8 @@
77 77  **formid not required.**
78 78  
79 79  (% style="color: rgb(0,0,0);" %)**Example of script to embed a ONEcount Lookup/Login form created under sonish.onecount.net domain:**(%%)
80 - (% 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)" %)
81 -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'; '(% 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.onecount.com>>url:http://www.onecount.com||shape="rect"]](%%)'}
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"]](%%)'}
82 82  GCN.(% style="color: rgb(0, 128, 128); color: rgb(0, 0, 0)" %)onecount.form.embed(%%)(option);
83 83  (% style="color: rgb(51,153,102);" %)</script>
84 84  
... ... @@ -85,7 +85,7 @@
85 85  (% style="color: rgb(0, 128, 128); color: rgb(51, 153, 102)" %)
86 86  
87 87  Note:
88 - 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.
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.
89 89  
90 90  (% style="text-decoration: underline; color: rgb(0, 64, 128); text-decoration: underline" %)**Lookup Form**
91 91  
... ... @@ -98,7 +98,7 @@
98 98  **type: lookup** – This choice will embed the subscriber lookup form for the client of the domain passed.
99 99  
100 100  **formid – optional, not required.**
101 - 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.
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.
102 102  
103 103  (% style="color: rgb(0,0,0);" %)**Example of script to embed ONEcount lookup form #45 ceated under sonish.onecount.net domain:**
104 104  
... ... @@ -117,7 +117,7 @@
117 117   (% style="color: rgb(0, 0, 0); color: rgb(51, 153, 102)" %) </script>
118 118  
119 119  Note:
120 - 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.
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.
121 121  
122 122  === 3.  Style the embedded form (optional) ===
123 123  
... ... @@ -175,11 +175,11 @@
175 175  {{/expand}}
176 176  {{/panel}}
177 177  
178 -
177 +\\
179 179  
180 -
179 +\\
181 181  
182 -
181 +\\
183 183  {{/layout-cell}}
184 184  {{/layout-section}}
185 185  {{/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 -23331667
1 +65924
url
... ... @@ -1,1 +1,1 @@
1 -https://info.onecount.net//wiki/spaces/OD/pages/23331667/Embedding Forms in Web Pages
1 +https://info.onecount.net//wiki/spaces/OD/pages/65924/Embedding Forms in Web Pages