Illustfolio Lumina - イラストレーターのための新しいポートフォリオサイトテンプレート
テーマのカスタマイズを進めていきましょう！
こまめに保存しながら作業を進めるのがよいでしょう。
全体的な外観を設定します。
| オプション名 | 説明 |
|---|---|
| タイトル | * 必須 |
| ブログの名前です。 |
例: John’s Portfolio | | 説明 | Tumblrのサービス内（スマホアプリ含む）でのブログの説明文です。 Illustfolio Luminaでは表示されませんが、Tumblr内で表示されたときの見栄えが良くなるので設定しておくことをおすすめします。
例: イラストレーターJohn Smithのポートフォリオサイト | | ヘッダ画像 | Tumblrのサービス内（スマホアプリ含む）でのヘッダ画像です。 Illustfolio Luminaでは表示されませんが、Tumblr内で表示されたときの見栄えが良くなるので設定しておくことをおすすめします。 また、SNSでトップページがシェアされたときの画像にも使われます。
2048 x 1152px (アスペクト比 16:9) 、ファイルサイズ10MB以下を推奨。 | | プロフィール画像 | プロフィール画像です。ヘッダとフッタに表示されます。 | | プロフィール画像の形 | 現時点では対応していません。 | | タイトルのフォント | 「Name」のフォントを変更できます。
Tumblrにないフォントを使うこともできます。 | | 背景色 | ヘッダの背景色を変更できます。
暗い背景色で文字が見えにくい場合、テーマオプション「Invert Header Text Color」を「有効」にしてください。 | | タイトル色 | 「Name」の文字色を変更できます。 | | 強調色 | 強調色（リンク文字色など）を変更できます。 | | ヘッダ画像を表示 | 現時点では対応していません。 | | ヘッダ画像を拡大する | 現時点では対応していません。 | | プロフィール画像を表示 | 現時点では対応していません。 | | タイトルを表示 | 現時点では対応していません。 | | 説明文を表示 | 現時点では対応していません。 |
<aside> ℹ️ 上記の設定に限り、「ブログ設定」の「外観を編集」ボタンからも編集することができます。
</aside>
| オプション名 | 説明 |
|---|---|
| タイトル | SNSでシェアされたときに表示される、ブログの名前です。 |
例: John’s Portfolio | | 説明 | SNSでシェアされたときに表示される、ブログの説明文です。
例: イラストレーターJohn Smithのポートフォリオサイト |
| オプション名 | 説明 |
|---|---|
| Cover | * 必須 |
| カバー画像（ヘッダに大きく表示される画像）です。 |
1024 x 1024pxの正方形、ファイルサイズ1MB以下を推奨。 ※ファイルサイズが大きいとページ表示速度が下がる場合があります。 | | Cover 2, Cover 3 | カバー画像に2枚目, 3枚目の画像を指定し、スライドショー形式で表示します。
1024 x 1024pxの正方形、ファイルサイズ1MB以下を推奨。 ※ファイルサイズが大きいとページ表示速度が下がる場合があります。 | | Body | 本文のフォントを指定できます。
デフォルト: Favorit
Tumblrにないフォントを使うこともできます。 | | Gallery layout | ギャラリーの表示方法を選択します。
Masonry: イラストをトリミングせず表示します。 Grid: イラストを正方形状に揃えて表示します。 | | Corner Style | 画像やボタンの角を丸くするか選択します。
Square: 角丸にしません。 Rounded: 角丸にします。 | | Hide Tumblr menu | サイトに表示されるTumblrのメニューを非表示にします。すっきりした表示にしたい場合、有効にすることをおすすめします。
デフォルト: 有効 | | Enable Infinite Scroll | 無限スクロールを有効にします。 画面下までスクロールすると、次のページを自動的に読み込みます。有効にすることをおすすめします。
デフォルト: 有効 | | Invert Header Text Color | ヘッダの文字色を反転（白文字に）します。背景色が暗い色で文字が読みにくい場合、有効にしてください。
デフォルト: 無効 | | Show Illustfolio Lumina Branding | フッタに小さく「Made with Illustfolio Lumina」のラベルを表示します。 表示するかは完全に任意ですが、有効にしていただけると作者が喜びます。
デフォルト: 有効 |
プロフィール部分を設定します。
| オプション名 | 説明 |
|---|---|
| Position | 職業・肩書を入力します。 |
例: Illustrator | | Name | * 必須 名前を入力します。
例: John Smith |
| Biography | 自己紹介を入力します。
文字数制限はありませんが、150字程度がバランスがよくおすすめです。
改行として<br>タグが使えます。
例: フリーランスのイラストレーター。ZZ県出身。<br> スマートフォンゲームのキャラクターデザイン、雑誌イラスト、ライトノベル挿絵などを担当。 個性的なキャラクターや魅力的な場面を描くのが得意です。<br> 第XX回YY社イラストコンテストでZZZ賞を受賞。<br> 好きなジャンルは「○○○︎」と「□□□︎」と「△△△」。 |
ソーシャルアカウント部分を設定します。
| オプション名 | 説明 |
|---|---|
| X URL | 入力すると、Xアカウントへのリンクを表示できます。 |
例: https://x.com/example | | Instagram URL | 入力すると、Instagramアカウントへのリンクを表示できます。
例: https://instagram.com/example | | Pixiv URL | 入力すると、pixivアカウントへのリンクを表示できます。
例: https://pixiv.net/users/example | | Bluesky URL | 入力すると、Blueskyアカウントへのリンクを表示できます。
例: https://bsky.app/profile/example | | Threads URL | 入力すると、Threadsアカウントへのリンクを表示できます。
例: https://threads.net/example | | Facebook URL | 入力すると、Facebookアカウントへのリンクを表示できます。
例: https://facebook.com/example | | YouTube URL | 入力すると、YouTubeチャンネルへのリンクを表示できます。
例: https://youtube.com/channel/example | | Website URL | 入力すると、自分のWebサイトへのリンクを表示できます。
例: https://example.com |
CTAボタンを設定します。ボタンは最大2つまで表示できます。
<aside> ℹ️ CTAボタンとは、ページの訪問者に対して何かしらの行動を促すものを指します。 詳しい自己紹介ページへの誘導、問い合わせページへの誘導などの用途がおすすめです。
</aside>
| オプション名 | 説明 |
|---|---|
| CTA button 1 label | ヘッダに表示する1個目のボタンのラベル（文言）を入力します。 |
| 詳しくは「ページを作る」をご覧ください。 |
例: 自己紹介 | | CTA button 1 path | 1個目のボタンのリンク先を入力します。 詳しくは「ページを作る」をご覧ください。
例: about | | CTA button 2 label | ヘッダに表示する2個目のボタンのラベル（文言）を入力します。 詳しくは「ページを作る」をご覧ください。
例: お仕事のご依頼 | | CTA button 2 path | 2個目のボタンのリンク先を入力します。 詳しくは「ページを作る」をご覧ください。
例: contact |
カテゴリーナビゲーション（作品をカテゴリーごとに分けて表示できる機能）の設定をします。
イラストの整理に役立つほか、自分がどんな種類のイラストが描けるのかアピールできるメリットも備わっています。
<aside> ℹ️ 本機能は、投稿につけられたタグをもとに分類します。 投稿にタグをつけていない場合は、「作品を投稿する」を参考に、まずタグをつけてください。
</aside>
| オプション名 | 説明 |
|---|---|
| Category 1 ~ 10 label | カテゴリーナビゲーションのラベル（文言）を入力します。最大10個まで入力できます。 |
例: Original Character Design Fanart … | | Category 1 ~ 10 tag | 「Category 1 ~ 10 label」のカテゴリーと紐づけたいタグを入力します。 各カテゴリーに紐づけられるタグは1つだけです。
例: Original Character Design Fanart … |
これでカスタマイズは終わりです。お疲れ様でした！
「せっかくサイトを作ったのに、ボタンのリンク先が間違っていた…」といったミスは、冗談でなく本当によく起こります。
そんなうっかりミスを防ぐために、動作確認はしっかり行いましょう。以下のチェックリストを使って確認してください。
<aside> ℹ️ チェックのコツは、「リンクやボタンを実際に押す」「PCとスマートフォン両方で確認する」です。
</aside>
<aside> ✅ チェックリスト
<aside> ✍️ テーマの更新情報をニュースレターでお知らせしますので、登録をおすすめします。 頻度は1ヶ月に1通程度です。登録はいつでも解除できます。
</aside>
<aside> 🤯 操作につまづいたと感じたら: どこが分かりにくかったのか、ぜひ教えてください！ 改善に役立てます。 本ドキュメントのトップページ「フィードバック・問い合わせ先」からお知らせください。
</aside>