GROWI Demo

{{pagename}} - {{sitename}}

yunying-c

Admin

# イメージボード
# `日本語版`

## イメージボードとは？:face_with_monocle: 
- :art:**イメージボード**では、テーマに基づいた画像をまとめる際に利用します
- このテンプレートでは、複数の画像を横並びにして一覧で閲覧できるようになります
- インスピレーションやアイデアを視覚化し、プロジェクトを作成する際に役立てましょう:sparkles: 
  

## Personal Imageboard


#### イメージボードテンプレートの使い方

<a class="btn btn-secondary" data-toggle="collapse" href="#exception2">
使い方を見る
</a>
<div class="collapse" id="exception2" //以下はshow/hideで収納する画像です>

-----
編集画面を開き、以下の⬇️⬇️と⬆️⬆️の間にローカルの画像ファイルをアップロードしてください（ドラック＆ドロップ推奨）

⬇️⬇️⬇️⬇️⬇️⬇️⬇️⬇️⬇️⬇️⬇️⬇️⬇️⬇️⬇️⬇️⬇️⬇️⬇️⬇️
![soccer-ball-on-green-grass.jpg](/attachment/6588ea25af6c73f8294c2d8a)
![soccer-ball-on-grass-with-stadium-background.jpg](/attachment/6588ea2faf6c73f8294c2dd5)
![soccer-ball-on-green-grass.jpg](/attachment/6588ea25af6c73f8294c2d8a)
![soccer-ball-on-grass-with-stadium-background.jpg](/attachment/6588ea2faf6c73f8294c2dd5)

⬆️⬆️⬆️⬆️⬆️⬆️⬆️⬆️⬆️⬆️⬆️⬆️⬆️⬆️⬆️⬆️⬆️⬆️⬆️⬆️

ページを更新すると自動的にイメージボードが作成されます

#### 高度な使い方
- **Personal Imageboard** の `$refsimg(grid=col-3, grid-gap=1px)`中の `grid=col-3`の数字を調整すると横一列の画像の枚数を変えられます
- 添付画像を削除する方法は[こちら](https://docs.growi.org/ja/guide/features/delete_files.html)をご参照ください

-----

</div>


# `English Version`
## What is Imageboard? :face_with_monocle:
- **Imageboard** :art: is used to organize materials such as images based on certain themes.
- This template allows you to list out and view multiple images in a gallery style.
- Visualize your ideas and let's create your project!:sparkles: 
  

## Personal Imageboard



#### Way to Use Imageboard Template
<a class="btn btn-secondary" data-toggle="collapse" href="#exception2">
Click to learn
</a>
<div class="collapse" id="exception2" //the images below would be saved with show/hide button>

-----
Open the Edit Page and upload images between ⬇️⬇️ and ⬆️⬆️（dragging & dropping recommended）

⬇️⬇️⬇️⬇️⬇️⬇️⬇️⬇️⬇️⬇️⬇️⬇️⬇️⬇️⬇️⬇️⬇️⬇️⬇️⬇️




⬆️⬆️⬆️⬆️⬆️⬆️⬆️⬆️⬆️⬆️⬆️⬆️⬆️⬆️⬆️⬆️⬆️⬆️⬆️⬆️

Save your changes and the Imageboard would be made automatically

#### Advaned Usage
- Under the **Personal Imageboard** section, adjust the number of `grid=col-3` in `$refsimg(grid=col-3, grid-gap=1px)`, you can change the number of images in a horizontal row.
-  Please check [here](https://docs.growi.org/en/guide/features/delete_files.html) to learn how to delete attachment images

-----

</div>


# `中文版`
## 设计素材库是什么？:face_with_monocle: 
- :art: **设计素材库**用于整理收集到的图片素材，为设计提供灵感
- 使用这个模版，你可以在一行之内同时浏览多张图像
- 把你的灵感视觉化，使用素材库来完成你的设计吧！:sparkles: 


## Personal Imageboard


#### 设计素材库模版的使用方法
<a class="btn btn-secondary" data-toggle="collapse" href="#exception2">
详情点击此处
</a>
<div class="collapse" id="exception2" //以下的图像会被收纳到show/hide>

-----
打开编辑页面， 在⬇️⬇️和⬆️⬆️之间上传图像（推荐拖拽的方式上传图片）

⬇️⬇️⬇️⬇️⬇️⬇️⬇️⬇️⬇️⬇️⬇️⬇️⬇️⬇️⬇️⬇️⬇️⬇️⬇️⬇️




⬆️⬆️⬆️⬆️⬆️⬆️⬆️⬆️⬆️⬆️⬆️⬆️⬆️⬆️⬆️⬆️⬆️⬆️⬆️⬆️

页面保存更新后设计素材库会自动生成

#### 进阶使用指南
- 在**Personal Imageboard**板块调整`$refsimg(grid=col-3, grid-gap=1px)`中`grid=col-3` 的数字可以改变一行内显示图像的张数
- 关于如何删除素材库内图像的方法请参考[这里](https://docs.growi.org/en/guide/features/delete_files.html)

-----

</div>

イメージボード Preview

イメージボード

`日本語版`

イメージボードとは？🧐

Personal Imageboard

イメージボードテンプレートの使い方

高度な使い方

`English Version`

What is Imageboard? 🧐

Personal Imageboard

Way to Use Imageboard Template

Advaned Usage

`中文版`

设计素材库是什么？🧐

Personal Imageboard

设计素材库模版的使用方法

进阶使用指南