NEXUS PLUGIN PASSWORD
Repeat this process with both the Password and PIN fields. That will populate this username field with the entered text from the user. Select that, and then click on the ‘s value option. In the drop down, you will see the Username input field we created on our login panel. Click in the Username field, and then on Insert Dynamic Data. The plug in will automatically populate with plugin default data, however we want to add the log in information that the user is inputting when they use the app. This takes you to the workflow tab in the Log in Button's workflow.Ĭlick to add an action, and under Plugins, scroll down to Nexus - Users API: Login/user. With the button still highlighted, click on the Start / Edit Workflow button. The style chosen in this tutorial is Secondary Button. Click + drag it below your PIN input field.įinally, name the button, fill in the placeholder text, and choose a style for it. Back on the left build bar under Visual Elements drop down, click on Button. This will then hide the password and PIN as they are typed by the user and not shown as plain text. In addition to the last checkbox selected, for the password and PIN you should also go to the Content format dropdown and select Password. Now, you will repeat this process for both the Password and PIN fields. Check the This input should not be empty box. Change the Placeholder text to “Username” as well, so the user knows to enter their username in this field. You will now want to change the name Input A to something more easily identifiable. click + drag a rectangle below your label inside your login panel.
![nexus plugin nexus plugin](https://i.ytimg.com/vi/L53H3rzO4uI/maxresdefault.jpg)
On the left build panel, under the Input Forms drop down, click on the Input button. Next, we need to add the text fields where the user will enter their username, password, and PIN. You can then right click on the text element and choose center horizontally to align it in the center of the rectangle. The option chosen in this tutorial was H1 Heading - Dark. Type whatever you would like to be the title of this section, and then click on the Style drop down menu underneath the Start / Edit workflow button. You can now edit the text within the box.
![nexus plugin nexus plugin](https://i.ytimg.com/vi/q_YcjfDJUQQ/maxresdefault.jpg)
On the left building panel under Visual Elements, click on Text and click + drag a smaller rectangle within the rectangle you have already made. Next, we will add some text to the rectangle to give it a label. This tutorial will just change the color of it. You can customize various characteristics of the rectangle shape you created in this edit panel. There will be a red outline indicating the size of the group that has previously been made, and you want to keep your shape within that rectangle.Īt the top of the new edit panel on the right hand side where it says Shape A, rename the panel to something that you will recognize as the Login Panel. Then, click + drag inside of the group you have already created to place the new shape inside of it.
![nexus plugin nexus plugin](https://images.squarespace-cdn.com/content/v1/54d696e5e4b05ca7b54cff5c/617ba553-a5e1-45e4-83a8-5b789a06bbf0/Install+Source-Nexus.jpg)
Under the Visual Elements drop down, click on the Shape option. Bubble has a Signup / Login Popup element under the Reusable element drop down, however we will be walking through creating one from scratch. Next, to actually build the login screen. This group will hold your items together that you are creating, and make it easier to make decisions for all elements at the same time (such as hiding or showing them at certain times). Before we start creating the panel itself, in the building panel under the Containers drop down, select Group and click + drag a large rectangle on your blank canvas.
![nexus plugin nexus plugin](https://cdn.shopify.com/s/files/1/0297/3233/9847/articles/nexus-3-review-preset-banks-more-find-out-if-its-worth-it-767027_1000x.jpg)
Now, on the far left, click back to the design tab.