ブロックサンプル：画像（1/2）

画像（1/2）

ブロックの設定を比較するサンプルです。各例の直前に変更設定と値を記載しています。

画像等は同梱素材を使用します。コピー用コードと書かれた例は、説明に従って必要なデータ・編集場所を用意してください。

sample-02892 / core/image　基本形

sample-02893 / core/image　url：url="https://balthasar.xsrv.jp/wp-content/uploads/2026/09/cocoon-block-samples-20260909-landscape.png"

sample-02894 / core/image　url：url="https://balthasar.xsrv.jp/wp-content/uploads/2026/09/cocoon-block-samples-20260909-portrait.png"

sample-02895 / core/image　url：url="https://balthasar.xsrv.jp/wp-content/uploads/2026/09/cocoon-block-samples-20260909-square.png"

sample-02896 / core/image　alt：alt="短いサンプル"

sample-02897 / core/image　alt：alt="長いサンプルの文章で折り返し方と余白の見え方を確認します。"

sample-02898 / core/image　caption：caption="短いサンプル"

sample-02899 / core/image　caption：caption="長いサンプルの文章で折り返し方と余白の見え方を確認します。"

sample-02900 / core/image　lightbox：lightbox={"enabled":false}

sample-02901 / core/image　lightbox：lightbox={"enabled":true}

sample-02902 / core/image　title：title="短いサンプル"

sample-02903 / core/image　title：title="長いサンプルの文章で折り返し方と余白の見え方を確認します。"

sample-02904 / core/image　href：href="#gallery-top"

sample-02905 / core/image　href：href="https://wordpress.org/"

sample-02906 / core/image　rel：rel="nofollow"

sample-02907 / core/image　rel：rel="noopener noreferrer"

sample-02908 / core/image　linkClass：linkClass="block-gallery-example"

sample-02909 / core/image　width：width="160px"

sample-02910 / core/image　width：width="50%"

sample-02911 / core/image　width：width="100%"

sample-02912 / core/image　height：height="80px"

sample-02913 / core/image　height：height="160px"

sample-02914 / core/image　height：height="240px"

sample-02915 / core/image　aspectRatio：aspectRatio="auto"

sample-02916 / core/image　aspectRatio：aspectRatio="1"

sample-02917 / core/image　aspectRatio：aspectRatio="4/3"

sample-02918 / core/image　aspectRatio：aspectRatio="3/4"

sample-02919 / core/image　aspectRatio：aspectRatio="3/2"

sample-02920 / core/image　aspectRatio：aspectRatio="2/3"

sample-02921 / core/image　aspectRatio：aspectRatio="16/9"

sample-02922 / core/image　aspectRatio：aspectRatio="9/16"

sample-02923 / core/image　scale：scale="cover"

sample-02924 / core/image　scale：scale="contain"

sample-02925 / core/image　focalPoint：focalPoint={"x":0,"y":0}

sample-02926 / core/image　focalPoint：focalPoint={"x":0.5,"y":0.5}

sample-02927 / core/image　focalPoint：focalPoint={"x":1,"y":1}

sample-02928 / core/image　sizeSlug：sizeSlug="thumbnail"

sample-02929 / core/image　sizeSlug：sizeSlug="medium"

sample-02930 / core/image　sizeSlug：sizeSlug="large"

sample-02931 / core/image　sizeSlug：sizeSlug="full"

sample-02932 / core/image　linkDestination：linkDestination="none"

sample-02933 / core/image　linkDestination：linkDestination="media"

sample-02934 / core/image　linkDestination：linkDestination="attachment"

sample-02935 / core/image　linkDestination：linkDestination="custom"

sample-02936 / core/image　linkTarget：linkTarget="_self"

sample-02937 / core/image　linkTarget：linkTarget="_blank"

sample-02938 / core/image　isDecorative：isDecorative=false

sample-02939 / core/image　isDecorative：isDecorative=true

sample-02940 / core/image　borderColor：borderColor="key-color"

sample-02941 / core/image　borderColor：borderColor="red"

sample-02942 / core/image　borderColor：borderColor="pink"

sample-02943 / core/image　borderColor：borderColor="purple"

sample-02944 / core/image　borderColor：borderColor="deep"

sample-02945 / core/image　borderColor：borderColor="indigo"

sample-02946 / core/image　borderColor：borderColor="blue"

sample-02947 / core/image　borderColor：borderColor="light-blue"

sample-02948 / core/image　borderColor：borderColor="cyan"

sample-02949 / core/image　borderColor：borderColor="teal"

sample-02950 / core/image　borderColor：borderColor="green"

sample-02951 / core/image　borderColor：borderColor="light-green"

sample-02952 / core/image　borderColor：borderColor="lime"

sample-02953 / core/image　borderColor：borderColor="yellow"

sample-02954 / core/image　borderColor：borderColor="amber"

sample-02955 / core/image　borderColor：borderColor="orange"

sample-02956 / core/image　borderColor：borderColor="deep-orange"

sample-02957 / core/image　borderColor：borderColor="brown"

sample-02958 / core/image　borderColor：borderColor="light-grey"

sample-02959 / core/image　borderColor：borderColor="grey"

sample-02960 / core/image　borderColor：borderColor="dark-grey"

sample-02961 / core/image　borderColor：borderColor="cocoon-black"

sample-02962 / core/image　borderColor：borderColor="cocoon-white"

sample-02963 / core/image　borderColor：borderColor="watery-blue"

sample-02964 / core/image　borderColor：borderColor="watery-yellow"

sample-02965 / core/image　borderColor：borderColor="watery-red"

sample-02966 / core/image　borderColor：borderColor="watery-green"

sample-02967 / core/image　borderColor：borderColor="ex-a"

sample-02968 / core/image　borderColor：borderColor="ex-b"

sample-02969 / core/image　borderColor：borderColor="ex-c"

sample-02970 / core/image　borderColor：borderColor="ex-d"

sample-02971 / core/image　borderColor：borderColor="ex-e"