Skip to main content

How to copy data in Google Sheets as HTML table

I often need to extract some sample data in Google Sheets and present it in my blog as an HTML table. However, when copying a selected range in Google Sheets and paste it outside the Google Sheets, I only get plain text. In this post, I explain how to copy data in Google Sheets as an HTML table by writing a small Apps Script program.

Concept

  • Write a small Apps Script program copyAsHTMLTable() to transform the selected range in the active sheet into a HTML code for table
  • According to Apps Script documentation, getActiveRange() returns the selected range in the active sheet.
  • According to Apps Script documentation, getDisplayValues() returns the rectangular grid of values for a range.
  • From the rectangular grid of values:
    • Use 2 for loops to iterate row by row and then column by column
    • Each row is wrapped in a HTML row tag <tr></tr>
    • Each column is wrapped in a HTML column tag <td></td>
  • Present the HTML table code in a dialog so that user can copy it manually
  • Add the program copyAsHTMLTable() to a menu on the toolbar to easily run it

Source Code

function onOpen() { var spreadsheet = SpreadsheetApp.getActive() var menuItems = [ { name: 'Copy as HTML table', functionName: 'copyAsHTMLTable' } ] spreadsheet.addMenu('Personal Toolbox', menuItems) } function copyAsHTMLTable() { var spreadsheet = SpreadsheetApp.getActive(); var values = spreadsheet.getActiveRange().getDisplayValues() var text = '<table>' for (var row = 0; row < values.length; row++) { text += '<tr>' for (var col = 0; col < values[0].length; col++) { text += '<td>' text += values[row][col] text += '</td>' } text += '</tr>' } text += '</table>' var ui = SpreadsheetApp.getUi() ui.alert('Please manually select and copy the text below', text, ui.ButtonSet.OK) }

Getting Started

  • Open a sheet in Google Sheets
  • From the toolbar, click Tools and then Script Editor
  • Copy the code above in to the script editor
  • From the toolbar of the script editor, run the onOpen() function
  • Come back to the sheet you will see the Personal Toolbox on the toolbar
  • Select a range in the sheet
  • From the toolbar, click Personal Toolbox and then Copy as HTML table
  • A dialog shows up containing HTML table code
  • Copy data in the dialog and click OK
Copy sheets as HTML table

Comments

Popular posts from this blog

Create personal stock portfolio tracker with Google Sheets and Google Data Studio

I have been investing in the stock market for a while. I was looking for a software tool that could help me better manage my portfolio, but, could not find one that satisfied my needs. One day, I discovered that the Google Sheets application has a built-in function called GOOGLEFINANCE which fetches current or historical prices of stocks into spreadsheets. So I thought it is totally possible to build my own personal portfolio tracker with Google Sheets. I can register my transactions in a sheet and use the pivot table, built-in functions such as GOOGLEFINANCE, and Apps Script to automate the computation for daily evolutions of my portfolio as well as the current position for each stock in my portfolio. I then drew some sort of charts within the spreadsheet to have some visual ideas of my portfolio. However, I quickly found it inconvenient to have the charts overlapped the table and to switch back and forth among sheets in the spreadsheet. That's when I came to know the existenc

Stock Portfolio Tracker Dashboard With Google Data Studio

In the series of building personal stock portfolio tracker, we have learned how to use Google Sheets to register transactions . We have then used the pivot table and GOOGLEFINANCE function to compute the latest position of the stock portfolio . We have made a step further to use Apps Scripts to compute automatically and daily the stock portfolio's evolution . However, after all, we have several tables of data as the result which do not tell any story yet. We need to present those data in graphs to understand the portfolio's performance and make improvements accordingly. We can effectively plot graphs in different aspects directly in Google Sheets as it provides many charting tools. However, in my experience, having charts and data in the same spreadsheet is not very convenient because charts and tables tend to overlap each other and of lack of interactivity. We should have a dedicated dashboard to have an overview of the stock portfolio and we can do it greatly with Google Data

Demo stock portfolio tracker with Google Sheets

As explained in the post Create personal stock portfolio tracker with Google Sheets and Google Data Studio , a personal stock portfolio tracker consists of 2 main elements: a spreadsheet in Google Sheets and an interactive dashboard in Google Data Studio. You can take a look at the sample spreadsheet below to have an idea of how the data is organized and related. It is possible to make a copy of the spreadsheet to study it thoroughly. Make a copy Note Disclaimer Make a copy Click here to make a copy Note To better understand the overall concept, please check out this post Create personal stock portfolio tracker with Google Sheets and Google Data Studio . Disclaimer The post is only for informational purposes and not for trading purposes or financial advice.

Monitor stock portfolio with Google Sheets (Pivot table and GOOGLEFINANCE function)

As an investor, it is important to know the latest state of the stock portfolio. We need to know what stocks currently owned in the portfolio, how many shares for each one, how much dividend or gain contributed so far by each stock, etc. As we have registered stock transactions in a spreadsheet with Google Sheets, we can easily have the latest update from the stock portfolio by using pivot tables and GOOGLEFINANCE function. Use a pivot table to group transactions by symbols Configure the pivot table Positions Use GOOGLEFINANCE function to get real-time information for stocks Conditional formatting columns Demo Note References Disclaimer Use a pivot table to group transactions by symbols The pivot table helps to see relationships between data points. To see how each stock contributes to the portfolio, we will create a pivot table that originated from the Transactions sheet. Select the Transactions sheet. Select the 5 columns A:E . In the menu at the top, click Dat