みなさん、こんにちは!
タカハシ(@ntakahashi0505)です。
エクセルVBAで自動でHTML生成をするといったことを進めています。
具体的には
- Bootstrapを使ったWordPressによる企業向けサイト
- service,plan,aboutの3つのセクションによるトップページ
- エクセルの入力情報から自動生成する
といった方針です。
前回はこちらの記事で、serviceセクションを作りました。
ただちょっと、文字列連結のアンパサンド(&)がたくさんあって見づらいんですよね。
今回は、タブコードや改行コードを入れながらHTML文を追加していく処理を関数化してスッキリさせつつ、Planセクションを生成するプログラムも作っていきたいと思います。
では、よろしくお願いいたします!
前回のおさらい:ServiceセクションのHTMLを生成する
前回のプログラムのおさらいです。
メインのプロシージャがこちら。
Sub createTopHTML()
Dim strHTML As String
Dim ws As Worksheet
For Each ws In ThisWorkbook.Worksheets
Select Case ws.Name
Case "service"
strHTML = strHTML & createServiceSection(ws)
Case "plan"
Case "about"
End Select
Next ws
Debug.Print strHTML
End Sub
生成されたHTMLがイミディエイトウィンドウに出力されます。
serviceセクションを生成する関数createServiceSectionはこちらです。
Function createServiceSection(ByVal ws As Object) As String
Dim str As String
'section開始タグ
str = str & "" & vbCr
'***** セクションタイトルB1,セクション概要B2 *****
str = str & vbTab & _
"" & ws.Range("B1").Value & _
"
" & ws.Range("B2").Value & "
" & vbCr
'***** カラム *****
'class="row"の開始タグ
str = str & vbTab & "" & vbCr
Dim i As Long
For i = 5 To 8 '4カラム分繰り返し
'class="col-sm-x"の開始タグ
str = str & vbTab & vbTab & "" & vbCr
'タイトルB列
str = str & vbTab & vbTab & vbTab & "" & ws.Cells(i, 2).Value & "
" & vbCr
'サムネイル画像(枠のみ)
str = str & vbTab & vbTab & vbTab & "" & vbCr
'テキストC列
str = str & vbTab & vbTab & vbTab & "" & ws.Cells(i, 3).Value & "" & vbCr
'class="col-sm-x"の閉じタグ
str = str & vbTab & vbTab & "" & vbCr
Next i
'class="row"の閉じタグ
str = str & vbTab & "" & vbCr
'section閉じタグ
str = str & " " & vbCr
createServiceSection = str
End Function
…やっていることは文字列の連結なので、さほど難しいことをしているわけではないのですが、タブコードvbTabや改行コードvbCrなども入れるとアンパサンド(&)が多くなり見づらいですね。
まずはこの文字列の連結を関数化することでスッキリしていきましょう。
HTML文への文字列連結をする関数addHTML
createServiceSectionの各行は元の文字列strに文字列を追加していくという処理ですが
- 元の文字列の後ろに文字列を一行ずつ追加する
- 各行の冒頭にタブコードvbTabが0~3つ入る
- 各行の最後は改行コードvbCr
という法則性があります。
したがって、この処理を関数化することでコードをスッキリさせることができそうです。
この後に作るであろうplanセクションやaboutセクションのHTML生成にも便利ですし、後で読み返すときやメンテナンスするときに簡潔に書いておくほうが良いからです。
関数addHTMLのプログラム
その部分を関数化したaddHTMLはこちらです。
Function addHTML(ByVal strBase As String, ByVal cntIndent As Long, ByVal strAdd As String) As String
If cntIndent > 0 Then
Dim i As Long
For i = 1 To cntIndent
strBase = strBase & vbTab
Next i
End If
strBase = strBase & strAdd & vbCr
addHTML = strBase
End Function
各引数は
- strBase:元のHTML文字列
- cntIndent:タブコードの数
- strAdd:追加する特定の文字列
として与えれます。
この関数では元の文字列に
- 必要な数のタブコードを追加
- 特定の文字列を追加
- 改行コードを追加
して文字列を返します。
addHTMLを使ってcreateServiceSectionを書き直す
関数addHTMLを使ってcreateServiceSectionを書き直すと、このようになります。
Function createServiceSection(ByVal ws As Object) As String
Dim str As String
str = ""
'section開始タグ
str = addHTML("", 0, "")
'***** セクションタイトルB1,セクション概要B2 *****
str = addHTML(str, 1, "" & ws.Range("B1").Value & "
" & ws.Range("B2").Value & "
")
'***** カラム *****
'class="row"の開始タグ
str = addHTML(str, 1, "")
Dim i As Long
For i = 5 To 8 '4カラム分繰り返し
'class="col-sm-x"の開始タグ
str = addHTML(str, 2, "")
'タイトルB列
str = addHTML(str, 3, "" & ws.Cells(i, 2).Value & "
")
'サムネイル画像(枠のみ)
str = addHTML(str, 3, "")
'テキストC列
str = addHTML(str, 3, "" & ws.Cells(i, 3).Value & "")
'class="col-sm-x"の閉じタグ
str = addHTML(str, 2, "")
Next i
'class="row"の閉じタグ
str = addHTML(str, 1, "")
'section閉じタグ
str = addHTML(str, 0, " ")
createServiceSection = str
End Function
少しわかりやすくなりましたね。
planセクションを生成するプログラム
では、続いてplanセクションを生成するプログラムを作っていきます。
エクセルシートはこのように準備しました。
planセクションはserviceセクションと同じく4カラムで、類似しています。
異なる点としては、サムネイルとタイトルの順番が異なり、小さめの文字フォントで金額が記載されているという点です。
ですから、createServiceSectionをコピーして必要箇所の書き換えや行の入れ替えをすればできそうです。
planセクションを生成するcreatePlanSection
planセクションを生成するcreatePlanSectionはこちらです。
Function createPlanSection(ByVal ws As Object) As String
Dim str As String
str = ""
'section開始タグ
str = addHTML("", 0, "")
'***** セクションタイトルB1,セクション概要B2 *****
str = addHTML(str, 1, "" & ws.Range("B1").Value & "
" & ws.Range("B2").Value & "
")
'***** カラム *****
'class="row"の開始タグ
str = addHTML(str, 1, "")
Dim i As Long
For i = 5 To 8 '4カラム分繰り返し
'class="col-sm-x"の開始タグ
str = addHTML(str, 2, "")
'サムネイル画像(枠のみ)
str = addHTML(str, 3, "")
'タイトルB列&価格C列
str = addHTML(str, 3, "" & ws.Cells(i, 2).Value & "" & ws.Cells(i, 3).Value & "
")
'テキストD列
str = addHTML(str, 3, "" & ws.Cells(i, 4).Value & "
")
'class="col-sm-x"の閉じタグ
str = addHTML(str, 2, "</div>")
Next i
'class="row"の閉じタグ
str = addHTML(str, 1, "
")
'section閉じタグ
str = addHTML(str, 0, "
") & vbCr
createPlanSection = str
End Function
実行により出力されたデータをWordPressでプレビューしてみます。
バッチリですね。
まとめ
エクセルVBAで自動でHTML生成をするプログラムですが、今回はserviceセクションの文字列連結部分を関数化してスッキリさせるとともに、それを活用してplanセクションを生成する関数を作成しました。
あとトップページに関してはaboutですね。
次回、お伝えしていきたいと思います。
エクセル入力情報からWebサイトの会社概要のHTML文を生成するVBAプログラムエクセルの入力情報をもとに自動で企業サイト向けトップページのHTMLを生成していきます。今回は会社概要をテーブルで組んでいる箇所のHTMLを生成するVBAプログラムの作成を進めていきます。
お楽しみに!
連載目次:エクセルの入力情報からVBAでHTML文を自動生成
企業向けのWebサイトを作る際、エクセルの入力情報を元に自動でHTMLコードを生成できれば楽ですよね。本シリーズではBootstrapを使ったシングルページを想定してコードを生成するVBAプログラムを作っていきます。