How to Add a Table in Hostinger Website Builder
Hey everyone, welcome to Ben’s Experience! In this tutorial, I’ll show you how to add a table in Hostinger Website Builder. Tables can help you organize and display information on your website effectively. Follow these simple steps to add a table to your Hostinger website.
Step 1: Add a New Section First, log in to your Hostinger Website Builder and open the website you want to edit. Add a new blank section to give yourself some space to work with. This will be where your table will be placed.
Step 2: Create Your Table Using Tablesgenerator.com Head over to Tables Generator. This tool makes it easy to create custom tables.
- Go to File, then select New Table.
- Enter the number of rows and columns you need and click Create.
- Fill in your table with the desired content.
- Once you’re satisfied, click Generate to create the table code.
- Use the “Copy to Clipboard” button to copy the generated code.
Step 3: Embed the Table in Hostinger Website Builder Return to Hostinger Website Builder.
- Click on Add Element and choose the Embed Code element.
- Drag and drop this element to the new section you created.
- Double-click on the Embed Code element to edit it.
- Paste the table code you copied from Tables Generator.
Step 4: Make the Table Scrollable To make your table scrollable, add the following line of code after the first line of the table code:
cssCopy code<style> .table-container { overflow-x: auto; } </style>
This line of code will ensure your table is scrollable horizontally, improving user experience on your website.
Step 5: Finalize and Update Your Website Click on Save or Publish to update your website with the new table. Now, your table should be live on your website.
Pro Tip: Save Your Tables for Future Editing Tables Generator allows you to save your tables for future edits.
- Click the Save button, name your table (e.g., Test), and hit Save.
- To edit the table later, go to File, then Load Table. Locate your saved table on your computer and load it to continue editing.
- Copy the updated code and embed it back into your Hostinger Website Builder.
That’s it! You now know how to add a table in Hostinger Website Builder. Thank you for watching and reading. Don’t forget to like this video and subscribe to my channel for more tutorials.
Special Offer: Free Online Courses Before you go, I have two free online video courses for you:
- Hostinger Hosting and WordPress Management
- Using Hostinger Website Builder to Create Basic Websites or Online Shops
Get them both for free by clicking the link in the description. If you have any questions, leave a comment below. See you in the next tutorial!