filmov
tv
Series of Basic Tutorials - 5.How to use Menu Widget and create Template
Показать описание
Welcome to our basic low-code tutorials on using the Elwis app web builder.
🎥 In this tutorial, we'll guide you through creating a Menu for your application, and saving it also as a Template for future uses. Let's build apps together with Elwis! Here is what we'll cover:
1️⃣ *Create a Section:*
To start, we need to generate a section. Here, we'll create our own section.
2️⃣ *Choose Your Style:*
Click on the style within the green border to pick a color. You can enter a hex code or select from the color palette.
3️⃣ *Add Text Widget:*
Click the plus icon in the blue section to create a text widget. Write the name of your application, and customize the text by adjusting the size, font, and more.
4️⃣ *Align and Stretch:*
Want the inner section to align left and stretch across the full screen? Select the "full container width" option in the “inner section container” section.
5️⃣ *Create Menu Widget:*
Click the plus icon in the second slot to create a menu widget. Add items and link them to their respective pages.
6️⃣ *Edit Font Design:*
To edit the font in your menu widget, click on the “label” button. Here, you can adjust the font size, style, and color.
7️⃣ *Hover Effects:*
By selecting “on hover,” you can modify the same parameters for when users hover over the menu items.
8️⃣ *Adjust Sidebar:*
If the sidebar obstructs your view while editing, click the arrow to move it to the other side. This way, you can see changes as you make them.
9️⃣ *Text Layout & Padding:*
Adjust the text layout in the box by clicking on style and padding to fit your needs.
🔟 *Linking & Saving:*
Since the items are linked to specific pages, clicking on them will redirect you to the corresponding page. Finally, if you want to use this menu on other pages, save it as a template.
Thank you for watching, and happy building! 🛠️
✏️ Created by Slavomira Solmosiova & Natalia Motyl
*Let's stay connected:*
✔️ LinkedIn: / elwisapp
✔️ YouTube: @elwisapp-kw9xm
0:00 Welcome to Elwis App
0:11 Create and design section
0:30 Text Widget
1:05 Menu Widget
1:52 Modifying the appearance of the menu widget
2:24 Moving the sidebar
2:29 Modifying the appearance of the text widget
2:44 Padding - text widget
2:59 Redirecting to the page
3:16 Save Section as a Template
3:42 Reuse Template
🎥 In this tutorial, we'll guide you through creating a Menu for your application, and saving it also as a Template for future uses. Let's build apps together with Elwis! Here is what we'll cover:
1️⃣ *Create a Section:*
To start, we need to generate a section. Here, we'll create our own section.
2️⃣ *Choose Your Style:*
Click on the style within the green border to pick a color. You can enter a hex code or select from the color palette.
3️⃣ *Add Text Widget:*
Click the plus icon in the blue section to create a text widget. Write the name of your application, and customize the text by adjusting the size, font, and more.
4️⃣ *Align and Stretch:*
Want the inner section to align left and stretch across the full screen? Select the "full container width" option in the “inner section container” section.
5️⃣ *Create Menu Widget:*
Click the plus icon in the second slot to create a menu widget. Add items and link them to their respective pages.
6️⃣ *Edit Font Design:*
To edit the font in your menu widget, click on the “label” button. Here, you can adjust the font size, style, and color.
7️⃣ *Hover Effects:*
By selecting “on hover,” you can modify the same parameters for when users hover over the menu items.
8️⃣ *Adjust Sidebar:*
If the sidebar obstructs your view while editing, click the arrow to move it to the other side. This way, you can see changes as you make them.
9️⃣ *Text Layout & Padding:*
Adjust the text layout in the box by clicking on style and padding to fit your needs.
🔟 *Linking & Saving:*
Since the items are linked to specific pages, clicking on them will redirect you to the corresponding page. Finally, if you want to use this menu on other pages, save it as a template.
Thank you for watching, and happy building! 🛠️
✏️ Created by Slavomira Solmosiova & Natalia Motyl
*Let's stay connected:*
✔️ LinkedIn: / elwisapp
✔️ YouTube: @elwisapp-kw9xm
0:00 Welcome to Elwis App
0:11 Create and design section
0:30 Text Widget
1:05 Menu Widget
1:52 Modifying the appearance of the menu widget
2:24 Moving the sidebar
2:29 Modifying the appearance of the text widget
2:44 Padding - text widget
2:59 Redirecting to the page
3:16 Save Section as a Template
3:42 Reuse Template