質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
87.20%
Google スプレッドシート

Google スプレッドシートは、フリーで利用できる表計算ソフト。Webアプリのためインターネットに接続することで利用できます。チャートやグラフの作成のほか、シートを他のユーザーと共有したり、同時に作業を進めることも可能です。

Google フォーム

Google フォームは、 Google社が提供しているアンケートフォーム作成および集計ができる無料のツール。Googleアカウントがあれば利用が可能です。集計データは、スプレッドシートに収集され、データ分析もできます。

Google サイト

Google サイトは、Google社が提供する無料のホームページ作成ツールです。プログラミングやデザインなどの知識がなくても、ブラウザから容易にWebページを作成することが可能。新たなページの追加も簡単でページ数には制限がありません。

Google Apps Script

Google Apps ScriptはGoogleの製品と第三者のサービスでタスクを自動化するためのJavaScriptのクラウドのスクリプト言語です。

解決済

スプレッドシートのセルに表記されたURLへのリンクがうまくいくようにしたい

yoy_chem
yoy_chem

総合スコア3

Google スプレッドシート

Google スプレッドシートは、フリーで利用できる表計算ソフト。Webアプリのためインターネットに接続することで利用できます。チャートやグラフの作成のほか、シートを他のユーザーと共有したり、同時に作業を進めることも可能です。

Google フォーム

Google フォームは、 Google社が提供しているアンケートフォーム作成および集計ができる無料のツール。Googleアカウントがあれば利用が可能です。集計データは、スプレッドシートに収集され、データ分析もできます。

Google サイト

Google サイトは、Google社が提供する無料のホームページ作成ツールです。プログラミングやデザインなどの知識がなくても、ブラウザから容易にWebページを作成することが可能。新たなページの追加も簡単でページ数には制限がありません。

Google Apps Script

Google Apps ScriptはGoogleの製品と第三者のサービスでタスクを自動化するためのJavaScriptのクラウドのスクリプト言語です。

1回答

0評価

0クリップ

435閲覧

投稿2021/08/17 00:39

編集2021/08/27 06:10

GoogleサイトにてHPを作成中。スプレッドシートから表を作成するようなHTML、GASはできるようになった。

イメージ説明

上記スプレッドシートのABC列をHTMLとGASを用いた表で
Googleサイト上に表示させたい。
しかし、C列にはD列のURLをリンクさせたい。
D列のリンクは、Googleサイト上のページへのリンクです。

イメージとしては、閲覧者は
①Googleサイトのトップページのこの表を見る
②閲覧したい更新箇所の表のC列をクリックすると、該当のページ(D列のURL)へ飛ぶ
としたいです。

コメントをいただいたため
https://teratail.com/questions/355287
を参考にしてHTMLのコードを入力してみました。
しかし、以下のエラーメッセージが表示されました。

発生している問題・エラーメッセージ

SyntaxError: Unexpected identifier

該当のソースコード

HTML

<!DOCTYPE html> <html> <head> <base target="_top"> <style> table,td,th{border:1px solid black;} td{padding: 10px;} </style> </head> <body> <? var data = getData(); ?> <table> <tr> <th><?=data[0][0]?></th> <th><?=data[0][1]?></th> <th><?=data[0][2]?></th> </tr> <? for(var i= 1,j=data.length;i<j;i++){ output._=('<tr>') output._=('<td>'+Utilities.formatDate(new Date(data[i][0]),'Asia/Tokyo','yyyy/MM/dd')+'</td>'); output._=('<td>'+data[i][1]+'</td>'); output._=('<td>'<a href"+{data[i][3]}>+data[i][2]+'</td>'); output._=('</tr>') } ?> </table> </body> </html>

GAS

function doGet() { return HtmlService.createTemplateFromFile("HTML名").evaluate(); } function getData() { var ss = SpreadsheetApp.openByUrl("スプレッドシートURL"); var values = ss.getSheetByName("シート名").getDataRange().getValues(); return values; }

良い質問の評価を上げる

以下のような質問は評価を上げましょう

  • 質問内容が明確
  • 自分も答えを知りたい
  • 質問者以外のユーザにも役立つ

評価が高い質問は、TOPページの「注目」タブのフィードに表示されやすくなります。

気になる質問をクリップする

クリップした質問は、後からいつでもマイページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

teratailでは下記のような質問を「具体的に困っていることがない質問」、「サイトポリシーに違反する質問」と定義し、推奨していません。

  • プログラミングに関係のない質問
  • やってほしいことだけを記載した丸投げの質問
  • 問題・課題が含まれていない質問
  • 意図的に内容が抹消された質問
  • 過去に投稿した質問と同じ内容の質問
  • 広告と受け取られるような投稿

評価を下げると、トップページの「アクティブ」「注目」タブのフィードに表示されにくくなります。

3_April_2021

2021/08/18 00:01

サイトと呼んでいるページに(project内の)異なるhtmlを表示するリンクを作成したいか、別のページへのリンクを作成したいかによって、話は少し異なるはずです。その点を明確にしたほうがいいと思います。 (ちなみに、Googleには「Googleサイト」というサービスがありますのでご注意ください)
yoy_chem

2021/08/23 01:24

ありがとうございます。 見逃しておりました。 この後修正します。
3_April_2021

2021/08/27 02:20

リンク付けについては、同サイト投稿(355287)のfake_shibeユーザの2件目の回答が役立つと思います。 (この方法自体や細かい書き方の適切性についてはコメントできませんが) とりあえず、上記の情報を参考にして、これで解決できると思うコードを書いてみてください。それでも問題が解決しない場合は、もう一度コメントしてください。
3_April_2021

2021/08/27 06:47

ひとまず、output._=('<td>'<a href"+{data[i][3]}>+data[i][2]+'</td>');だけ見ました。()内の書き方が誤っています。以下を通じて自分で原因を把握できますか? -https://developer.mozilla.org/ja/docs/Web/HTML/Element/a -https://developer.mozilla.org/ja/docs/Learn/JavaScript/First_steps/Strings 各ページの全ての文章を理解する必要はありません。全くわからないならわからないで構いません。しかし一度目は通してください。
yoy_chem

2021/08/27 07:00

目を通しました。 1つ目について、URLが絶対的なものであるならば... というのは理解できたのですが 今回のような場合についてはわかりません。 2つ目についてはわかりません。 当方教員でして、HTMLもJavaも触ったことがありません。 学校HPを作っているのですが、職員に知識がないため、 取り掛かりやすいフォームにて更新履歴の管理ができたらなと思っております。 ほぼほぼ、ネット上で拾ってきたもので学んでいるので... 知識不足、申し訳ございません。
3_April_2021

2021/08/27 07:20 編集

誤りを見つけたため削除しました。
3_April_2021

2021/08/27 07:18

「'<td>'<a href"+{data[i][3]}>+data[i][2]+'</td>'」と「`<td><a href="${data[i][3]}">${data[i][2]}</td>`」を比較してください。
3_April_2021

2021/08/27 07:27

もしくは「'<td><a href="' + data[i][3] +'">' + data[i][2] + '</a></td>'」。

まだ回答がついていません

会員登録して回答してみよう

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
87.20%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問

同じタグがついた質問を見る

Google スプレッドシート

Google スプレッドシートは、フリーで利用できる表計算ソフト。Webアプリのためインターネットに接続することで利用できます。チャートやグラフの作成のほか、シートを他のユーザーと共有したり、同時に作業を進めることも可能です。

Google フォーム

Google フォームは、 Google社が提供しているアンケートフォーム作成および集計ができる無料のツール。Googleアカウントがあれば利用が可能です。集計データは、スプレッドシートに収集され、データ分析もできます。

Google サイト

Google サイトは、Google社が提供する無料のホームページ作成ツールです。プログラミングやデザインなどの知識がなくても、ブラウザから容易にWebページを作成することが可能。新たなページの追加も簡単でページ数には制限がありません。

Google Apps Script

Google Apps ScriptはGoogleの製品と第三者のサービスでタスクを自動化するためのJavaScriptのクラウドのスクリプト言語です。