Changes for page Form Builder

Last modified by Sachin Patil on 2024/08/30 07:28

From version 21.7
edited by Sachin Patil
on 2024/08/30 05:46
Change comment: There is no comment for this version
To version 21.10
edited by Sachin Patil
on 2024/08/30 06:14
Change comment: There is no comment for this version

Summary

Details

Page properties
Content
... ... @@ -45,20 +45,20 @@
45 45  * **Slide Positon:** This describes what part of the screen the pop-up will appear from (ie., enter stage-left)
46 46  * **Pop-Up Delay:** This allows you to program a slight delay into the pop-up so that it doesn't appear immediately on the screen.
47 47  * **Pop-up Definition :**
48 -** (% style="font-family:Liberation Sans,sans-serif; font-size:10pt; line-height:100%" %)**Pop-up Shadow : **This will add the shadow to the pop-up box .
49 -** (% style="font-family:Liberation Sans,sans-serif; font-size:10pt; line-height:100%" %)**Pop-up Radius : **This will change the shape of your pop-up and we can make pop-up round or ellipse.
50 -** (% style="color:#333333; font-family:Liberation Sans,sans-serif; font-size:10pt; font-style:normal; font-variant:normal; line-height:100%" %)**Pop-up border width & Pop-up border Color : **This will add the extra border width to the popup also you can change the width color.
48 +** (% style="font-family:Liberation Sans,sans-serif; font-size:10pt; line-height:100%" %)**Pop-up Shadow : **This will add the shadow to the pop-up box . [[image:1725015808108-336.png||height="78" width="148"]][[image:1725015836339-358.png||height="84" width="226"]]
49 +** (% style="font-family:Liberation Sans,sans-serif; font-size:10pt; line-height:100%" %)**Pop-up Radius : **This will change the shape of your pop-up and we can make pop-up round or ellipse. [[image:1725015904419-419.png||height="130" width="121"]][[image:1725015940232-868.png||height="131" width="127"]]
50 +** (% style="color:#333333; font-family:Liberation Sans,sans-serif; font-size:10pt; font-style:normal; font-variant:normal; line-height:100%" %)**Pop-up border width & Pop-up border Color : **This will add the extra border width to the popup also you can change the width color. [[image:1725016042172-661.png||height="128" width="121"]][[image:1725016078700-211.png||height="125" width="108"]]
51 51  * (((
52 52  **Pop-up Close Button Definition :***
53 53  
54 54  (((
55 55  (% class="western" style="text-align:left" %)
56 -(% style="color:#333333; font-family:Liberation Sans,sans-serif; font-size:10pt; font-style:normal; font-variant:normal; line-height:100%" %)**Close Button Color & Close Button Text Color: **This will change the close button color also the text used in the close button .
56 +(% style="color:#333333; font-family:Liberation Sans,sans-serif; font-size:10pt; font-style:normal; font-variant:normal; line-height:100%" %)**Close Button Color & Close Button Text Color: **This will change the close button color also the text used in the close button . [[image:1725016368615-308.png||height="59" width="68"]][[image:1725016404637-413.png||height="55" width="67"]]
57 57  )))
58 58  
59 59  * (((
60 60  (% class="western" style="text-align:left" %)
61 -(% style="color:#333333; font-family:Liberation Sans,sans-serif; font-size:10pt; font-style:normal; font-variant:normal; line-height:100%" %)**Close Button Text : ** This can change the text of close button like X, close , end whatever you want.
61 +(% style="color:#333333; font-family:Liberation Sans,sans-serif; font-size:10pt; font-style:normal; font-variant:normal; line-height:100%" %)**Close Button Text : ** This can change the text of close button like X, close , end whatever you want.  [[image:1725016443810-538.png||height="56" width="124"]][[image:1725016469945-625.png||height="52" width="112"]]
62 62  )))
63 63  * (((
64 64  (% class="western" style="text-align:left" %)
... ... @@ -189,7 +189,7 @@
189 189  (% style="margin-left: 40.0px;" %)
190 190  3. To populate the columns, let's choose from the 'Demographics' option.
191 191  
192 -1.
192 +1.
193 193  11. Select First Name and drag it to the left-most cell, followed by Last Name to the middle cell, next email to the last one.
194 194  
195 195  (% style="margin-left: 40.0px;" %)
... ... @@ -205,7 +205,7 @@
205 205  (% style="margin-left: 40.0px;" %)
206 206  5. To add Captcha to the form:
207 207  
208 -1.
208 +1.
209 209  11. Select 'Form' from the right-hand panel[[image:attach:Screen Shot 2022-08-23 at 4.52.47 PM.png||thumbnail="true" width="150"]]
210 210  11. Select Captcha and drag it over to the spot on the canvas.  In this case, we choose below the 3-column grid
211 211  
... ... @@ -215,7 +215,7 @@
215 215  (% style="margin-left: 40.0px;" %)
216 216  6. To add a 'Submit' button:
217 217  
218 -1.
218 +1.
219 219  11. Select it from the 'Form' option and,
220 220  11. Drag it to the spot you prefer on the canvas,
221 221  11. Eventually this position will impact how your final form is displayed)
... ... @@ -265,18 +265,8 @@
265 265  
266 266  
267 267  
268 -=== ===
269 -
270 -=== ===
271 -
272 272  {{id name="click-thru-button"/}}
273 273  
274 -=== ===
275 -
276 -=== ===
277 -
278 -{{id name="click-thru-button"/}}
279 -
280 280  === Click-Thru Button ===
281 281  
282 282  Often users will want to create a pop-up or landing page that has a button that clicks through to another site or page. The specific use-case could be clicking to a partner site to download a digital edition, clicking to a non-ONEcount form, or clicking off-site to a thid-party application.
... ... @@ -303,15 +303,19 @@
303 303  
304 304  after this pick the link-box from layers or you can find it on canvas and the go to the gear button there you can see extra option called completion which by default set as yes which means it will count the completion , you can select  "No" if you do't want to count completion.
305 305  
296 +[[image:1725015402669-281.png]][[image:1725015494395-170.png]]
306 306  
298 +
307 307  === Close pop-up after Action: ===
308 308  
309 309  So for Click-Thru Image and Button popup will automaicaly close after it redirects to the target page and if you want to close popup after any specific action like form-sumition or clicking on any element the you can use the below extra script.
310 310  
311 311  
304 +{{code language="Javascript"}}
312 312  $("#button or image id or element id").click(function(){
313 313  setInterval(function(){window.parent.postMessage("closepopup", "*");},1000);
314 314  });
308 +{{/code}}
315 315  
316 316  === TEMPLATES MENU ===
317 317  
... ... @@ -675,4 +675,3 @@
675 675  [[image:attach:VerifyEmailExists-2.png||height="150"]]
676 676  
677 677  The Lookup link takes you to the login/sign-in page.
678 -
1725015402669-281.png
Author
... ... @@ -1,0 +1,1 @@
1 +XWiki.sachin
Size
... ... @@ -1,0 +1,1 @@
1 +16.3 KB
Content
1725015494395-170.png
Author
... ... @@ -1,0 +1,1 @@
1 +XWiki.sachin
Size
... ... @@ -1,0 +1,1 @@
1 +18.3 KB
Content
1725015808108-336.png
Author
... ... @@ -1,0 +1,1 @@
1 +XWiki.sachin
Size
... ... @@ -1,0 +1,1 @@
1 +10.2 KB
Content
1725015836339-358.png
Author
... ... @@ -1,0 +1,1 @@
1 +XWiki.sachin
Size
... ... @@ -1,0 +1,1 @@
1 +13.6 KB
Content
1725015904419-419.png
Author
... ... @@ -1,0 +1,1 @@
1 +XWiki.sachin
Size
... ... @@ -1,0 +1,1 @@
1 +45.5 KB
Content
1725015940232-868.png
Author
... ... @@ -1,0 +1,1 @@
1 +XWiki.sachin
Size
... ... @@ -1,0 +1,1 @@
1 +69.8 KB
Content
1725016042172-661.png
Author
... ... @@ -1,0 +1,1 @@
1 +XWiki.sachin
Size
... ... @@ -1,0 +1,1 @@
1 +48.2 KB
Content
1725016078700-211.png
Author
... ... @@ -1,0 +1,1 @@
1 +XWiki.sachin
Size
... ... @@ -1,0 +1,1 @@
1 +39.1 KB
Content
1725016368615-308.png
Author
... ... @@ -1,0 +1,1 @@
1 +XWiki.sachin
Size
... ... @@ -1,0 +1,1 @@
1 +4.0 KB
Content
1725016404637-413.png
Author
... ... @@ -1,0 +1,1 @@
1 +XWiki.sachin
Size
... ... @@ -1,0 +1,1 @@
1 +2.9 KB
Content
1725016443810-538.png
Author
... ... @@ -1,0 +1,1 @@
1 +XWiki.sachin
Size
... ... @@ -1,0 +1,1 @@
1 +5.0 KB
Content
1725016469945-625.png
Author
... ... @@ -1,0 +1,1 @@
1 +XWiki.sachin
Size
... ... @@ -1,0 +1,1 @@
1 +4.1 KB
Content