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.

  1. Go to File, then select New Table.
  2. Enter the number of rows and columns you need and click Create.
  3. Fill in your table with the desired content.
  4. Once you’re satisfied, click Generate to create the table code.
  5. 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.

  1. Click on Add Element and choose the Embed Code element.
  2. Drag and drop this element to the new section you created.
  3. Double-click on the Embed Code element to edit it.
  4. 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.

  1. Click the Save button, name your table (e.g., Test), and hit Save.
  2. To edit the table later, go to File, then Load Table. Locate your saved table on your computer and load it to continue editing.
  3. 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:

  1. Hostinger Hosting and WordPress Management
  2. 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!

Similar Posts