GASでスプレッドシートのデータをもとにGoogleスライドの文字列を置換する

photo credit: Sesc em São Paulo sheet, music via photopin (license)

みなさん、こんにちは！
タカハシ(@ntakahashi0505)です。

GASでGoogleスライドのプレゼンテーションを楽々作成するテクニックについてシリーズでお伝えしています。

前回の記事はこちら！

GASでGoogleスライドのシェイプのテキストを置換する方法

GASでGoogleスライドのプレゼンテーションを楽々作成するテクニックについてお伝えしています。今回はGASでGoogleスライドのシェイプのテキストを置換して設定する方法をお伝えします。

スライドのシェイプ内の文字列を置換する方法をお伝えしました。

さて、その置換ですが、置換前の文字列と置換後の文字列をスプレッドシートなどで管理しておけば、メンテナンスが楽ちんそうですよね。

ということで、今回はGASでスプレッドシートのデータをもとにGoogleスライドの文字列を置換するスクリプトを紹介していきます。

では、行ってみましょう！

前回のおさらい
1. スプレッドシートで置換ルールをメンテナンスしたい
文字列の置換処理を関数化する
Shapeオブジェクトの取得を関数化する
スプレッドシートのデータをもとに置換する
まとめ
連載目次：GASでGoogleスライドのプレゼンテーションを楽々作成

前回のおさらい

まず、前回のおさらいからです。

作成したコードはこちら。

function replaceShapeString(){

  var url ='*****テンプレート用プレゼンテーションのURL*****';
  var presentation = SlidesApp.openByUrl(url);  

  var id = 'g7c06e4895a_0_4';
  var shape = presentation.getPageElementById(id).asShape();
  var str = shape.getText().asString();
  
  str = str
    .replace('{講座名}','中級講座')
    .replace('{コース名}', 'GASコース')
    .replace('{レッスン名}', 'スコープ・関数')
    
  shape.getText().setText(str);

}

プレゼンテーションのオブジェクトIDで指定したシェイプについて、その含まれている文字列を

{講座名} → 中級講座
{コース名} → GASコース
{レッスン名} → スコープ・関数

と置換するというものでした。

スプレッドシートで置換ルールをメンテナンスしたい

ただ、これらの置換のルールをスクリプト内にベタ書き…というのはメンテナンスしづらいですよね。

ということで、以下のようなシート「shape」を用意しました。

このスプレッドシート上の置換ルールのもと、それぞれのシェイプ内の文字列を置換してくれたら便利ですよね！

ちなみに、オブジェクトID「g7c06e4895a_0_4」が表すシェイプはこちらのスライドのもので…

オブジェクトIDg7c1238ed2f_0_393」が表すシェイプはこちらのスライドのものです。

文字列の置換処理を関数化する

では、少しずつ進めていきます。

前回のコードですが、文字列の置換の処理の部分は何度も使いまわしが必要そうなので、別関数replaceInBrace_に関数化して切り出しました。

こちらです。

function replaceShapeString(){

  var url ='*****テンプレート用プレゼンテーションのURL*****';
  var presentation = SlidesApp.openByUrl(url);  

  var id = 'g7c06e4895a_0_4';
  var shape = presentation.getPageElementById(id).asShape();
  var str = shape.getText().asString();
  
  str = replaceInBrace_(str, '講座名','中級講座')
  str = replaceInBrace_(str, 'コース名', 'GASコース')
  str = replaceInBrace_(str, 'レッスン名', 'スコープ・関数')
  
  shape.getText().setText(str);
  
}

function replaceInBrace_(str, pattern, replacement){
  
  pattern = '{' + pattern + '}';
  str = str.replace(pattern, replacement);
  return str;
  
}

もととなる文字列strと、置換前の文字列pattern（波かっこ内のものでOK）、置換後の文字列replacementを渡すと、それをもとに置換したものをリターンするというものです。

あまり冒頭のコードと変わらないぞ！と思われるかも知れませんが、波かっこを指定しなくてよくなったのと、あとは…シリーズの後のほうで役に立つ時が来ます。

実行すると、以下のようにうまく置換されるはずです。

Shapeオブジェクトの取得を関数化する

では、続いて進めていきましょう。

先ほどのコードでいう6行目から14行目のところ、Shapeオブジェクトの取得と置換も関数化して切り出します。

すると、以下のようになります。

function replaceShapeString(){

  var url ='*****テンプレート用プレゼンテーションのURL*****';
  var presentation = SlidesApp.openByUrl(url);  
  var id = 'g7c06e4895a_0_4';
  
  replaceShapeString_(presentation, id, '講座名','中級講座');
  replaceShapeString_(presentation, id, 'コース名', 'GASコース');
  replaceShapeString_(presentation, id, 'レッスン名', 'スコープ・関数');
  
}

function replaceShapeString_(presentation, id, pattern, replacement){

  var shape = presentation.getPageElementById(id).asShape();
  var str = shape.getText().asString();
  str = replaceInBrace_(str, pattern, replacement);
  shape.getText().setText(str);
  
}

function replaceInBrace_(str, pattern, replacement){
  
  pattern = '{' + pattern + '}';
  str = str.replace(pattern, replacement);
  return str;
  
}

ちょっと引数が多いのが気になりますが、いったん良しとしましょう。

実行して、先ほどと同様の結果となるか確認しましょう。

スプレッドシートのデータをもとに置換する

さらに、置換ルールをスプレッドシートから読み取るようにします。

先ほどのコードについて、関数replaceShapeStringを以下のように修正します。

なお、関数replaceShapeString_と、関数replaceInBrace_はそのままで使用します。

function replaceShapeString(){

  var url ='*****テンプレート用プレゼンテーションのURL*****';
  var presentation = SlidesApp.openByUrl(url);  

  var ss = SpreadsheetApp.getActiveSpreadsheet();
  var valuesShape = ss.getSheetByName('shape').getDataRange().getValues();
  
  for(var i = 1; i < valuesShape.length; i++){
    
    var id = valuesShape[i][0];
    var pattern = valuesShape[i][1];
    var replacement = valuesShape[i][2];
    
    replaceShapeString_(presentation, id, pattern, replacement);

  }
}

スプレッドシートとそのシート上のデータの取得して、そのデータの行数分だけループして、置換をしていきます。

冒頭のスプレッドシートを使ったとすると、1枚目のスライドだけでなく、別のスライドも以下のように置換することができるようになりました。

だいぶ実務で使えるツールになってきましたね。

まとめ

以上、GASでスプレッドシートのデータをもとにGoogleスライドの文字列を置換するスクリプトについて紹介しました。

関数化のところは、ぜひご自身で「自分だったら冒頭のコードからどのように関数化するかな…？」と考えながらトライしてみてくださいね。

次回は、プレゼンテーションのコピーの部分について考えていきます。

GASでGoogleスライドのプレゼンテーションをコピーする方法

GASでGoogleスライドのプレゼンテーションを楽々作成するテクニックについてお伝えしています。今回はGASでGoogleスライドのプレゼンテーションをコピーする方法です。Driveサービスを使いますよ。

どうぞお楽しみに！

連載目次：GASでGoogleスライドのプレゼンテーションを楽々作成

定例会議用資料、レポート、プレゼンテーションなど、テンプレートをもとにGoogleスライドのプレゼンテーションを作るというお仕事はけっこうあります。全部は無理にしても、いくつかの段取りは、GASを使って自動化できるかも…！？このシリーズでは、そのようなGoogleスライドのプレゼンテーション自動化のアイデアと、スクリプトの書き方を紹介します！