WordPress.com
画像は WordPress.com サイトを向上させる素晴らしい方法です。 このガイドでは、画像を追加するさまざまな方法を紹介します。
目次
画像ファイルの種類
投稿やページには、次の種類の画像をアップロードできます:
- .jpg/.jpeg
- .gif
- .png
目次
画像ガイド
画像でできることはたくさんあるので、いくつかのページに分けています:
- 画像のアップロード – コンピュータ、ウェブ、メディアライブラリから投稿やページに画像を取り込むためのすべての作業です。
- 画像設定 – あなたの画像にタイトルまたはキャプションを追加してください。
- 画像の編集 – 画像が逆さまになっていたり、少し大きすぎたりしませんか?
- ギャラリーとスライドショー – ギャラリーやスライドショーで画像を表示します。
- 画像の最適化 – 画像を挿入する前にファイルサイズを小さくすると、アップロードとページの読み込みが速くなります。
- トラブルシューティング – 画像がアップロードされない?
- 無料画像やその他のメディアを探す – あなたのサイトにパブリックドメインやコピーレフトの画像が必要ですか? ここでは、それらを見つけるためのいくつかの提案があります!
目次
例
ここでは、ブロックを使用して画像を表示するさまざまな方法を示すいくつかの作業例を紹介します。 画像は、あなたのサイトで使用しているテーマによって異なって見えるので、あなたのサイトで試してみてください!
すべての画像は、Pexels Free Photo Libraryから提供されています。 ミニマルですが、Columns ブロックと組み合わせると、Coutoire テーマで紹介されているように、クリエイティブなデザインにすることができます。com
Rounded style:

Cover Block
Cover blockは全幅表示できるテーマで最も効果的な方法。 これは、Dalston、Alves、および Maywood テーマで素晴らしく紹介されています。
このブロックには、固定背景、グラデーションによるオーバーレイ、および異なる表示スタイルのオプションがあります。
Fixed Background ON

Fixed Background OFF
Gradients Overlay with Bottom and Top Wave styles


Gallery Block
ギャラリーブロックは、複数の写真を簡単に追加でき、それらを自動的に魅力的に配置することが可能です。
Slideshow Block
スライドショー ブロックは、ページや投稿であまりスペースを取らずに写真を共有するのに最適なブロックです。 Rivington theme.
以下の例では自動再生オプションを使用していますが、他のすべてのオプションについては Slideshow block guide.
-
Photo by Hendrik Cornelissen on Pexels.com -
Photo by Elena Blessing on Pexels.com -
photo by on Pexels.com -
Photo by Elena Blessing on Pexels.com
Media & Text Block
メディア & テキスト ブロックでは、画像や動画をテキストと一緒に並べて配置することが可能です。
モバイル デバイスでメディアとテキストを重ねる便利なオプションがあります。
Exford and Barnsbury のテーマでは、いくつかのクリエイティブな使用方法が紹介されています。”
– Toni Morrison


左は、モバイル オプションのスタックによるコンテンツの表示の仕方です。
画像比較ブロック
画像比較ブロックを使用して、2 つの画像を並べて(または上下に)配置し、スライダーを使用して 2 つの画像間の違いを明らかにすることができます。




Tiled Gallery Block
The Tiled Gallery block には角を丸くするオプションがあり、4 つのスタイルで提供されます。
- Tiled mosaic
- Circular grid
- Square tiles
- Tiled columns
これは画像を共有する独自の方法であり、Rivington テーマで紹介したようにスライドショー ブロックの素晴らしい相棒にもなりえます。
Tiled Mosaic





Circular(円形)





スクエア・タイル、オプションあり。 角丸





タイル張りコラム





CoBlock
CoBlock は GoDaddy が管理するブロックのライブラリです。 WordPressで利用できるようになりました。com で利用できます。 4 種類のギャラリーが含まれています:
そしていくつかの追加オプションが付いています。
- Enable an image lightbox
- Display or hide captions
- Link individual images
- Gutter controls to set the space between images
- Apply images filters (Grayscale, Sepia, Saturation, Dim, Vintage)
The gallery can be showncase in the Mayland Themeで示されているように、ギャラリーをフル幅で表示できるテーマを使用して、それを行うことができます。
Collage Block
Collage ブロックは、画像を美しいコラージュ ギャラリーに組み立てます。
デフォルトの表示
セピアフィルターによるタイル表示
<6778><7584>となる。
影効果とグレースケールフィルターによるレイヤー表示
Masonry Block
Masonry ブロックは、複数の画像を利用できる垂直スペースに基づいた最適な位置で表示するものです。 石工が壁に石をはめ込んでいくようなイメージです。
Offset Block
オフセットブロックは画像をオフセットブリックパターンギャラリーで表示するものである。
カルーセルブロック
ポストカルーセルブロックと間違えないように。 CoBlockカルーセルブロックは、カルーセルの中に画像だけを表示することができるブロックです。
どのように表示されるかのアニメーションはこちら:

The Carousel block is available on Business and eCommerce plan sites only installed plugins.
Stacked Block
The Stacked block displays multiple images in a single column stacked gallery.Do the blows the blows of the Carousel blocks.
彩度フィルタ
Vintage フィルタ
GIFブロック
GIFブロックによってGiphyから簡単にいくつかのGIF画像を追加することができるようになりました。
これは、あなたのサイトで感情を表現するためのカラフルな方法です。
Joy
Sad
多彩なプランと価格
-
無料
学生には最適
。
-
パーソナル
趣味に最適
-
プレミアム
フリーランスに最適
-
ビジネス
小規模企業に最適
選択プラン<2443>を見る