How to make a checklist?

Hi @stephanielk

You technically could make a checklist using our form builder block.
By adding a checklist and submit button inside the form builder.
But currently, we only have the option to export entries into CSV files, we don’t have a feature to save them into PDF yet.

Okay, thanks for your help. I’m surprised I can’t find any plugins or easy way to drop in a checklist with pdf and print functionality. So many websites have them, yet there seems to be no easy way to do it in WP. Bit annoying, honestly. Thank you though!

Hi, I tried building the checklist, with 2 columns in a section and then increasing the top margin of checkboxes to align with the start of each point in the front-end. Problem is, I have to offset so much to align the checkboxes and points (paragraphs) that there’s no space at the end to align the last few points. Is there an easier way to align everything with out adding hundreds of px to top margin of each checkbox? Thank you!

Back-end – https://ibb.co/HHkx4sZ

Front-end – https://ibb.co/93YZJv6

• This reply was modified 1 year, 9 months ago by stephanielk.
• This reply was modified 1 year, 9 months ago by stephanielk.

Hi @stephanielk

Could you copy the checklist section here?
I will try to replicate and fix it on my side.
Here is a screenshot for reference on how to copy the block :

Hi, thank you so much for your reply and offer to help, I really appreciate it. I’ve tried a dozen times to copy and paste the block here but I’m unable to. I have no idea why. The image block also doesn’t work, I can only add links. It’s a bit frustrating. Is there some other way I could send you the block? Many thanks

Hi @stephanielk

You can copy and paste it to a text file and then use a public sharing file site to share that text file.

Hi, thanks again for all your help – does this work?

https://ln5.sync.com/dl/bae7fc4a0/qbjumrpg-yheegh22-m8us9ad3-ecsnxpdy

Hi @stephanielk,

It seems that you need to place each checkbox and its label in one section. This makes it easier to align the checkbox and label. Here is an example of the content that you might want to replicate: https://pastebin.com/UJXhcACn

Thank you so much for sending this through. I still have the same issue though, I can play with the padding to get the checkboxes to display aligned in my desktop view, but in mobile view (and I suppose in any other view), it’s not aligned and does not look like a checklist.

I’m just wondering, how do all those cooking sites with ingredients checklists work? There are so many checklists around and yet no straightforward way to create them in WP. I’m confused at how hard this seemingly simple layout is (sorry, I’m new and don’t have much experience with WP).

https://ibb.co/8Mk26PQ

Please also set the column width for this case. The column width style will be set to 100% by default if it has no value.

For how the checklist work, did you mean you want to capture your user’s answers into a form? If so, you can put the checklist inside the Form Builder block. Then you need to set up a form. We have documentation regarding this here.

Again, thank you for your reply, but it doesn’t change anything. The first column is already aligned to 10px wide from your pastebin copy.

I’m so confused as to why this is so difficult. I’m not trying to have a go at anyone because I appreciate all the assistance, but I’m really starting to get frustrated, it’s over 2 weeks back and forth, and I am still no closer to a solution for a simple checklist.

No I don’t want to collect user answers, I simply want a checkbox that users can tick off that aligns with the TOP of the accompanying text box. In the pastebin copy, the checkbox does not align with the top of the text.

In the 2 weeks I’ve been waiting for a solution, I’ve built out the rest of my website, so I’m okay to share the page link now. Maybe that will help fix this finally. Please if you scroll all the way to the bottom, you will see all my checklists and the half checklist from the pastebin code you sent. You can see that it does not resolve properly. Please are you able to help recreate a functional and responsive checklist that displays like the other checklists I have created?

Thank you once again for all your help, I do appreciate it.

https://liposuction-recovery.com/pre-op/

Hi @stephanielk

I cannot access the page because your site has a critical error. Yes, the content has a 10% width on the content I first provided, but it’s only for desktop view. Sorry, I forgot to mention that the option is for mobile view. To change the view to mobile on the editor, click the desktop icon, then choose phone view. Have you done this?

Hi, thanks so much for your reply! I just realised my site was not loading, I have fixed the error, so if you could please take another look I would really appreciate it. Yes, the 10% margin was applied to mobile view as well. Thank you

Please also set the mobile right column width to 90%. I have shown it in my screenshot. Also, you need to set the label space to 0; it will make the checkboxes stick in their column and not overlap with the text on mobile view.

This is the new pastebin with updated content. I also adjust the desktop column width to reduce the space when checkbox label space is set 0.

https://pastebin.com/JWHBwsR3

Thank you so much! That new code has solved it for me. The checkboxes still don’t align flush with the accompanying text, but I can live with it. Thank you so much for all your help, I truly appreciate it!

There’s just one more thing if you can please help me with? Google has indexed these 2 pages, did you perhaps create them when trying to help me? (If that’s possible). I can’t find them on my site to delete them, could you please advise me how to get rid of these pages?

https://liposuction-recovery.com/gutenverse-form/checklist-point/

https://liposuction-recovery.com/gutenverse-form/checklist-checkbox/

Thank you!

• This reply was modified 1 year, 8 months ago by stephanielk.